Zum Hauptinhalt springen

Jest 23: 🔥 Blitzschnelles, begeisterndes Testen

· 7 Minuten Lesezeit
Ricky Hanlon
Ricky Hanlon
Inoffizielle Beta-Übersetzung

Diese Seite wurde von PageTurner AI übersetzt (Beta). Nicht offiziell vom Projekt unterstützt. Fehler gefunden? Problem melden →

Heute freuen wir uns, Jest 23 ankündigen zu können – unsere größte Hauptversion bisher! Gemeinsam mit über 100 Mitwirkenden haben wir eine Fülle von Features und Bugfixes ausgeliefert. Vielen Dank an alle in der Community, die dazu beigetragen haben, JavaScript-Tests begeisternd zu machen.

Wir heißen außerdem sowohl Babel als auch webpack in der Jest-Community willkommen! Nach der Umstellung von Mocha auf Jest 23 Beta reduzierte sich die Gesamtdauer der Testsuite von webpack um das Sechsfache – von über 13 Minuten auf nur 2 Minuten 20 Sekunden. #blazingmeansgood

Hier sind einige der Highlights und Breaking Changes von Jest 23.

Eine vollständige Liste findet ihr im Changelog.

Interaktiver Snapshot-Modus

Wir haben eine neue Standardoption im Watch-Menü hinzugefügt: den Interaktiven Snapshot-Modus. Dieser Modus ermöglicht es euch, Schritt für Schritt durch jeden fehlgeschlagenen Snapshot in jeder fehlgeschlagenen Testsuite zu gehen, um fehlgeschlagene Snapshots zu überprüfen und individuell zu entscheiden, ob ihr sie aktualisieren oder überspringen möchtet.

Interaktiver Snapshot-Modus in Aktion

Die Dokumentation zum Interaktiven Snapshot-Modus findet ihr hier.

Snapshot Property Matchers

Oft enthalten Objekte, die ihr snapshottet, generierte Werte wie Datumsangaben oder IDs. Jest erlaubt es nun, Eigenschaften an den Snapshot-Matcher zu übergeben, die die Struktur der Daten statt konkreter Werte spezifizieren. Diese Property Matchers werden vor der Serialisierung des Matcher-Typs (anstelle des Werts) verifiziert, was zu konsistenten Snapshot-Ergebnissen über mehrere Testläufe hinweg führt.

Snapshot Property Matchers

Weitere Informationen findet ihr in der aktualisierten Dokumentation zu toMatchSnapshot oder im Leitfaden zu Property Matchers.

Benutzerdefinierte asynchrone Matcher

Wir unterstützen nun asynchrone Matcher mit expect.extends! Async-Matcher geben ein Promise zurück, sodass ihr mit await auf die Auflösung des Matchers warten könnt. Ein Beispiel:

Benutzerdefinierte asynchrone Matcher in Aktion

Dokumentation ist hier verfügbar.

Benutzerdefinierte asymmetrische Matcher

Asymmetrische Matcher sind ein hervorragendes Werkzeug, wenn ihr nur auf asymmetrische Gleichheit achten müsst. Zum Beispiel wenn die linke Seite ein Objekt mit einer Teilmenge der Eigenschaften der rechten Seite sein soll, statt einer exakten Übereinstimmung. Jest bietet bereits mehrere asymmetrische Matcher out-of-the-box, und in diesem Release führen wir benutzerdefinierte asymmetrische Matcher ein.

Benutzerdefinierte asymmetrische Matcher in Aktion

Jest Each

@mattphillipsio hat das jest-each-Paket an Jest Core gespendet (danke Matt!). jest-each ist eine Bibliothek, inspiriert von mocha-each und Spock Data Tables, die es ermöglicht, eine Tabelle mit Testfällen zu definieren und dann für jede Zeile einen Test mit den spezifizierten Spaltenwerten auszuführen. Wir unterstützen sowohl Array-Typen als auch Template-Literale für alle Varianten von describe und test. Die Dokumentation ist hier verfügbar, und für diejenigen, die noch nicht auf Jest 23 umgestiegen sind, veröffentlichen wir jest-each weiterhin separat!

jest-each in Aktion

Ein riesiges Dankeschön an Prettier für die schnelle Lösung der Tabellenformatierung (siehe Prettier 1.13)!

Neue Matcher

Wir fügen Matcher nur ins Core hinzu, wenn wir davon überzeugt sind, dass sie für viele in der Jest-Community nützlich sein werden. Die meisten Matcher überlassen wir der Community (siehe jest-extended). Einige Matcher schaffen es jedoch ins Core, und Jest 23 führt folgende neue ein:

  • nthCalledWith

  • toReturn

  • toReturnTimes

  • toReturnWith

  • lastReturnedWith

  • nthReturnedWith

  • toStrictEqual

Neue Matcher in Aktion

Die aktualisierte expect-Dokumentation findest du hier.

Debuggen von hängenden Tests

Ein häufiges Problem in unserem Issue-Tracker betrifft Tests, bei denen "Jest" nach Ausführung hängen bleibt. Dies liegt meist an offen gebliebenen Handles im App-Code, die Jest am Beenden hindern. Bisher griffen Nutzer oft zu --forceExit (nicht empfohlen).

Zum Debuggen dieser Probleme erkennen wir jetzt, wenn Jest nicht beendet wird:

Erkennung hängender Tests

Zusätzlich bieten wir eine neue Flagge --detectOpenHandles zur Lokalisierung offener Handles:

detectOpenHandles im Einsatz

Siehe aktualisierte CLI-Dokumentation hier.

Watch-Mode-Plugins

Wir haben das Watch-Mode-System komplett überarbeitet, um benutzerdefinierte Plugins zu ermöglichen. Watch-Mode-Plugins erlauben jetzt das Einbinden in Jest-Ereignisse und bieten eigene Menüoptionen im Watch-Mode-Menü. Alle Standardprompts sind als Plugins implementiert. Die Dokumentation zur Erstellung eigener Plugins findest du hier.

Dank dieser Änderung können wir Typeahead-Unterstützung als Watch-Mode-Plugin via jest-watch-typeahead zurückbringen!

Typeahead-Plugin in Aktion

Dokumentation und Installationsanweisungen unter jest-watch-typeahead. Riesiger Dank an @rogeliog für das neue Plugin-System und das Typeahead-Plugin!

Breaking Changes

Wie bei jedem Major-Release gibt es einige Breaking Changes, um zukünftig größere Verbesserungen zu ermöglichen und das Testing-Erlebnis zu revolutionieren. Die wichtigsten Änderungen:

  • Testbeschreibungen und -funktionen erforderlich: Tests ohne Funktion und Beschreibung schlagen jetzt fehl.

  • Entfernen undefinierter Props aus React-Snapshots: Kleinere Snapshots und korrektes React-Verhalten.

  • Entfernen veralteter Funktionen: mapCoverage wurde entfernt (nicht mehr nötig). Zusätzlich entfernt: jest.genMockFunction und jest.genMockFn (identisch zu jest.fn).

  • Snapshot-Namen in Fehlermeldungen: Der Snapshot-Name (falls angegeben) wird jetzt in Fehlermeldungen eingefügt, um fehlgeschlagene Snapshots leichter zu finden.

  • Mock-Zeitstempel ersetzen: Wir haben Mock-Zeitstempel durch invocationCallOrder ersetzt, da zwei oder mehr Mocks oft denselben Zeitstempel haben können, was die Testreihenfolge unmöglich macht.

  • Ergebnisse zu Mock-Snapshots hinzufügen: Wir haben die Ergebnisse von Mock-Funktionsaufrufen zu Snapshots hinzugefügt, sodass sowohl Aufrufe als auch Ergebnisse der Ausführung nachverfolgt werden.

Weitere Verbesserungen

  • Coverage im Watch-Modus: Die Abdeckung beschränkt sich jetzt nur auf Dateien, die im Watch-Modus oder mit --onlyChanged und --findRelatedTests getestet werden.

  • Versionsdokumentation: Wir haben Dokumentationen für jedes Minor-Release bis zurück zu Jest 22 hinzugefügt und alle "Requires Jest X.X+" Hinweise entfernt.

  • Bessere Snapshot-Zusammenfassungen: Wir haben die Snapshot-Zusammenfassungen überarbeitet, um veraltete Snapshots informativer zu gestalten.

  • Bessere Stack Traces: Wir haben Stack Traces für asynchrone Fehler, Timeout-Fehler, expect.assertions und geworfene Non-Errors hinzugefügt. Zusätzlich zeigen wir die Spalte im Code-Frame an!

  • Bessere React 16-Unterstützung: Fügt Snapshot-Unterstützung für React.Fragment, React.forwardRef und React.createContext hinzu.

  • Rückgabewerte und Fehlerwerte von Mocks tracken: Fügt mock.results hinzu, das Rückgabewerte oder geworfene Fehler für jeden Mock-Aufruf enthält.

  • Blazing 🔥: Wir haben ein "blazing"-Badge im README hinzugefügt, um zu zeigen, dass Jest großartig performt.

Jest Summit

Letzte Woche traf sich das Jest Core Team beim Jest Summit in Facebook London, wo wir an Jest 23 arbeiteten, es veröffentlichten, das Jest Open Collective ankündigten und mehrere Talks hielten:

Die vollständige Aufzeichnung ist hier verfügbar.

Die Resonanz war überwältigend, und wir konnten viele Community-Mitglieder aus London persönlich treffen. Vielen Dank an alle, die dabei waren und uns weiterhin unterstützen! Bleibt gespannt auf unseren nächsten Beitrag über das Jest Open Collective und unsere Zukunftspläne.

Wie immer wäre dieses Release ohne euch, die JavaScript-Community, nicht möglich gewesen. Wir sind unglaublich dankbar, dass wir gemeinsam die JavaScript-Tests verbessern dürfen. Wenn du zu Jest beitragen möchtest, kontaktiere uns gerne auf GitHub oder Discord.