Die JavaScript-Welt bietet viele Optionen für … nun, so ziemlich alles. Heute konzentrieren wir uns auf Test-Tools und beantworten die Frage „Was ist das beste JavaScript-Framework?“
Wir stellen Ihnen fünf der beliebtesten JavaScript-Test-Frameworks vor und wählen am Ende des Artikels das unserer Meinung nach beste aus. Fangen wir an.
Was sind Test-Frameworks?
Bevor wir in unsere Liste der Frameworks eintauchen, ist es wichtig zu verstehen, was ein Test-Framework ist.
Ein Test-Framework ist, einfach ausgedrückt, ein Werkzeug – oder eine Reihe von Werkzeugen – das Ihnen hilft, Unit-Tests durchzuführen. Ein Testframework sollte Ihnen mindestens
- Regeln oder Konventionen für das Schreiben von Testfällen und deren Organisation in Testsuiten zur Verfügung stellen.
- Mittel zur automatischen Ausführung und Selbstbewertung der Tests.
- Ergebnisse der Tests, die angezeigt und formatiert werden.
Fünf JavaScript-Test-Frameworks, die es wert sind, ausprobiert zu werden
Jetzt sollten Sie wissen, was Test-Frameworks sind und warum wir sie brauchen. Jetzt ist es an der Zeit, unsere Liste der Tools in Angriff zu nehmen, angefangen mit Mocha.
Mocha
Mocha, manchmal auch MochaJS genannt, ist ein Test-Framework, das sowohl in Node.js als auch im Browser läuft. Es wurde 2011 veröffentlicht und ist seither eines der beliebtesten Test-Frameworks für die JavaScript-Welt. Laut dem State of JavaScript Report hat die Popularität von Mocha in den letzten Jahren jedoch abgenommen, auch wenn es wohl immer noch das meistgenutzte und bekannteste Tool ist.
Dieses Framework vereinfacht asynchrone Tests, indem es Tests seriell ausführt. Das ermöglicht ein genaues Reporting und gleichzeitig ein Mapping von nicht abgefangenen Exceptions auf die richtigen Testfälle. Das Mocha-Framework ist äußerst flexibel konfigurierbar. Sie können es mit den Bibliotheken koppeln, die Sie für Funktionen wie Assertions, Mocking usw. benötigen.
Der Nachteil einer solchen Flexibilität ist, dass Mocha mehr Arbeit für seine anfängliche Einrichtung erfordert. Während andere Frameworks bereits über Assertions und Mocking-Funktionalitäten verfügen, sind für Mocha zusätzliche Tools erforderlich.
Offizielle Website: mochajs.org
Repository: github.com/mochajs/mocha
Puppeteer
Puppeteer ist eine Node.js-Bibliothek, die es Benutzern ermöglicht, einen headless Chrome- oder Chromium-Browser zu steuern. Auf diese Weise ist es möglich, Tests zu automatisieren, die man normalerweise manuell mit einem normalen Browser durchführen würde. Auf der Projektseite sind einige Beispiele für Tests aufgeführt, die Sie durchführen können:
- Screenshots und PDFs von Seiten generieren.
- SPA (Single-Page Application) crawlen und vorgerenderte Inhalte generieren (d.h. „SSR“ ).
- Formularübermittlung, UI-Tests, Tastatureingaben usw. automatisieren.
- Eine aktuelle, automatisierte Testumgebung erstellen. Führen Sie Ihre Tests direkt in der neuesten Version von Chrome aus und verwenden Sie die neuesten JavaScript- und Browserfunktionen.
- Erfassen Sie eine Zeitleiste Ihrer Website, um Leistungsprobleme zu diagnostizieren.
- Testen Sie Chrome-Erweiterungen.
- Testim hat einen kostenlosen Rekorder für Puppeteer veröffentlicht. Probieren Sie es aus und verwenden Sie es so oft Sie wollen.
Offizielle Seite: developers.google.com/web/tools/puppeteer
Repository: github.com/puppeteer/puppeteer
Jasmine
Jasmine ist ein JavaScript BDD (behavior-driven development) Test-Framework.
Dieses Framework bringt bereits so ziemlich alles mit, was man zum Testen braucht. Es verfügt über eingebaute Assertions und Test-Doubles mit Spies, im Gegensatz zu z.B. Mocha, bei dem man für diese Funktionen Tools von Drittanbietern installieren muss.
Jasmine ist aber auch flexibel und lässt sich nahtlos in eine Vielzahl von zusätzlichen Test-Tools integrieren. Sie können problemlos Karma als Testrunner verwenden oder Sinon.JS für Ihre Mocking-Bedürfnisse einsetzen.
Offizielle Website: jasmine.github.io/
Repository: github.com/jasmine/jasmine
QUnit
QUnit war ursprünglich Teil der jQuery-Programmierbibliothek. John Resig schuf es zum Testen von jQuery, jQuery UI und jQuery Mobile. Im Jahr 2008 wurde QUnit aus der jQuery-Codebasis herausgelöst und als eigenständiges Framework veröffentlicht, aber es benötigte immer noch jQuery, um zu funktionieren. Im Jahr 2009 wurde dies mit einem Rewrite behoben, wodurch QUnit endlich unabhängig von jQuery wurde.
Trotz der ursprünglichen Ausrichtung auf jQuery ist QUnit derzeit ein generisches Framework, das jeden JavaScript-Code testen kann und sowohl client- als auch serverseitige Umgebungen unterstützt.
Man könnte QUnit als den JavaScript-Vertreter in der xUnit-Familie der Unit-Test-Frameworks betrachten. Es ist schnell und einfach einzurichten. Da es seit mindestens 12 Jahren existiert, ist es ein gut unterstütztes Tool.
Offizielle Website: qunitjs.com
Repository: github.com/qunitjs/qunit
Jest
Jest ist ein Test-Framework für JavaScript, das sich auf Einfachheit konzentriert. Jest wurde von Facebook herausgegeben und zielt darauf ab, sofort und ohne Konfiguration zu funktionieren.
Wenn Sie einen Blick auf die „Getting Started“-Seite von Jest werfen, werden Sie sehen, dass Sie es in wenigen Minuten installieren, Ihren ersten Test schreiben und ihn ausführen können, ohne komplizierte Einstellungen oder zusätzliche Installationen. Ein weiterer Vorteil von Jest ist seine beeindruckende Leistung.
Jest wird in erster Linie zum Testen von React-Anwendungen verwendet, aber das bedeutet nicht, dass Sie es nur zum Testen von Anwendungen verwenden können, die mit dem Framework geschrieben wurden. Im Gegenteil: Sie können damit auch Node-, Angular- und Vue-Anwendungen testen, um nur einige zu nennen.
Offizielle Website: jestjs.io/
Repository: github.com/facebook/jest
Notable Absences
Sie fragen sich vielleicht, warum einige bekannte JavaScript-Test-Tools es nicht in unsere Liste geschafft haben. Vielleicht sind Sie der Meinung, dass Tools wie Karma, Sinon und Chai, neben anderen, populär genug sind, um auf der Liste zu stehen. Warum haben wir sie nicht aufgenommen?
Einfach gesagt, wollten wir die Liste so übersichtlich wie möglich halten. Um das zu erreichen, haben wir beschlossen, Testwerkzeuge, die streng genommen keine Frameworks sind, nicht in die Liste aufzunehmen. Das ist also der Grund, warum ein so beliebtes Tool wie Karma es nicht in die Liste geschafft hat: Es ist ein Test-Runner, kein Framework. Die gleiche Argumentation gilt für Sinon (ein Mocking-Tool) und Chai (eine Assertion-Bibliothek).
Man könnte argumentieren, dass Puppeteer nicht ganz in die Liste passt, und bis zu einem gewissen Grad würde ich zustimmen. Das heißt, alle anderen Tools sind Frameworks, die eher für die Durchführung von Tests im Stil von Unit-Tests geeignet sind, während Puppeteer eher ein Tool zur Browser-Automatisierung ist. Es ist jedoch immer noch ein Test-Framework in dem Sinne, dass es Ihnen ermöglicht, automatisierte Tests zu entwerfen, die später ohne menschliches Eingreifen ausgeführt werden.
Verdict: Welches ist das beste JavaScript-Testframework?
Wir haben fünf Testframeworks für JavaScript vorgestellt. Jetzt ist es an der Zeit, das Versprechen des Posttitels einzulösen und das beste auszuwählen. Dazu werden wir die Frameworks nach vier Kriterien beurteilen: Kosten, Installation, einfache Einrichtung und Lernkurve.
Bewertung der Frameworks
Kosten
Das erste Kriterium ist sicherlich das einfachste für uns zu bewerten. Alle Frameworks, die wir hier behandelt haben, sind Open-Source-Projekte, d.h. man kann sie kostenlos herunterladen und benutzen (wie Bier). Es gibt hier also keinen eindeutigen Gewinner. Weiter geht’s.
Installation
Die Installation aller oben genannten Tools ist ziemlich einfach. Schließlich kann man sie alle mit npm (oder alternativ mit Yarn) installieren. Einige der Tools bieten jedoch zusätzliche Installationsoptionen.
Neben npm und Yarn kann man zum Beispiel QUnit als eigenständigen Download installieren. Das würde aber bedeuten, dass Sie dieses Asset speichern und verwalten müssen. Stattdessen können Sie die Version verwenden, die im jQuery CDN gehostet wird. Jasmine bietet auch eine eigenständige Version an, die nicht von Node abhängt und es Ihnen ermöglicht, Specs über Ihren Browser auszuführen.
So, haben wir hier einen Gewinner? Wir denken ja. Wenn wir nur nach der Einfachheit der Installation entscheiden würden, gäbe es ein weiteres Unentschieden. Aber wie wir gesehen haben, bieten sowohl QUnit als auch Jasmine mehr Möglichkeiten, da man sie als eigenständige Bibliotheken verwenden kann. Ist diese zusätzliche Flexibilität nützlich? Das mag von Fall zu Fall unterschiedlich sein, aber für uns sind QUnit und Jasmine hier die Gewinner.
Gewinner: QUnit und Jasmine
Einfache Einrichtung
Werfen wir nun einen Blick auf die Einfachheit der Einrichtung. Wenn es um die Ersteinrichtung geht, haben wir hier einen klaren Sieger: Jest. Das Framework verspricht einen Null-Konfigurationsaufwand und hält dieses Versprechen auch ein. Sicher, man kann optionale Konfigurationen vornehmen, aber es ist ein tolles Gefühl, ein Test-Framework zu installieren und in etwa zwei Minuten einen echten Test laufen zu haben, ohne jegliche Konfiguration oder Installation weiterer Tools.
Sieger: Jest
Lernkurve
Schließlich die Lernkurve. Hier müssen wir uns wieder für Jest entscheiden. Da es über eine breite API verfügt und nicht so viele Tools von Drittanbietern benötigt wie die anderen Frameworks, hat Jest zwangsläufig eine weniger steile Lernkurve.
Sieger: Jest
Hier ist der Gewinner
Nachdem wir uns mit fünf JavaScript-Test-Frameworks beschäftigt und sie anhand von vier Kriterien analysiert haben, ist es nun an der Zeit, einen Gewinner zu küren.
Da Jest bei zwei der vier Kriterien, die wir verwendet haben, der Gewinner war, werden wir uns für Jest als Gewinner entscheiden. Das heißt aber nicht, dass Sie die anderen Tools nicht ausprobieren sollten. Im Gegenteil: Experimentieren Sie und üben Sie so viel wie möglich, denn das ist der beste Weg, um zu lernen.