UI-Tool Storybook 8 bringt Add-on für visuelles Testing
Ein neues Add-on ermöglicht visuelles Testing mit Chromatic, um Bugs schneller aufspüren zu können. Es befindet sich derzeit in der Beta-Phase.
(Bild: LeManna / Shutterstock.com)
- Maika Möbus
Storybook hat die neue Hauptversion 8.0 erreicht. Das quelloffene Tool zum Entwickeln und Testen von UI-Komponenten setzt darin über 8800 Commits um. Sie betreffen unter anderem das Testing und die Dokumentation sowie die Kompatibilität mit React, Vue, Angular, Web Components und Svelte. Als eines der Highlights ist visuelles Testing mit Chromatic per Add-on im Beta-Status verfügbar.
Schnellerer Überblick durch visuelles Testing
Das neue Add-on Visual Tests soll Storybook-Usern ermöglichen, UI-Bugs schneller und einfacher zu entdecken. Es bietet Zugriff auf die visuelle Testing-Plattform Chromatic, die Storybook 2017 veröffentlicht hat. Dieser Cloud-Service dient dazu, visuelle Tests zu automatisieren, indem er Snapshots von Stories vor und nach jeder Änderung vergleicht. Visuelle Tests in Storybook sind durch das Add-on nun möglich, ohne Änderungen committen zu müssen.
(Bild: Storybook-Dokumentation)
Letzten Monat begann das Add-on seine Beta-Phase und befindet sich auch mit Erscheinen der neuen Storybook-Hauptversion weiterhin im Beta-Status. Ab Storybook 7.6 lässt es sich mit folgendem Befehl installieren:
npx storybook@latest add @chromatic-com/storybookBeim Starten von Storybook erscheint dann ein neues Add-on-Panel Visual Tests, in dem sich Tests ausführen und Ergebnisse betrachten lassen. Voraussetzung für das visuelle Testen sind eine Anmeldung bei Chromatic via GitHub, Bitbucket, GitLab oder per Mail sowie das Erstellen eines Projekts. Bis zu 5000 Snapshots monatlich sind kostenlos enthalten, darüber hinaus ist ein Chromatic-Upgrade erforderlich.
Weitere Informationen und Konfigurationsoptionen sind der Dokumentation des Add-ons zu entnehmen.
Updates für React Server Components, Vite und mehr
Reacts Paradigmenwechsel zu React Server Components (RSC) – bei dem das Rendern von Komponenten ausschließlich auf dem Server geschieht – geht auch an Storybook nicht vorbei. Das neue Release bringt Support für RSC, der derzeit noch als experimentell gekennzeichnet ist, da er einzig mit dem React-Framework Next.js kompatibel ist.
(Bild: best_vector/Shutterstock)
Die Enterprise-JavaScript-Konferenz enterJS findet am 7. und 8. Mai in Mainz statt. Die Veranstalter dpunkt.verlag und iX präsentieren über 35 Vorträge und drei Workshops zu Themen wie JavaScript im Allgemeinen, Frameworks im Speziellen sowie Tools und Techniken rund um die Programmiersprache.
Auszug aus dem Programm:
Wie das Storybook-Team hervorhebt, war einer der größten Vorteile in Version 7 der Zero-Configuration-Support für Vite. Allerdings habe Storybook teils zu viel konfiguriert, was das Verwenden unterschiedlicher Vite-Versionen erschwert habe. Nun kann Storybook auch mit Vite 5 umgehen, der neuesten Hauptversion des Build-Tools, und bietet zudem mehr Konfigurationsmöglichkeiten für Vite-Plug-ins wie plugin-react oder plugin-vue und lagert diese Abhängigkeiten aus. Da laut dem Entwicklungsteam aber nahezu alle Vite-Projekte diese Plug-ins vorkonfiguriert nutzen, sollen von Entwicklerseite nur selten Änderungen notwendig sein.
Detaillierte Informationen zu diesen und weiteren Neuerungen – darunter zwei- bis vierfach beschleunigte Test-Builds und ein aktualisiertes User Interface für Mobile und Web – bietet der Storybook-Blog.
(mai)
