Das Testen von JavaScript kann schmerzhaft sein. Es wurden viele Tools, Techniken und Frameworks entwickelt, um den Prozess so schmerzfrei wie möglich zu gestalten. Während einige dieser Tools wie Mocha, Jasmine und Jest eine Teststruktur bereitstellen, generieren einige andere wie Istanbul und Blanket auch Berichte zur Codeabdeckung. Verschiedene Methoden zum Testen von JavaScript-Code in einem Browser haben unterschiedliche Perspektiven und Konsequenzen. Es ist schwierig, ein Werkzeug oder eine Technik für alle Lösungen einzugrenzen!
Lassen Sie uns einen kurzen Blick auf einige der beliebtesten Möglichkeiten werfen, JavaScript-Code in einem Browser zu testen.
JSFiddle
Egal, ob Sie mit JavaScript oder Frameworks wie React und Vue arbeiten, JSFiddle ist das richtige Werkzeug für Sie. Es ist ein Online-Tool zum Schreiben und Testen von JavaScript-Code in einem Browser. Es wurde 2009 als „Mooshell“ gestartet. Wenn Sie an einer Webanwendung arbeiten und eine beliebige Art von JavaScript-Bibliothek verwenden, ist JSFiddle einen Blick wert. Die Benutzeroberfläche ist extrem einfach und Sie müssen nur JavaScript eingeben oder sogar HTML und CSS hinzufügen, um die Ergebnisse sofort zu sehen. Testen Sie Ihre JavaScript-Code-Snippets, bevor Sie sie mit JSFiddle zu Ihrem Projekt hinzufügen!
Cross Browser Testing Tools
Obwohl Sie Ihren JavaScript-Code problemlos mit Tools wie JSFiddle und CodePen testen können, zeigen Ihnen diese nicht, wie Ihr Code in verschiedenen Browsern oder mobilen Browsern ausgegeben wird. Wenn Sie Ihren Code auf browserübergreifende Kompatibilität testen möchten, müssen Sie Online-browserübergreifende Testtools wie LambdaTest verwenden. Es ermöglicht interaktive Live-Browser-Tests, automatisierte Screenshot-Tests, Responsive Layout-Tests und Smart Visual UI-Tests. Das Tool beschleunigt Ihre Testzyklen erheblich und hilft Ihnen bei browserspezifischen Problemen in Ihrem Code.
Karma + Jasmine + Google Chrome
Karma ist ein Tool, mit dem Sie JavaScript-Code in einem Browser für viele Testzwecke testen können. Es testet jedoch nicht den Code selbst. Es führt den Code aus, stützt sich jedoch zum Testen auf Bibliotheken von Drittanbietern wie Jasmine und Mocha. Abgesehen davon erfordert es einen echten Browser. Daher muss Google Chrome auf Ihrem lokalen Computer installiert sein, damit diese JavaScript-Methode funktioniert. Es startet Google Chrome im Headless-Modus für den Betrieb.
CodePen
CodePen ist eines der besten Online-Tools, um Ihren HTML-, CSS- und JavaScript-Code online zu testen. Diese Community von Entwicklern hat viel zu lehren! Diese Open-Source-Lernumgebung hat wahrscheinlich die größte Community von Entwicklern mit satten 330000 registrierten Benutzern, die ständig an der Entwicklung erstaunlicher Front-End-Anwendungen arbeiten. Es ist eine der besten Plattformen, um eine Website zu erstellen und bereitzustellen, der Welt Ihre Arbeit zu zeigen und Testfälle zu erstellen.
JSBin
JSBin ist eine saubere Alternative zu JSFiddle. Wenn Sie etwas mit einer leichter verständlichen und weniger überladenen Benutzeroberfläche wünschen, ist JSBin das richtige Tool für Sie. Die Plattform hat einen freien und einen Pro-Zugang. Für erweiterte Funktionen wie private Bins und unbegrenzte Dropbox-Synchronisierung müssen Sie Pro gehen, aber Sie können jede Kombination von HTML, CSS und JavaScript mit JSBin General Access leicht testen.
Liveweave
Liveweave ist ein weiterer Coding Playground, auf dem Sie Ihren JavaScript-Code testen können. Es verfügt über Live-Vorschau-Funktionen und ist mit einem Lineal ausgestattet, um Ihnen beim Responsive Design zu helfen. Die Code-Hinting-Funktion für HTML, CSS und JavaScript erleichtert Anfängern die Eingabe des Codes. Abgesehen davon können Sie Ihr Projekt als .zip-Datei mit Liveweave und auch externe Bibliotheken wie jQuery, AngularJS, Bootstrap usw. hinzufügen und verwenden. ganz einfach in Ihrem Code.
Dies waren einige der beliebtesten Möglichkeiten, Ihren JavaScript-Code in einem Browser zu testen. Abgesehen davon können Sie sogar Tools wie CSSDeck und Dabblet verwenden. Diese sind ebenso gut und einfach zu bedienen. Abgesehen davon verfügen Firebug und Chrome Developer Tools über eine Javascript-Konsole, in die Sie JavaScript-Code zur Ausführung eingeben können. Gleiches gilt für Internet Explorer 8+, Opera, Safari und möglicherweise viele andere moderne Browser.