Description from extension meta
So sánh các thay đổi trực quan trước và sau khi cập nhật trang web với báo cáo chi tiết và phân tích DOM.
Image from store
Description from store
Bạn mệt mỏi vì phải kiểm tra thủ công từng thay đổi giao diện sau mỗi lần sửa code?
UI Testing Inspector là công cụ so sánh giao diện 100 % cục bộ, phát hiện khác biệt pixel, phân tích DOM/CSS và xuất báo cáo ngay trong trình duyệt.
Tại sao nên dùng?
⚡ 100 % cục bộ & riêng tư — ảnh chụp màn hình và dữ liệu so sánh chỉ lưu trên máy bạn; không đám mây, không chia sẻ dữ liệu
⚡ Phản hồi tức thì — tạo baseline, sửa code, nhấn “So sánh” và xem khác biệt ngay lập tức; lý tưởng cho kiểm thử hồi quy nhanh
⚡ Phát hiện pixel hoàn hảo — bắt cả những thay đổi nhỏ nhất mà mắt người dễ bỏ lỡ
Tính năng nổi bật
🔸 Baseline một cú nhấp — lưu trạng thái “Trước” của bất kỳ trang nào chỉ với 1 click
🔸 Pixel-Perfect Diff — báo cáo Before / After / Diff rõ ràng
🔸 Inspect Element — liệt kê chi tiết các thay đổi DOM & CSS
🔸 Chụp Viewport hoặc Toàn trang tuỳ chọn
🔸 Lưu lịch sử báo cáo 14–15 lần gần nhất
🔸 Chủ đề Sáng/Tối — xem thoải mái ngày đêm
Bên trong báo cáo chi tiết
✔️ Tóm tắt — % khác biệt + số lượng phần tử thêm/xoá/sửa
✔️ So sánh song song — Before, After, Diff cạnh nhau
✔️ Danh sách thay đổi DOM & CSS — màu sắc, font, margin… đều được liệt kê rõ
Bạn sẽ phát hiện
➤ Dịch chuyển bố cục, lỗi căn chỉnh
➤ Thay đổi màu sắc, kiểu dáng
➤ Phần tử bị thiếu hoặc di chuyển
➤ Sửa đổi font, văn bản, hình ảnh
Cách hoạt động
1️⃣ Mở trang cần kiểm thử, nhấn “Đặt Baseline”
2️⃣ Sửa code, CSS, nội dung tuỳ ý
3️⃣ Nhấn “So sánh với Baseline” để xem báo cáo
4️⃣ Phân tích bằng chế độ song song & danh sách thay đổi
5️⃣ Hài lòng với giao diện mới? Nhấn “Đặt Baseline” để cập nhật tham chiếu
Mẹo chuyên nghiệp ✨
Đợi trang tải xong mới chụp baseline
Dùng chụp toàn trang để kiểm thử toàn diện
Luôn chụp ở cùng kích thước cửa sổ trình duyệt
Chụp baseline khi nội dung đã ổn định
Kiểm thử từng thay đổi một để thấy diff rõ ràng
Lưu baseline quan trọng trước khi refactor lớn
Trường hợp sử dụng ✅
Kiểm thử hồi quy giao diện • Xác minh UI/Thiết kế • Refactor CSS an toàn • Quy trình kiểm thử frontend
Dành cho ai ➡️ Lập trình viên Frontend, Kỹ sư QA, Nhà thiết kế UI/UX, Freelancer & Nhóm nhỏ
Điểm nổi bật 🖼️ Không còn phải quản lý ảnh Before/After thủ công 📝 Không cần học, ai cũng dùng được
FAQ
❓ Phát hiện thay đổi như thế nào?
💬 So sánh pixel-theo-pixel + quét cấu trúc DOM/CSS song song.
❓ Dữ liệu của tôi có an toàn không?
💬 100 % xử lý và lưu trữ cục bộ trong trình duyệt của bạn.
❓ Có dùng được trên localhost không?
💬 Hoàn toàn được, hoạt động tốt khi phát triển local.
❓ Nội dung động thì sao?
💬 Nên chụp khi hoạt ảnh đã hoàn thành, nội dung ổn định để kết quả chính xác nhất.
Latest reviews
- (2025-07-09) Дарья Петрова: Creates a full and detailed report of differences between two versions of web pages. Waiting for Visual comparison of whole page, not just viewport visible parts.