技術分享 | WEB 端常見 Bug 解析
⬇️ 點選“下方連結”，提升測試核心競爭力！
對於 WEB 產品來說，有一些常見的 Bug，本章節挑選一些比較典型的 Bug 進行舉例介紹。
UI Bug
頁面展示的時候，需要根據長度的邊界值去設計用例進行驗證。
一般來說都會有超長內容的驗證。看看文字超長之後，頁面展示會不會出現問題。
如果出現問題的話，可能就類似於這樣，出現了滾動條，內容被遮蓋了一部分。這是不想看到的場景,是需要進行修改的。比如可以折行展示，或者超出部分...，這些解決方案都是可以接受的。
這一類問題一般會出現在相容測試中。web 可能需要在各種系統的各種版本的不同瀏覽器上執行。
PC 端，手機端，Win、Mac、Linux、Android、iOS，這些裝置上的各種版本的瀏覽器。這些瀏覽器的核心和特性會有區別，就會導致在不同瀏覽器上頁面的展示可能會有錯亂的問題。比如圖裡問題，頁面最右側沒有顯示完全。
這是屬於介面的問題，圖中是一個註冊的介面，但是註冊密碼的要求沒有明確的進行說明。
可能使用者所有的都輸入完成了之後，點選註冊，才能得到密碼不符合要求的提示，這樣的使用者體驗會很差。
一般來說，輸入框是需要對要輸入內容的規則先說明清楚。
功能
這種 BUG 是平常工作中最常見的。核心就是功能沒有符合需求當中的要求。
比如圖裡是百度，輸入內容後，沒有搜尋到對應的內容，這就是沒有實現需求中要求的功能。
功能方面還有一些比較常見的 BUG 是提示資訊中帶了一些錯誤碼之類的內容，這些內容是不應該暴露給使用者的，給使用者的應該就是明確的中文提示。
還有一種比較常見的情況，就是 JS 指令碼會報錯。
如果遇到這種情況的時候，得先區分一下造成的原因是什麼。
1、網速過慢，網頁程式碼沒有完全下載就運行了，導致不完整
2、網頁設計錯誤，導致部分程式碼不能執行
3、瀏覽器不相容導致部分程式碼不能執行
4、瀏覽器快取出錯
5、網站伺服器訪問量太大，導致伺服器超負載，部分程式碼沒有完全下載就提示瀏覽器完畢，導致錯誤
更改不同步的問題是指登入後開啟多個頁面，在一個頁面中操作修改內容之後，在另一個頁面中檢視，但是已經修改過的內容在另一個頁面上沒有體現。
登入狀態不同步的問題是指開啟一個系統的多個頁面，其中一個頁面登入成功，在另一個頁面上重新整理，但是重新整理之後沒有同步為登入狀態。
其他
這種情況就涉及到網路請求了，可以到開發者工具的 NetWork 面板中檢視請求傳送的狀態，通過狀態碼是 400 就能簡單的定位是前端的請求傳送出了問題。
這種情況需要排查是網路的問題，還是網頁效能的問題。如果是效能問題的話，就需要進行鍼對性的優化了。
這種是對於輸入框進行測試的時候，可能會出現的問題。
因為 WEB 頁面本身就是 HTML 寫的，所以在輸入框中輸入 HTML 語言片段的話，如果沒有進行處理，頁面可能會有報錯資訊。就像圖中展示的這樣。
所以對於輸入框，應該覆蓋輸入 HTML 格式內容的測試用例。
推薦學習
⬇️ 點選“下方連結”，提升測試核心競爭力！