CÁCH KIỂM TRA PHẦN TỬ

     

Chào độc giả lại là mình đây, lần này con quay trở lại với cùng 1 chủ đề mới nhưng không lạ

*
. Hy vọng các bạn sẽ ứng dụng nó tốt trong quá trình kiểm test của mình

1. Lời mở đầu

Bạn đã khi nào tò dò rằng website bạn đã kiểm thử có cấu trúc như thế nào, rất có thể xem text, màu, hình trạng chữ một cách nhanh nệm thay bởi dùng thêm một phần mềm hoặc lạch cạnh đi hỏi mấy ông developer.

Bạn đang xem: Cách kiểm tra phần tử

Bạn cũng muốn biết từng action mà bạn click, request giữ hộ đi thua trận hay thành công

Hay bạn muốn biết một số lỗi vì server với muốn hỗ trợ dev của bạn tìm lỗi.

Tôi sẽ biết 1 cách đơn giản là kiểm tra bộ phận hay còn được gọi là Inspect element

1. Elements

Muốn xem kết cấu trang web một cách nhanh độc nhất vô nhị trên Chrome chúng ta làm như sau:

Click loài chuột phảiChọn Inspect

Lúc này cấu trúc Inspect element đã hiển thị bao gồm các tab chính

ElementsConsoleSourceNetworkPerformanceMemoryApplicationSecurityAudits

Ngoài ra còn 1 số tab bé dại khác và lựa chọn kiểu hiển thị (mobile giỏi website)Đầu tiên là tab Elements (hình như dưới)

*
Default focus vào trong dòng mà bạn click chuột phải. Khi hover con chuột qua từng line trong cấu tạo html thì khớp ứng giao diện đã mark xanh vào vùng tương ứng. Để ý sang trọng phía bên phải sẽ sở hữu được tab nhỏ style, tại phía trên ta tất cả thể kiểm tra kiểu chữ, size, color sắc, chỉnh sửa ...

Ví dụ:

Bạn muốn đổi khác text để chạy thử hiển thị thì cũng cứ bạo dạn nhập thôi bởi vì nếu code giỏi thì các thứ chúng ta nghịch nó sẽ không còn lưu đâu, code nhưng mà lởm thì chính là bug rồi

*

Hay bạn muốn lấy mã màu đúng chuẩn của 1 vùng trên website ta thực hiện như sau

Click vào vùng ô vuông đựng màu vào tab Style (vùng khoanh đỏ)

*

Hover con chuột trên màn hình hiển thị vào khoanh vùng cần rước màu và bấm vào trái

*

Tại đây color và mã color được hiển thị, việc của người tiêu dùng chỉ việc đối chiếu thôi

*
cũng đơn giản và dễ dàng phải không nào.

Xem thêm: Thuyết Minh Về Cầu Sông Hàn Đà Nẵng, Bài Văn ❤️️ 10 Bài Văn Hay

2. Console

Đây là nơi cấu tạo dữ liệu sẽ tiến hành như nàokiểu như

*

Điều này sẽ hữu dụng cho chúng ta hơn khi chúng ta biết về kỹ thuật, bạn sẽ hiểu kết cấu dữ liệu tất cả đúng hay không đồng thời cung ứng dev có tác dụng việc tác dụng hơn.

Cũng là địa điểm lỗi vẫn hiển thị là nơi phiên bản nhìn thấy. Khi gồm lỗi các bạn không cần vồ cập nó là gì , cũng không cần hiểu nó không đúng ở đâu. Việc của bạn là copy loại đoạn lỗi đó cùng gửi mang lại dev thôi.

Ví dụ như:

*

3. Sources

Khi bạn test 1 màn hình hay là một function như thế nào đó, để giúp dev log bug kia ở class như thế nào cho cấp tốc gọn hơn thì bạn lựa chọn tab Source. Trên đây bạn có thể biết được bug đang xảy ra tại class nào. Nhưng lại đây chỉ là kiểm soát thôi, chứ bắt đầu bug phân phát sinh tất cả phải bởi vì class đó hay class phụ thân của nó hay không thì cứ nhằm dev, trình độ chuyên môn của bọn họ sâu hơn sẽ hiểu và biết vì sao nhanh hơnPhần này thường thì Tester cũng chỉ quan sát thôi chứ cũng không làm những gì được

*

4. Network

Tab này tương đối quan trọng, đấy là nơi ta hiểu rằng request mình giữ hộ đi có thực thi thành công xuất xắc thất bại, thời gian request là bao lâu, repone trả về là gì.

Xem thêm: Bảng Xếp Hạng Đua Xe F1 2021, Top 18 Bxh Dua Xe F1 Moi Nhat Hay Nhất 2022

*

Như hình ảnh trên ta có thể nhìn thấy những request gửi đi đã có hiệu quả là 200 thành côngTương ứng với những respone:

1xx: Informational – Yêu mong (request) đã làm được nhận, liên tiếp tiến trình xử lí2xx: Success/Unsuccess – Thành công/ không thành công3xx: Redirection – gửi hướng4xx: Client Error – Yêu ước sai cú pháp hoặc ko thỏa đáng5xx: vps Error – sản phẩm chủ chạm mặt lỗiTa có thể đọc được từng request như thế nào thì gặp mặt lỗi gì, vấn đề biết cụ thể đó là bug vì chưng đâu cũng tiện lợi giúp bạn log bug phải chăng hơn

5. Kết luận

Trên đây tôi chỉ liệt kê 4 tab đầu , hết sức cơ phiên bản của việc Inspect mà mình đã từng được trải nhiệm qua. Nó khá đơn giản dễ dàng mà ai làm nhiệm vụ test cũng đều cần biết. Nếu bao gồm thời gian khám phá thì lần sau mình đang viết thêm về chủ đề này.Mong rằng rất nhiều trải nhiệm vẫn tồn tại non nớt của bản thân mình sẽ giúp bạn áp dụng được điều gì đấy vào trong các bước của mình.