extension ExtPose

Görsel Test - UI Testing Inspector

CRX id

begcddgpiamjkanbgdcihlbfdmogcloo-

Description from extension meta

Web sayfalarını güncellemeden önce ve sonra görsel değişiklikleri detaylı raporlar ve DOM analizi ile karşılaştırın.

Image from store Görsel Test - UI Testing Inspector
Description from store Her kod güncellemesinden sonra “Önce-Sonra” görüntülerini tek tek kontrol etmekten yoruldunuz mu? UI Testing Inspector, tamamen yerel çalışan görsel diff aracı; piksel-pikselle karşılaştırma ve DOM/CSS analizini aynı raporda sunar. Neden kullanmalısınız? ⚡ %100 Yerel & Özel – ekran görüntüleri ve diff verileri yalnızca bilgisayarınızda; bulut yok, veri paylaşımı yok ⚡ Anında Geri Bildirim – temel çizgiyi (baseline) alın, kodu değiştirin, “Compare” deyin; farkları anında görün ⚡ Piksel-Mükemmel Algılama – insan gözünün kaçırabileceği en ufak değişiklikleri bile yakalar Öne Çıkan Özellikler 🔸 Tek Tıkla Baseline – istediğiniz sayfanın “önce” hâlini tek tıkla kaydeder 🔸 Pixel-Perfect Diff  – Before / After / Diff görüntüleri tek raporda 🔸 Inspect Element   – hangi DOM / CSS özelliği değişti, satır satır listeler 🔸 Viewport ↔ Full-page Yakalama 🔸 Rapor Geçmişi (14-15 önceki rapor) 🔸 Açık / Koyu Tema desteği Detaylı Raporun İçindekiler ✔️ Özet: yüzde fark + eklenen/kaldırılan/değişen öğe sayıları ✔️ Yan Yana Görünüm: Before / After / Diff karşılaştırması ✔️ DOM & CSS Değişiklik Listesi: renk, font-boyut, margin vb. kod düzeyi farklar Neleri Yakalarsınız ➤ Düzen kaymaları, hizalama hataları ➤ Renk ve stil değişiklikleri ➤ Eksik ya da taşınmış öğeler ➤ Yazı tipi / metin / görsel farkları Nasıl Çalışır 1️⃣ Sayfayı açın, “Set Baseline” tıklayın 2️⃣ Kod / içerik / CSS’i dilediğinizce değiştirin 3️⃣ “Compare with Baseline” tıklayın, ayrıntılı diff raporu açılır 4️⃣ Yan Yana görünüm + Değişiklik Listesi ile hataları analiz edin 5️⃣ Yeni tasarım tamamsa “Set Baseline” ile referansı güncelleyin Pro İpuçları ✨ Sayfa tam yüklenmeden baseline almayın Kapsamlı testte Full-page Capture kullanın Her seferinde aynı pencere boyutunda çekim yapın İçerik sabitken baseline alın Daha net sonuç için tek değişikliği test edin Büyük refactor öncesi önemli baseline’ları kaydedin Kullanım Senaryoları ✅ Görsel Regresyon Testi • UI/Tasarım Doğrulaması • CSS Refactoring • Front-end Test Work-flow’ları Kimler İçin? ➡️ Front-end Geliştiricileri, QA Mühendisleri, UI/UX Tasarımcıları, Freelancer’lar ve Küçük Ekipler Neden Öne Çıkıyor 🖼️ Manuel ekran görüntüsü kalabalığına son 📝 Öğrenme eğrisi = 0 SSS ❓ Değişiklikleri nasıl algılar? 💬 Çift yöntem – piksel-pikselle görsel karşılaştırma + yapısal DOM/CSS taraması. ❓ Verilerim güvende mi? 💬 Evet; tüm işlem ve saklama %100 yerelde, tarayıcınızda olur. ❓ Localhost’ta çalışır mı? 💬 Kesinlikle; yerel geliştirme sırasında da sorunsuzdur. ❓ Dinamik içerik? 💬 Statik durumları karşılaştırmak için tasarlandı; en iyi sonuç için animasyonlar bittiğinde çekim yapın. ülerinizi yakalayın.

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.

Statistics

Installs
25 history
Category
Rating
5.0 (1 votes)
Last update / version
2025-07-04 / 1.0.0
Listing languages

Links