© Matej Kotula/Shutterstock.com
JavaScript Kompendium
Teil 3: Test und Build

Das Ziel ist das Ziel

Die Entwicklung von Single Page Applications (SPA) stellt den Entwickler vor viele Aufgaben, um eine produktionsreife Applikation zu erhalten. Dabei sollte auch das automatisierte Testen nicht zu kurz kommen.

Daniel Schwab, Manfred Steyer


Artikelserie Teil 1: Authentifizierung und Autorisierung Teil 2: Wiederverwendbare Pakete Teil 3: Test und Build Teil 1: Authentifizierung und AutorisierungTeil 2: Wiederverwendbare PaketeTeil 3: Test und BuildDurch die Nutzung von Frameworks wie Angular und seiner Konzepte wandert natürlich auch immer mehr Logik in den Clientteil der Applikation. Manuelles Testen reicht nach kurzer Zeit nicht mehr aus, um die fortlaufende Stabilität der eigenen Anwendung zu gewährleisten und deren Komplexität zu kontrollieren. Automatisierte Tests helfen einem jedoch nicht nur dabei, Funktionalität schnell zu prüfen, sie beeinflussen auch positiv die Art, wie Programmcode geschrieben wird. Dieser Artikel beschreibt anhand eines Beispiels [2] den Umgang mit webpack sowie die Nutzung von Karma und Jasmine, um Unit-Tests zu erstellen und daraus Reports für CI-Umgebungen wie Jenkins zu generieren. Außerdem gehen wir darauf ein, wie diese Tasks über den Node-Package-Manager npm in einen Maven-Build-Prozess integriert werden können, sodass am Ende eine fertige JAR-Datei zur weiteren Verarbeitung vorliegt.Projekte mit webpackAls Module werden nicht nur TypeScript-Dateien angesehen, sondern sämtliche Dateien, die über Referenzen erkennbar sind. So kann webpack neben den üblichen, wie etwa import oder require, auch beispielsweise src: url('…') in CSS-Dateien oder in HTML auflösen. Damit webpack weiß, wie gefundene Dateien verarbeitet werden müssen, ist es notwendig, so genannte Loader zu definieren. Diese reagieren anhand einer selbst definierten Regex auf passende Dateien.Oft wird webpack als Task-Runner wie Grunt oder gulp missverstanden. Task-Runner arbeiten konfigurierte Tasks wie das Kopieren oder Komprimieren von Dateien nacheinander ab. Das Gesamtergebnis der einzelnen Tasks ist für den Task-Runner nicht relevant. webpack kann in diesem Zusammenhang als ein Task angesehen werden. Obwohl das Tool durch Plug-ins erweiterbar ist und somit teilweise einen Task-Runner imitiert, besteht die primäre Aufgabe darin, ein lauffähiges Bundle aus einzelnen zusammenhängenden Modulen zu erhalten. Listing 1 zeigt die notwendigen Node Packages sowie den Task build. Damit lässt sich ein Bundle über webpack erstellen. Loader sind nicht in webpack enthalten und müssen somit immer extra installiert werden. Das Gleiche gilt für die meisten Plug-ins.{ "name": "angular-build-test", "scripts": { "build": "webpack" }, "dependencies": { […] }, "devDe...

JavaScript Kompendium
Teil 3: Test und Build

Das Ziel ist das Ziel

Die Entwicklung von Single Page Applications (SPA) stellt den Entwickler vor viele Aufgaben, um eine produktionsreife Applikation zu erhalten. Dabei sollte auch das automatisierte Testen nicht zu kurz kommen.

Daniel Schwab, Manfred Steyer


Artikelserie Teil 1: Authentifizierung und Autorisierung Teil 2: Wiederverwendbare Pakete Teil 3: Test und Build Teil 1: Authentifizierung und AutorisierungTeil 2: Wiederverwendbare PaketeTeil 3: Test und BuildDurch die Nutzung von Frameworks wie Angular und seiner Konzepte wandert natürlich auch immer mehr Logik in den Clientteil der Applikation. Manuelles Testen reicht nach kurzer Zeit nicht mehr aus, um die fortlaufende Stabilität der eigenen Anwendung zu gewährleisten und deren Komplexität zu kontrollieren. Automatisierte Tests helfen einem jedoch nicht nur dabei, Funktionalität schnell zu prüfen, sie beeinflussen auch positiv die Art, wie Programmcode geschrieben wird. Dieser Artikel beschreibt anhand eines Beispiels [2] den Umgang mit webpack sowie die Nutzung von Karma und Jasmine, um Unit-Tests zu erstellen und daraus Reports für CI-Umgebungen wie Jenkins zu generieren. Außerdem gehen wir darauf ein, wie diese Tasks über den Node-Package-Manager npm in einen Maven-Build-Prozess integriert werden können, sodass am Ende eine fertige JAR-Datei zur weiteren Verarbeitung vorliegt.Projekte mit webpackAls Module werden nicht nur TypeScript-Dateien angesehen, sondern sämtliche Dateien, die über Referenzen erkennbar sind. So kann webpack neben den üblichen, wie etwa import oder require, auch beispielsweise src: url('…') in CSS-Dateien oder in HTML auflösen. Damit webpack weiß, wie gefundene Dateien verarbeitet werden müssen, ist es notwendig, so genannte Loader zu definieren. Diese reagieren anhand einer selbst definierten Regex auf passende Dateien.Oft wird webpack als Task-Runner wie Grunt oder gulp missverstanden. Task-Runner arbeiten konfigurierte Tasks wie das Kopieren oder Komprimieren von Dateien nacheinander ab. Das Gesamtergebnis der einzelnen Tasks ist für den Task-Runner nicht relevant. webpack kann in diesem Zusammenhang als ein Task angesehen werden. Obwohl das Tool durch Plug-ins erweiterbar ist und somit teilweise einen Task-Runner imitiert, besteht die primäre Aufgabe darin, ein lauffähiges Bundle aus einzelnen zusammenhängenden Modulen zu erhalten. Listing 1 zeigt die notwendigen Node Packages sowie den Task build. Damit lässt sich ein Bundle über webpack erstellen. Loader sind nicht in webpack enthalten und müssen somit immer extra installiert werden. Das Gleiche gilt für die meisten Plug-ins.{ "name": "angular-build-test", "scripts": { "build": "webpack" }, "dependencies": { […] }, "devDe...

Neugierig geworden?


   
Loading...

Angebote für Teams

Für Firmen haben wir individuelle Teamlizenzen. Wir erstellen Ihnen gerne ein passendes Angebot.

Das Library-Modell:
IP-Zugang

Das Company-Modell:
Domain-Zugang