Am Anfang gab es eine Funktion, die an einer Stelle aufgerufen wurde. Dann wollten wir sie an einem anderen Ort mit neuen Funktionen anrufen und sie aktualisieren. Wir mochten dieses ff so sehr, dass wir es an dritter Stelle nannten und trotzdem funktionale Änderungen vornahmen und ... an erster Stelle ging etwas schief. Wie finde ich es heraus? Überprüfen Sie an allen Stellen, an denen wir diese Funktion verwendet haben. Funktioniert alles korrekt? Es ist möglich, aber es ist besser, Unit-Tests zu verwenden.
Hallo an alle. Anonym aus der Sandbox verbunden. In den ersten Zeilen der Suchmaschine finden Sie den richtigen Weg, um Ihren Code zu testen. Sie müssen jedoch an der Einrichtung der Umgebung basteln. Daher möchte ich heute unerfahrenen Entwicklern helfen, die Umgebung für Unit-Tests ihres Codes einzurichten.
PS - Es ist sinnvoll, den Artikel weiter zu lesen, wenn der Leser die Arbeit mit npm oder einem ähnlichen Paketmanager beherrscht.
Beginnen wir mit kleinen Definitionen:
- Unit Testing ist eine Technologie, deren Zweck darin besteht, die Wahrscheinlichkeit von Fehlern und Nebenwirkungen zu verringern (wenn beim Beheben eines Fehlers ein weiterer Fehler auftritt).
- Karma ist ein Tool, mit dem Sie Java-Skript-Tests in Browsern ausführen können.
- Jasmin ist ein Framework zum Testen von Javasctript-Code.
Die Karma- Installationsanweisungen (wie viele andere auch) besagen, dass Pakete lokal im Projekt installiert werden sollten.
# Install Karma: $ npm install karma --save-dev
# Install plugins that your project needs: $ npm install karma-jasmine karma-chrome-launcher jasmine-core --save-dev
Der ./node_modules/karma/bin/karma können wir karma-cli npm install -g karma-cli , andernfalls sind die Befehle wie ./node_modules/karma/bin/karma vom Terminal verfügbar ./node_modules/karma/bin/karma .
Dann können wir eine Konfigurationsdatei erstellen:
karma init karma.conf.js
- Zunächst werden wir nach dem verwendeten Testframework gefragt. (Jasmin)
- Verwenden wir den Datei- / Modullader Require.js? ( Nein )
- Welche Browser möchten wir anzeigen (Chrome)
- Welche Dateien hören wir? (* [Ss] pec.js)
- Sollten Dateien ausgeschlossen werden
- Soll ich Teständerungen überwachen (ja)
Nach Beantwortung der Fragen erhalten wir eine Konfigurationsdatei.
Konfigurationsdatei // Karma configuration // Generated on Thu May 09 2019 18:54:02 GMT+0300 (RTZ 2 ()) module.exports = function(config) { config.set({ // base path that will be used to resolve all patterns (eg. files, exclude) basePath: '', // frameworks to use // available frameworks: https://npmjs.org/browse/keyword/karma-adapter frameworks: ['jasmine'], // list of files / patterns to load in the browser files: [ '*[Ss]pec.js' ], // list of files / patterns to exclude exclude: [ ], // preprocess matching files before serving them to the browser // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor preprocessors: { }, // test results reporter to use // possible values: 'dots', 'progress' // available reporters: https://npmjs.org/browse/keyword/karma-reporter reporters: ['progress'], // web server port port: 9876, // enable / disable colors in the output (reporters and logs) colors: true, // level of logging // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG logLevel: config.LOG_INFO, // enable / disable watching file and executing tests whenever any file changes autoWatch: true, // start these browsers // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher browsers: ['Chrome'], // Continuous Integration mode // if true, Karma captures browsers, runs the tests and exits singleRun: false, // Concurrency level // how many browser should be started simultaneous concurrency: Infinity }) }
Erstellen Sie eine weitere Testdatei.
Testdatei // test.spec.js describe("A suite is just a function", function() { var a; it("and so is a spec", function() { a = true; expect(a).toBe(true); }); it("and so is a spec", function() { a = true; expect(a).toBe(false); }); });
Wir können bereits sehen, wie unser Test funktioniert, indem karma start karma.conf.js Ich empfehle jedoch, etwas zu warten und zusätzliche Add-Ons zu karma start karma.conf.js .
Installieren Sie das npm i -D karma-jasmine-html-reporter Paket npm i -D karma-jasmine-html-reporter , das die Testergebnisse dynamisch im Browser anzeigt. Fügen wir die Karma-Konfiguration hinzu:
... reporters: ['progress', 'kjhtml'], client: { clearContext: false // leave Jasmine Spec Runner output visible in browser }, ...
Jetzt sind wir alle bereit. Wir starten karma start karma.conf.js und fahren mit unseren ersten Tests fort: D.