Ich habe die folgende Anweisung:
%Vor%Ich möchte die Abhängigkeiten zum Einheitentest der verschiedenen Codepfade mit den von den Komponententests bekannten Werten verspotten. Ich habe den folgenden Beispieleinheitstest:
%Vor%Das gibt mir zwei Probleme.
Da sich die Vorlage in einer externen Datei befindet, versucht sie beim Laden zunächst, sie abzurufen und Fehler zu beheben, da die Datei nirgendwo zu finden ist, was logisch ist, da sie sich in einer Testumgebung und nicht in einem tatsächlichen Server befindet / p>
Zweitens gibt es keine offensichtliche Möglichkeit, die Abhängigkeiten zu verspotten, die über den Konstruktor in die Direktive eingefügt werden. Beim Testen von Controllern können Sie den Dienst $controller verwenden, aber da Anweisungen indirekt durch das Kompilieren eines HTML-Tags mit einem übergebenen Bereich instanziiert werden, gibt es keine Möglichkeit, sie direkt zu instanziieren (z. B. gibt es kein analoges $directive ). Das hindert mich daran, $userDetails.name und $userDetails.gravatar auf 'test name' bzw. 'test avatar' zu setzen.
Wie bekomme ich die Anweisung, um ordnungsgemäß zu kompilieren und mit einer benutzerdefinierten $ userDetails-Abhängigkeit auszuführen?
Um die Vorlagendatei zu laden, müssen Sie karma-ng-html2js-preprocessor in Karma konfigurieren.
Besuchen Sie zuerst diese Seite und folgen Sie den Installationsanweisungen. Dann müssen Sie einige Einträge in Ihrer Datei karma.config.js hinzufügen:
%Vor%Das sagt Karma, alle HTML-Dateien im Vorlagenordner zu laden (wenn Ihre Vorlagen woanders sind, legen Sie diesen Ordner dort ab).
%Vor% Das weist Karma an, alle HTML-Dateien über den% preprocessor ng-html2js zu übergeben, der sie dann in eckige Module umwandelt, die die Vorlagen in den Dienst $templateCache bringen. Auf diese Weise, wenn $httpBackend den "Server" für die Vorlage abfragt, wird sie vom Vorlagen-Cache abgefangen und der korrekte HTML-Code zurückgegeben. Alles klar hier, mit Ausnahme der URL der Vorlage: Sie muss mit der Eigenschaft templateUrl in der Direktive übereinstimmen, und ng-html2js übergibt standardmäßig den vollständigen Pfad als URL. Also müssen wir diesen Wert umwandeln:
Dies empfängt filepath und leitet es durch einen regulären Ausdruck weiter extrahiert den Pfad, den Dateinamen und die Erweiterung in ein Array. Dann fügen Sie 'templates/ dem Dateinamen und der Erweiterung voran und Sie erhalten die erwartete uri.
Nachdem all dies getan wurde, ist das Vorbereiten der Vorlage eine Sache des Ladens des Moduls, bevor der Test ausgeführt wird:
%Vor% Beachten Sie, dass module ein externer Service ist, der sich in angular-mocks.js .
Um einen benutzerdefinierten Service in die Direktive einzufügen, müssen Sie den Provider des Service überschreiben:
%Vor% $provide ist der Service, der Ihren Providern zur Verfügung steht. Also, wenn Sie eine Scheinabhängigkeit injizieren wollen, überschreiben Sie hier den Anbieter.
Wenn dieser Code vor dem Test ausgeführt wird, haben Sie einen Mock $userDetails -Dienst, der Ihre vordefinierten Zeichenfolgen zurückgibt.
Tags und Links angularjs unit-testing dependency-injection angularjs-directive karma-runner