Description from extension meta
Jämför visuella förändringar före och efter uppdatering av webbsidor med detaljerade rapporter och DOM-analys.
Image from store
Description from store
Trött på att manuellt kontrollera visuella fel efter varje kodändring? UI Testing Inspector är ditt pålitliga verktyg för att hitta visuella skillnader med DOM-analys.
Varför använda?
⚡ 100 % Lokalt & Privat: alla skärmdumpar och jämförelsedata stannar på din dator – inga molntjänster, ingen datadelning
⚡ Omedelbar feedback-loop: installera tillägget, skapa en baslinje, gör kodändringar och se skillnaderna direkt – perfekt för snabba regressionstester
⚡ Pixelperfekt detektering: fånga även de minsta visuella förändringarna som ögat kan missa
Huvudfunktioner
🔸 Baslinje med ett klick – fånga ”före”-läget för valfri sida med ett klick
🔸 Pixelperfekt visuell diff – tydlig rapport med baslinje, aktuellt läge och markerade skillnader
🔸 Elementinspektion – se vad som ändrats i DOM och CSS, inte bara i koden
🔸 Fångst av hel sida eller viewport
🔸 Rapporthistorik – spara och granska upp till 15 tidigare rapporter
🔸 Ljusa & mörka teman – bekväm visning dag som natt
Inuti den detaljerade rapporten
🔍 Efter varje jämförelse får du:
✔️ Sammanfattning – procent skillnad och antal ändrade element
✔️ Sida-vid-sida-vy – ”Före / Efter” plus markerad ”Skillnader”-bild
✔️ Lista över DOM- & CSS-ändringar – färg, font, marginal m.m.
Vad du fångar
➤ Layoutförskjutningar & justeringsfel
➤ Färg- och stiländringar
➤ Saknade eller flyttade element
➤ Typsnitts- och textändringar
➤ Bildskillnader
Så fungerar det
1️⃣ Ställ in visuell baslinje
2️⃣ Gör kodändringar med förtroende
3️⃣ Klicka ”Jämför med baslinje” – detaljerad rapport öppnas i ny flik
4️⃣ Analysera skillnader och åtgärda fel
5️⃣ Uppdatera baslinjen när du är nöjd
Professionella tips
✨ Vänta tills sidan laddats helt före baslinjefångst
✨ Använd helsidesfångst för heltäckande tester
✨ Samma fönsterstorlek för exakta jämförelser
✨ Fånga baslinjer när innehållet är stabilt
✨ Testa en ändring åt gången för tydliga resultat
✨ Spara viktiga baslinjer innan stora refaktoreringar
Användningsfall
✅ Visuell regressionstestning
✅ Verifiering av UI/design
✅ Orädd CSS-refaktorisering
✅ Frontend-flöden med omedelbar visuell feedback
För vem
➡️ Frontend-utvecklare • QA-ingenjörer • UI/UX-designers • Frilansare & små team
Varför det sticker ut
🖼️ Bättre än manuella skärmdumpar
📝 Noll inlärningskurva – lätt att använda
Vanliga frågor
❓ Hur upptäcks förändringar?
💬 Pixel-för-pixel-jämförelse + strukturell DOM/CSS-skanning.
❓ Är min data säker?
💬 Ja – allt bearbetas och lagras 100 % lokalt i webbläsaren.
❓ Fungerar det på localhost?
💬 Självklart – perfekt för lokal utveckling.
❓ Dynamiskt innehåll?
💬 Jämför statiska lägen: fånga när animationer och annonser har stabiliserats.
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.