Description from extension meta
Porównuj zmiany wizualne przed i po aktualizacji stron internetowych za pomocą szczegółowych raportów i analizy DOM.
Image from store
Description from store
Zmęczony ręcznym sprawdzaniem błędów wizualnych po każdej zmianie kodu? UI Testing Inspector to niezawodne narzędzie do sprawdzania różnic wizualnych z analizą DOM.
Dlaczego warto używać?
⚡️ 100 % Lokalnie i Prywatnie: wszystkie zrzuty ekranu i dane porównawcze pozostają na Twoim komputerze. Brak usług chmurowych, brak udostępniania danych
⚡️ Natychmiastowa pętla sprzężenia zwrotnego: zainstaluj rozszerzenie, ustaw bazę, wprowadź zmiany w kodzie i natychmiast zobacz różnice. Idealne do szybkich testów regresji
⚡️ Wykrywanie perfekcyjne na poziomie pikseli: złap nawet najmniejsze zmiany wizualne, które ludzkie oko może przegapić
Główne funkcje
🔸 Baza jednym kliknięciem – przechwyć stan „przed” dowolnej strony jednym kliknięciem
🔸 Perfekcyjna różnica wizualna na poziomie pikseli – raport z bazą, aktualnym stanem i podświetlonymi różnicami
🔸 Inspekcja elementów – podgląd zmian w DOM i CSS, nie tylko w kodzie
🔸 Przechwytywanie pełnej strony lub viewportu
🔸 Historia raportów – zapisz i przeglądaj do 15 wcześniejszych raportów
🔸 Jasny i ciemny motyw – wygodne oglądanie, w dzień lub w nocy
Wewnątrz szczegółowego raportu
🔍 Po każdym porównaniu otrzymujesz:
✔️ Podsumowanie – % różnic oraz liczba zmodyfikowanych elementów
✔️ Widok obok siebie – „Przed / Po” i obraz „Różnice”
✔️ Lista zmian DOM & CSS – dokładne różnice koloru, czcionki, marginesu
Co przechwycisz
➤ Przesunięcia układu i błędy wyrównania
➤ Zmiany kolorów i stylów
➤ Brakujące lub przesunięte elementy
➤ Modyfikacje czcionek i tekstu
➤ Różnice w obrazach
Jak to działa
1️⃣ Ustaw wizualną bazę
2️⃣ Dokonaj zmian w kodzie z pewnością
3️⃣ Kliknij „Porównaj z Bazą” – szczegółowy raport w nowej karcie
4️⃣ Przeanalizuj różnice i popraw błędy
5️⃣ Zaktualizuj bazę, gdy jesteś zadowolony
Wskazówki profesjonalne
✨ Poczekaj na pełne załadowanie strony przed bazą
✨ Używaj pełnego przechwytywania strony do kompleksowych testów
✨ Zrzuty ekranu w tym samym rozmiarze okna dla dokładności
✨ Przechwytuj bazę, gdy treść jest stabilna
✨ Testuj po jednej zmianie dla jasnych wyników
✨ Zapisuj ważne bazy przed dużą refaktoryzacją CSS
Przykłady użycia
✅ Wizualne testy regresji
✅ Weryfikacja UI / designu
✅ Odważna refaktoryzacja CSS
✅ Front-end workflows z natychmiastowym feedbackiem
Dla kogo
➡️ Front-end deweloperzy • Inżynierowie QA • Projektanci UI/UX • Freelancerzy i małe zespoły
Dlaczego się wyróżnia
🖼️ Lepsze niż ręczne zrzuty ekranu
📝 Zerowa krzywa uczenia – łatwe w użyciu
FAQ
❓ Jak wykrywa zmiany?
💬 Porównanie piksel-po-pikselu + strukturalny skan DOM/CSS.
❓ Czy moje dane są bezpieczne?
💬 Tak, wszystko przetwarzane i przechowywane 100 % lokalnie w przeglądarce.
❓ Czy mogę używać na localhost?
💬 Oczywiście – działa świetnie podczas lokalnego developmentu.
❓ Co z treścią dynamiczną?
💬 Najlepsze wyniki po zrzucie ekranu w stabilnym stanie strony (po animacjach, stabilnych reklamach).
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.