CRX id
begcddgpiamjkanbgdcihlbfdmogcloo
begcddgpiamjkanbgdcihlbfdmogcloo
Description from extension meta
Pengujian regresi visual tempatan untuk laman web - bandingkan perubahan UI secara visual dan kesan perbezaan DOM/CSS tanpa cloud
Image from store
Description from store
Penat memeriksa pepijat visual secara manual selepas setiap perubahan kod? UI Testing Inspector ialah pemeriksa perbezaan visual tempatan yang boleh dipercayai dengan analisis DOM.
Mengapa menggunakannya?
⚡ 100 % Tempatan & Peribadi: semua tangkapan skrin dan data perbandingan kekal di komputer anda. Tiada perkhidmatan awan, tiada perkongsian data
⚡ Maklum Balas Segera: pasang sambungan, ambil garis dasar, buat perubahan kod, dan lihat perbezaan serta-merta. Sempurna untuk ujian regresi pantas
⚡ Pengesanan Pixel-Sempurna: tangkap perubahan visual terkecil yang mungkin terlepas oleh mata manusia
Ciri Utama
🔸 Garis Dasar Satu Klik: tangkap keadaan “sebelum” mana-mana halaman web dengan satu klik
🔸 Perbezaan Visual Pixel-Sempurna: laporan jelas yang menunjukkan garis dasar, keadaan semasa, dan perbezaan tepat
🔸 Periksa Elemen: lihat apa yang berubah dalam DOM dan CSS, bukan sekadar kod
🔸 Tangkapan Halaman Penuh atau Viewport
🔸 Sejarah Laporan: simpan dan semak sehingga 15 laporan terdahulu
🔸 Tema Terang & Gelap: tontonan selesa siang atau malam
Di Dalam Laporan Terperinci
🔍 Selepas setiap perbandingan, anda mendapat laporan komprehensif:
✔️ Ringkasan: peratus perbezaan visual dan bilangan elemen ditambah, dikeluarkan, diubah suai
✔️ Paparan Sebelah-Menyebelah: “Sebelum” / “Selepas” di sebelah imej “Perbezaan” yang diserlahkan
✔️ Senarai Perubahan DOM & CSS: elemen tepat yang berubah, termasuk warna, saiz fon, margin
Apa Yang Akan Anda Tangkap
➤ Peralihan susun atur & ketidakselarasan
➤ Perubahan warna & gaya
➤ Elemen hilang atau dipindahkan
➤ Pengubahsuaian fon & teks
➤ Perbezaan imej
Bagaimana Ia Berfungsi
1️⃣ Tetapkan Garis Dasar Visual
2️⃣ Lakukan perubahan kod dengan yakin
3️⃣ Klik “Bandingkan dengan Garis Dasar” untuk laporan terperinci
4️⃣ Analisis perbezaan, perbaiki isu
5️⃣ Kemas kini Garis Dasar apabila berpuas hati
Tip Pro
✨ Tunggu halaman dimuat sepenuhnya sebelum tangkapan
✨ Gunakan tangkapan halaman penuh untuk ujian menyeluruh
✨ Tangkapan skrin dengan saiz tetingkap yang sama untuk perbandingan tepat
✨ Tangkap garis dasar apabila kandungan stabil
✨ Uji satu perubahan pada satu masa untuk hasil jelas
✨ Simpan garis dasar penting sebelum refaktor besar
Kes Penggunaan
✅ Ujian Regresi Visual
✅ Pengesahan UI/Direka Bentuk
✅ Refaktor CSS tanpa risiko
✅ Aliran kerja ujian frontend
Untuk Siapa Ini Dibina
➡️ Pembangun Frontend
➡️ Jurutera QA
➡️ Pereka UI/UX
➡️ Freelance & Pasukan Kecil
Mengapa Ia Menonjol
🖼️ Lebih baik daripada tangkapan skrin manual
📝 Keluk pembelajaran sifar – mudah digunakan
Soalan Lazim
❓ Bagaimana ia mengesan perubahan?
💬 Perbandingan pixel-demi-pixel + imbasan struktur DOM/CSS.
❓ Adakah data saya selamat?
💬 Ya. Semua diproses & disimpan 100 % secara tempatan dalam pelayar anda.
❓ Bolehkah saya gunakannya pada localhost?
💬 Sudah tentu! Berfungsi hebat semasa pembangunan tempatan.
❓ Bagaimana dengan kandungan dinamik?
💬 Direka untuk keadaan statik – tangkap skrin apabila animasi & iklan stabil.
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.