Playwright provides automated browser testing. It offers a built-in feature to perform visual regression testing for your website.
Von diesen Unternehmen vertraut
Codelose visuelle UI-Tests
Beginnen Sie in wenigen Minuten mit dem Testen Ihrer Website auf UI-Fehler. Geben Sie einfach Ihre URL ein und wählen Sie aus, auf welchen Browsern Sie testen möchten. Legen Sie fest, wie oft der Test ausgeführt werden soll und wie Sie benachrichtigt werden möchten.
Wenn eine visuelle Änderung vorgenommen wurde, erhalten Sie sofort eine Benachrichtigung mit einem Screenshot und einem Vergleichsbild, das die Änderung hervorhebt.
Dokumentation anzeigenVereinfachen Sie UI-Tests und erhöhen Sie die UI-Abdeckung
Ersetzen Sie Testaussagen durch einen einzigen visuellen Schnappschuss. Decken Sie Bereiche ab, die mit herkömmlichen Funktionstests nicht möglich sind, und erhöhen Sie die Testabdeckung und das Vertrauen in die Qualitätssicherung.
Erfassen Sie Screenshots und vergleichen Sie diese automatisch mit den Baselines. Durch die verbesserte visuelle Abdeckung stellen Teams Code mit größerer Sicherheit bereit.
Überprüfen und genehmigen Sie Änderungen
Sie und Ihr Team können die Ergebnisse der visuellen Tests einsehen und bestimmte visuelle Änderungen genehmigen oder ablehnen. Vergleichen Sie mit einem Schieberegler zwischen dem Basis-Screenshot und dem neuen Screenshot oder überprüfen Sie ein Diff-Bild der aufgetretenen Änderungen.
Ändern Sie den Schwellenwert für die Pixelempfindlichkeit und testen Sie ihn mit verschiedenen Bildschirmauflösungen. Finden Sie visuelle Fehler im Quer-/Hochformat auf echten Android-/iOS-Geräten.
Test Frameworks
Integrieren Sie TestingBot Visual UI-Tests in Ihre vorhandenen Testskripte. Beginnen Sie mit dem Testen auf echten Browsern und physischen Mobilgeräten, indem Sie ein paar Codezeilen hinzufügen. Dokumentation anzeigen
Kostenlose Anmeldung
Beginnen Sie mit dem visuellen Testen Ihrer Apps und Websites mit TestingBot.
Keine Kreditkarte benötigt!
Häufig gestellte Fragen
TestingBot führt automatisierte Pixel-für-Pixel-Vergleiche zwischen einem Bild, das Sie als korrekt markiert haben, und einem neuen Screenshot durch, der gerade aufgenommen wurde. Überschreitet die Anzahl der unterschiedlichen Pixel den Schwellenwert, gilt der Test als fehlgeschlagen.
Dies kann passieren, wenn Sie eine neue Version Ihrer Website bereitstellen, die einen falschen CSS-Stil oder eine falsche Positionierung aufweist oder auf der Seite fehlt. Erkennen Sie visuelle Fehler, bevor diese der UX Ihrer Webseiten schaden.
Mit regelmäßigen Funktionstests können Sie Abmessungen, Positionierung und Styling testen. Der Nachteil besteht darin, dass es bald zu einer großen Belastung durch Prüfpunkte in Ihrem Code wird.
Anstatt die visuellen Überprüfungen in Ihrem Code durchzuführen, ist es viel effizienter, Schnappschüsse zu erstellen und diese zu vergleichen. Die visuellen Ergebnisse sind außerdem für Entwickler und Qualitätssicherung viel einfacher zu interpretieren.
Idealerweise führen Sie visuelle Prüfungen als Teil Ihrer CI/CD-Pipeline durch. Es kann nach jedem Einchecken des Front-End-Codes ausgeführt werden, um sicherzustellen, dass sich neuer Code nicht negativ auf Ihr Produkt auswirkt.
Algorithmen für maschinelles Lernen können trainiert werden, um visuelle Unterschiede zu entdecken. KI ist auf trainierte Daten angewiesen und kann daher falsch positive/negative Ergebnisse melden. Es handelt sich nicht um eine Einheitslösung, die im Vergleich zur exakten Pixelanpassung häufig versagt.
Snapshot-Tests im Rahmen des visuellen Testens der Benutzeroberfläche auf Webseiten erfassen Screenshots des Anfangszustands einer Webseite. Anschließend werden sie mit nachfolgenden Renderings verglichen. Tests gelten als nicht bestanden, wenn eine oder mehrere Änderungen im visuellen Erscheinungsbild auftreten. Dadurch wird sichergestellt, dass UI-Elemente konsistent bleiben.