Dieser Artikel wurde von Mark Brown und Marc Towler überprüft. Vielen Dank an alle SitePoint -Peer -Rezensenten, die SidePoint -Inhalte für die Besten erhalten haben!

Eines der gr??ten Hindernisse beim Schreiben von Unit-Tests ist, wie man mit nicht trivialem Code umgeht.

In den tats?chlichen Projekten führt der Code h?ufig verschiedene Vorg?nge aus, die Tests erschweren. AJAX -Anfragen, Timer, Daten, Zugriff auf andere Browserfunktionen… oder Datenbanken machen immer Spa?, wenn Sie node.js verwenden.

all dies ist schwer zu testen, da Sie sie nicht in Ihrem Code steuern k?nnen. Wenn Sie AJAX verwenden, ben?tigen Sie einen Server, um auf die Anfrage zu antworten, damit Ihre Tests bestehen k?nnen. Wenn Sie SetTimeout verwenden, muss Ihr Test warten. Gleiches gilt für eine Datenbank oder ein Netzwerk - Sie ben?tigen eine Datenbank mit den richtigen Daten oder einem Netzwerkserver.

Das wirkliche Leben ist nicht so einfach, wie viele Test -Tutorials scheinen. Aber wissen Sie, dass es eine L?sung gibt?

Mit Sinon k?nnen wir das Testen nicht trivialer Code trivial machen!

Mal sehen, wie es funktioniert.

Schlüsselpunkte

• Sinon vereinfachte Tests: Sinon.js ist entscheidend für die Vereinfachung der Tests von JavaScript -Code, das komplexe Vorg?nge wie AJAX -Anrufe, Timer und Datenbankinteraktionen umfasst, da diese Teile durch Mocks, Spies und Stubs ersetzt werden k?nnen.
• Drei Arten von Tests: Sinon klassifiziert Tests als Spione (Sammeln von Informationen über Funktionsaufrufe); ganze Objekte).
• Praktische F?lle: Sinon ist besonders nützlich in Szenarien für Unit-Tests, in denen externe Abh?ngigkeiten die Tests komplizieren oder verlangsamen k?nnen, z. B. externe API-Aufrufe oder zeitbasierte Funktionen.
• Integration und Setup: Sinon kann leicht in node.js- und browserbasierte Testumgebungen integriert werden, wodurch die Vielseitigkeit und Benutzerfreundlichkeit in einer Vielzahl von JavaScript-Anwendungen verbessert werden.
• Verbesserte Behauptungen: Sinon bietet verbesserte Assertionsmethoden, die klarere Fehlermeldungen generieren und den Debugging -Prozess w?hrend der Testfehler verbessern.
• Best Practice: Verwenden Sie sinon.test() Verpackungstestf?lle stellt sicher, dass der Test-Stand-In ordnungsgem?? gereinigt wird, die Nebenwirkungen in anderen Tests verhindert und potenzielle Fehler in der Testsuite verringert.

Was macht Sinon so wichtig und nützlich?

Kurz gesagt, Sinon erm?glicht es Ihnen, den schwierigen Teil des Tests durch das zu ersetzen, das das Testen einfach macht.

Beim Testen eines Code -Stücks m?chten Sie nicht, dass es von keinen Faktoren au?erhalb des Tests beeinflusst wird. Wenn einige externe Faktoren den Test beeinflussen, wird der Test komplexer und kann zuf?llig ausf?llt.

Wie machen Sie das, wenn Sie den Code testen m?chten, der Ajax -Anrufe t?tigt? Sie müssen einen Server ausführen und sicherstellen, dass er die genaue Antwort bietet, die Sie für Ihre Tests ben?tigen. Das Einrichten ist kompliziert und es schwierig, das Schreiben und Ausführen von Unit -Tests schwierig zu machen.

Was ist, wenn Ihr Code von der Zeit abh?ngt? Angenommen, es wartet auf eine Sekunde, bevor sie eine Aktion ausführen. Was tun jetzt? Sie k?nnen SetTimeout in Ihrem Test verwenden, um auf eine Sekunde zu warten, aber dies verlangsamt den Test. Stellen Sie sich vor, das Intervall ist beispielsweise fünf Minuten lang. Ich denke, Sie m?chten wahrscheinlich nicht jedes Mal, wenn Sie Ihre Tests durchführen, fünf Minuten warten.

Durch die Verwendung von Sinon k?nnen wir beide Probleme (und viele andere) l?sen und die Komplexit?t beseitigen.

Wie funktioniert Sinon?

Sinon hilft, Komplexit?t beim Testen zu beseitigen, indem Sie leicht sogenannte Test-Stand-in erstellen k?nnen.

Wie der Name schon sagt, ist der Test-Stand-In ein Ersatz für die im Test verwendeten Codeausschnitte. Wenn wir auf das AJAX-Beispiel zurückblicken, werden wir den Server nicht einrichten, sondern den AJAX-Aufruf durch den Test-Stand-in ersetzen. Für das zeitliche Beispiel werden wir einen Test-Stand-in verwenden, damit wir "Zeit nach vorne bewegen".

Das mag ein wenig seltsam klingen, aber das Grundkonzept ist einfach. Da JavaScript sehr dynamisch ist, k?nnen wir jede Funktion übernehmen und sie durch etwas anderes ersetzen. Das Testen eines Stellvertreters geht diese Idee nur noch einen Schritt weiter. Mit Sinon k?nnen wir jede JavaScript-Funktion durch einen Test-Stand-in ersetzen, und dann k?nnen wir sie so konfigurieren, dass sie verschiedene Operationen ausführen, um die Testkomplexe einfach zu machen.

Sinon unterteilt Test-Stand-Ins in drei Typen:

• Spion, die Informationen über Funktionsaufrufe bereitstellen, ohne ihr Verhalten zu beeinflussen
• Stub, wie ein Spion, ersetzt aber die Funktion vollst?ndig. Dies erm?glicht es, die Stub -Funktion zu erm?glichen, was Ihnen gef?llt - Ausnahmen werfen, bestimmte Werte zurückgeben usw.
• Simulation durch Kombination von Spione und Stubs erleichtert es, das gesamte Objekt zu ersetzen

Darüber hinaus bietet Sinon einige andere Hilfsprogramme, obwohl diese Hilfsprogramme au?erhalb des Rahmens dieses Artikels liegen:

• gef?lschter Timer kann verwendet werden, um die Zeit nach vorne zu verschieben, z. B. das Ausl?sen von SetTimeout
• gef?lschte XMLHTTPREQUEST und Server, mit der AJAX -Anforderungen und Antworten
gestaltet werden k?nnen.

Mit diesen Merkmalen k?nnen Sie mit Sinon alle Schwierigkeiten l?sen, die durch externe Abh?ngigkeiten beim Testen verursacht werden. Wenn Sie die Tipps für die effektive Verwendung von Sinon lernen, ben?tigen Sie keine anderen Tools.

Installation Sinon

Erstens müssen wir Sinon installieren.

für node.js test:

Verwenden Sie NPM, um Sinon zu installieren, um Sinon über NPM
2. zu installieren
In Ihren Tests in Ihren Tests mit var sinon = required ('Sinon') einführen;

für browserbasierte Tests:

1. Sie k?nnen NPM verwenden, um Sinon über NPM zu installieren, eine CDN zu verwenden oder von Sinons Website
herunterzuladen
2. Einbeziehen Sinon.js in Ihre Test -L?ufer -Seite.

Anf?nger

Sinon hat viele Merkmale, aber viele von ihnen sind auf sich selbst aufgebaut. Sie kennen einen Teil davon und wissen bereits den n?chsten Teil. Sobald Sie die Grundlagen verstanden und verstehen, was jedes unterschiedliche Teil tut, macht Sinon einfach zu bedienen.

Wir brauchen normalerweise Sinon, wenn unser Code eine Funktion aufruft, die uns ?rger verursacht.

Für Ajax kann es $ .get oder xmlhttprequest sein. Für die Zeit kann die Funktion SetTimeout sein. Für Datenbanken k?nnte es mongoDB.Findone sein.

Um es einfacher zu machen, diese Funktion zu besprechen, nenne ich sie die Abh?ngigkeit . Die Funktion, die wir testen, h?ngt vom Ergebnis einer anderen Funktion ab. Wir k?nnen sagen, dass Sinons grundlegendes Verwendungsmuster darin besteht, problematische Abh?ngigkeiten durch Test-Stand-Ins zu ersetzen.

Beim Testen von AJAX ersetzen wir xmlhttprequest durch einen Test-Stand-in, der AJAX-Anforderungen

simuliert
• Wenn wir die Zeit testen, ersetzen wir SetTimeout durch einen gef?lschten Timer
• Beim Testen des Datenbankzugriffs k?nnen wir MongoDB.Findone durch einen Test-Stand-in ersetzen, der einige gef?lschte Daten sofort zurückgibt
Mal sehen, wie es in der Praxis funktioniert.

Spion

Spion ist der einfachste Teil von Sinon, und andere Merkmale sind darauf aufgebaut.

Der Hauptzweck von Spione besteht darin, Informationen über Funktionsaufrufe zu sammeln. Sie k?nnen sie auch verwenden, um bestimmte Dinge zu überprüfen, z. B. ob eine Funktion aufgerufen wird.

Funktion Sinon.spy gibt ein Spionageobjekt zurück, das als eine Funktion bezeichnet werden kann, enth?lt aber auch Attribute zu allen Aufrufen. Im obigen Beispiel enth?lt die FirstCall -Eigenschaft Informationen zum ersten Anruf, wie z. B. FirstCall.Args, die übergebene Parameterliste.

var spy = sinon.spy();

//我們可以像函數(shù)一樣調用間諜
spy('Hello', 'World');

//現(xiàn)在我們可以獲取有關調用的信息
console.log(spy.firstCall.args); //輸出：['Hello', 'World']

Obwohl Sie anonyme Spione erstellen k?nnen, indem Sie Sinon.spy ohne Parameter aufrufen, ist das h?ufigere Muster, eine andere Funktion durch einen Spion zu ersetzen.

Ersetzen Sie eine andere Funktion durch einen Spion und funktioniert ?hnlich wie beim vorherigen Beispiel, aber mit einem wichtigen Unterschied: Nachdem Sie Spion mit dem Vergleich beendet haben . Ohne dies k?nnen sich Ihre Tests ungew?hnlich verhalten.

var user = {
  ...
  setName: function(name){
    this.name = name;
  }
}

//為 setName 函數(shù)創(chuàng)建一個間諜
var setNameSpy = sinon.spy(user, 'setName');

//現(xiàn)在，每當我們調用該函數(shù)時，間諜都會記錄有關它的信息
user.setName('Darth Vader');

//我們可以通過查看間諜對象來查看
console.log(setNameSpy.callCount); //輸出：1

//重要最后一步 - 刪除間諜
setNameSpy.restore();

spy verfügt über viele verschiedene Eigenschaften, die unterschiedliche Informationen darüber liefern, wie sie verwendet werden. Die Spionagedokumentation von Sinon enth?lt eine vollst?ndige Liste aller verfügbaren Optionen.

In der Praxis verwenden Sie m?glicherweise nicht oft Spione. Es ist wahrscheinlicher, dass Sie einen Stub ben?tigen, aber Spione k?nnen bequem sein, z. B. zu überprüfen, ob ein Rückruf genannt wird:

In diesem Beispiel verwende ich Mocha als Testframework und Chai als Assertion -Bibliothek. Wenn Sie mehr über diese beiden erfahren m?chten, lesen Sie bitte meinen vorherigen Beitrag: Unit -Test Ihres JavaScript mit Mokka und Chai.

function myFunction(condition, callback){
  if(condition){
    callback();
  }
}

describe('myFunction', function() {
  it('should call the callback function', function() {
    var callback = sinon.spy();

    myFunction(true, callback);

    assert(callback.calledOnce);
  });
});

Sinons Behauptung

Bevor wir zum Stub fahren, lass uns einen kurzen Umweg machen und einen Blick auf die Behauptung von Sinon werfen.

In den meisten Testf?llen, in denen Sie Spy (und Stubs) verwenden, müssen Sie die Ergebnisse des Tests überprüfen.

Wir k?nnen jede Art von Behauptung verwenden, um das Ergebnis zu überprüfen. Im vorherigen Beispiel über Rückrufe haben wir die Assert -Funktion von Chai verwendet, die sicherstellt, dass der Wert der wahre Wert ist.

var spy = sinon.spy();

//我們可以像函數(shù)一樣調用間諜
spy('Hello', 'World');

//現(xiàn)在我們可以獲取有關調用的信息
console.log(spy.firstCall.args); //輸出：['Hello', 'World']

Der Nachteil davon ist, dass die Fehlermeldung zum Fehler unklar ist. Sie erhalten nur eine Eingabeaufforderung wie "Falsch ist nicht wahr" oder ?hnlich. Wie Sie sich vorstellen k?nnen, ist dies nicht sehr hilfreich, um herauszufinden, wo das Problem liegt, und Sie müssen sich den Quellcode des Tests ansehen, um es herauszufinden. Kein Spa?.

Um dieses Problem zu l?sen, k?nnen wir benutzerdefinierte Fehlermeldungen in die Behauptung einbeziehen.

var user = {
  ...
  setName: function(name){
    this.name = name;
  }
}

//為 setName 函數(shù)創(chuàng)建一個間諜
var setNameSpy = sinon.spy(user, 'setName');

//現(xiàn)在，每當我們調用該函數(shù)時，間諜都會記錄有關它的信息
user.setName('Darth Vader');

//我們可以通過查看間諜對象來查看
console.log(setNameSpy.callCount); //輸出：1

//重要最后一步 - 刪除間諜
setNameSpy.restore();

Aber warum sich die Mühe machen, wenn wir Sinons eigene Behauptung verwenden k?nnen?

function myFunction(condition, callback){
  if(condition){
    callback();
  }
}

describe('myFunction', function() {
  it('should call the callback function', function() {
    var callback = sinon.spy();

    myFunction(true, callback);

    assert(callback.calledOnce);
  });
});

Die Verwendung von Sinons Behauptungen wie diese kann sofort bessere Fehlermeldungen liefern. Dies ist nützlich, wenn Sie komplexere Bedingungen wie Parameter einer Funktion validieren müssen.

Folgendes sind einige andere nützliche Behauptungen von Sinon:

• sinon.assert.called with kann verwendet werden, um zu überprüfen, ob die Funktion mit einem bestimmten Parameter aufgerufen wurde (dies ist wahrscheinlich die, die ich am meisten verwende)
• Sinon.assert.Callorder kann überprüfen, ob die Funktion in einer bestimmten Reihenfolge aufgerufen wird

Wie Spione enth?lt die Behauptungsdokumentation von Sinon alle verfügbaren Optionen. Wenn Sie es vorziehen, Chai zu verwenden, gibt es auch ein Sinon-Chai-Plugin, mit dem Sie die Sinon-Behauptungen über die Erwartung von Chai verwenden k?nnen.

Stub

Stubs sind der bevorzugte Test-Stand-in, da sie flexibel und bequem sind. Sie haben alle Funktionen von Spione, sind aber mehr als nur die Rolle der überwachungsfunktionen, und der Stub ersetzt sie vollst?ndig. Mit anderen Worten, bei der Verwendung von Spion wird die ursprüngliche Funktion immer noch ausgeführt, aber wenn sie Stubs verwenden, wird nicht ausgeführt.

Dies macht Stubs für viele Aufgaben sehr geeignet, wie:

• Ersetzen Sie AJAX oder andere externe Anrufe, die die Tests langsam und schwer zu schreiben
machen
• verschiedene Codepfade nach Funktionsausgabe
ausl?sen
• Testausnahmen, z. B. was passiert, wenn eine Ausnahme ausgel?st wird?

Die Art und Weise, wie wir Stubs erstellen k?nnen, ?hnelt der von Spione ...

assert(callback.calledOnce);

Wir k?nnen anonyme Stubs wie Spione erstellen, aber Stubs werden sehr nützlich, wenn Sie vorhandene Funktionen durch Stubs ersetzen.

Wenn wir beispielsweise einen Code haben, der die AJAX -Funktion von JQuery verwendet, ist es schwierig, ihn zu testen. Der Code sendet eine Anfrage an einen beliebigen Server, den wir konfigurieren, daher müssen wir ihn zur Verfügung stellen oder dem Code einen Sonderfall hinzufügen, damit er dies nicht in einer Testumgebung ausführt - das ist ein gro?es Tabu. Sie sollten kaum testspezifische F?lle in Ihren Code aufnehmen.

Anstatt sich schlechten Praktiken zuzuwenden, k?nnen wir Sinon verwenden und die AJAX -Funktion durch einen Stub ersetzen. Dies macht das Testen trivial.

Dies ist eine Beispielfunktion, die wir testen werden. Es nimmt das Objekt als Parameter und sendet es über AJAX an eine vordefinierte URL.

var spy = sinon.spy();

//我們可以像函數(shù)一樣調用間諜
spy('Hello', 'World');

//現(xiàn)在我們可以獲取有關調用的信息
console.log(spy.firstCall.args); //輸出：['Hello', 'World']

Normalerweise wird das Testen aufgrund von AJAX -Aufrufen und vordefinierten URLs schwierig sein. Wenn wir jedoch Stubs verwenden, wird es einfach.

Angenommen, wir m?chten sicherstellen, dass die an SaveUer übergebene Rückruffunktion nach Abschluss der Anfrage korrekt aufgerufen wird.

var user = {
  ...
  setName: function(name){
    this.name = name;
  }
}

//為 setName 函數(shù)創(chuàng)建一個間諜
var setNameSpy = sinon.spy(user, 'setName');

//現(xiàn)在，每當我們調用該函數(shù)時，間諜都會記錄有關它的信息
user.setName('Darth Vader');

//我們可以通過查看間諜對象來查看
console.log(setNameSpy.callCount); //輸出：1

//重要最后一步 - 刪除間諜
setNameSpy.restore();

Hier ersetzen wir die Ajax -Funktion durch einen Stub. Dies bedeutet, dass die Anfrage nie gesendet wird, wir keinen Server oder so etwas ben?tigen - wir haben die vollst?ndige Kontrolle darüber, was im Testcode vor sich geht!

Weil wir sicherstellen m?chten, dass der Rückruf, den wir an SaveUser geben, aufgerufen wird, werden wir den Stub Ertrag anweisen. Dies bedeutet, dass der Stub die erste Funktion automatisch als Parameter aufruft. Dies simuliert das Verhalten von $ .post, das den Rückruf nach Abschluss der Anfrage aufruft.

Zus?tzlich zum Stub haben wir in diesem Test einen Spion erstellt. Wir k?nnen normale Funktionen als Rückrufe verwenden, aber die Verwendung von Spione k?nnen die Ergebnisse des Tests mit Sinon.assert.Calledonce -Behauptung leicht überprüfen.

In den meisten F?llen k?nnen Sie, wenn Sie Stubs ben?tigen, dasselbe Grundmuster folgen:

• Finden Sie die fragliche Funktion, wie z. B. $ .post
• Zeigen Sie, wie es funktioniert, damit Sie es in Ihren Tests verspotten k?nnen
• Erstellen Sie einen Stub
• Stellen Sie den Stub auf, um das gewünschte Verhalten im Test
zu haben.

Stubs müssen nicht jedes Verhalten simulieren. Das einzige Verhalten, das für das Testen erforderlich ist, ist notwendig und alles andere kann weggelassen werden.

Eine weitere h?ufige Verwendung von

Stubs besteht darin, zu überprüfen, ob Funktionen mit einem bestimmten Parametersatz aufgerufen werden.

Zum Beispiel m?chten wir für unsere AJAX -Funktion sicherstellen, dass der richtige Wert gesendet wird. Daher k?nnen wir so etwas wie Folgendes haben:

function myFunction(condition, callback){
  if(condition){
    callback();
  }
}

describe('myFunction', function() {
  it('should call the callback function', function() {
    var callback = sinon.spy();

    myFunction(true, callback);

    assert(callback.calledOnce);
  });
});

In ?hnlicher Weise haben wir einen Stub für $ .post () erstellt, aber diesmal haben wir ihn nicht nachgeben. Dieser Test kümmert sich nicht um Rückrufe, daher ist es unn?tig, dass er nachgibt.

Wir haben einige Variablen eingerichtet, um die erwarteten Daten zu enthalten - die URL und Parameter. Das Einstellen solcher Variablen ist eine gute Angewohnheit, da wir die Anforderungen des Tests auf einen Blick sehen k?nnen. Es hilft uns auch, Benutzervariablen ohne doppelte Werte festzulegen.

Diesmal haben wir die Sinon.assert.Called With () Behauptung verwendet. Wir übergeben den Stub als erster Parameter, da wir diesmal überprüfen m?chten, dass der Stub mit dem richtigen Parameter aufgerufen wird.

Es gibt eine andere M?glichkeit, AJAX -Anfragen in Sinon zu testen. Dies geschieht durch die Verwendung von Sinons gef?lschtem XMLHTTPrequest -Funktion. Wir werden hier nicht auf Details eingehen, aber wenn Sie verstehen m?chten, wie es funktioniert, sehen Sie sich meinen Artikel über Ajax -Tests mit Sinons gef?lschten XMLHTTPrequest an.

Simulation

Simulation ist ein anderer Ansatz als Stubs. Wenn Sie von dem Begriff "simulierte Objekte" geh?rt haben, ist das dasselbe - Sinons Simulationen k?nnen verwendet werden, um ganze Objekte zu ersetzen und ihr Verhalten zu ?ndern, ?hnlich wie Stubfunktionen.

Wenn Sie mehrere Funktionen aus einem einzelnen Objekt sto?en müssen, sind sie haupts?chlich nützlich. Wenn Sie nur eine einzelne Funktion ersetzen müssen, ist der Stub einfacher zu bedienen.

Sie sollten vorsichtig sein, wenn Sie Simulation verwenden! Aufgrund ihrer Leistung ist es einfach, Ihre Tests zu spezifisch zu machen - zu viele und zu spezifische Dinge -, die Ihre Tests versehentlich anf?llig machen k?nnen.

Im Gegensatz zu Spione und Stubs haben Simulationen integrierte Behauptungen. Sie k?nnen das erwartete Ergebnis vorlegen, indem Sie dem Scheinobjekt mitgeteilt werden, was passieren muss, und dann die überprüfungsfunktion am Ende des Tests aufzurufen.

Angenommen, wir verwenden Store.js, um den Inhalt in LocalStorage zu speichern, und wir m?chten die damit verbundenen Funktionen testen. Wir k?nnen Simulation verwenden, um dies wie folgt zu testen:

var spy = sinon.spy();

//我們可以像函數(shù)一樣調用間諜
spy('Hello', 'World');

//現(xiàn)在我們可以獲取有關調用的信息
console.log(spy.firstCall.args); //輸出：['Hello', 'World']

Bei der Verwendung von Simulation verwenden wir einen reibungslosen Anrufstil, um den erwarteten Anruf und seine Ergebnisse zu definieren, wie oben gezeigt. Dies entspricht der Verwendung der Behauptung zur Validierung der Testergebnisse, mit der Ausnahme, dass wir sie vordefiniert haben, und um sie zu überprüfen, nennen wir Storemock.Verify () am Ende des Tests.

In Sinons Mock -Objektbegriff erstellt das Aufrufen von Mock.xpects ('etwas') eine erwarten . Das hei?t, die Methode verspottet. Jede Erwartung unterstützt die gleichen Funktionen wie Spion und Stubs zus?tzlich zur Emulation spezifischer Funktionen.

Sie k?nnen feststellen, dass die Verwendung von Stubs normalerweise einfacher ist als die Verwendung von Simulationen - es ist v?llig in Ordnung. Simulation sollte mit Vorsicht verwendet werden.

Eine vollst?ndige Liste simulierter spezifischer Funktionen finden Sie in Sinons Simulationsdokumentation.

Wichtige Best Practices: Verwenden Sie Sinon.test ()

Sinon hat eine wichtige Best Practice, die bei der Verwendung von Spione, Stubs oder Simulationen berücksichtigt werden sollte.

Wenn Sie eine vorhandene Funktion durch einen Test-Stand-in ersetzen, verwenden Sie Sinon.test ().

Im vorherigen Beispiel verwenden wir Stub.Restore () oder Mock.restore (), um den Inhalt nach der Verwendung zu beseitigen. Dies ist notwendig, da der Test-Stand-In ansonsten vorhanden bleibt und andere Tests negativ beeinflussen oder zu Fehlern führen kann.

, aber es ist problematisch, die Funktion restore () direkt zu verwenden. Die getestete Funktion kann einen Fehler verursachen und die Testfunktion beenden, bevor Sie restore () aufrufen!

Wir haben zwei M?glichkeiten, dieses Problem zu l?sen: Wir k?nnen den gesamten Inhalt in einem Versuchsfangblock einwickeln. Dies erm?glicht es uns, den restrow () -Anruf in den endgültigen Block zu setzen, um sicherzustellen, dass er l?uft, egal was passiert.

oder, ein besserer Weg ist es, die Testfunktion mit Sinon.Test () zu wickeln

var user = {
  ...
  setName: function(name){
    this.name = name;
  }
}

//為 setName 函數(shù)創(chuàng)建一個間諜
var setNameSpy = sinon.spy(user, 'setName');

//現(xiàn)在，每當我們調用該函數(shù)時，間諜都會記錄有關它的信息
user.setName('Darth Vader');

//我們可以通過查看間諜對象來查看
console.log(setNameSpy.callCount); //輸出：1

//重要最后一步 - 刪除間諜
setNameSpy.restore();

Beachten Sie im obigen Beispiel, dass der zweite Parameter von IT () in Sinon.Test () eingewickelt ist. Das zweite, was zu beachten ist, ist, dass wir dies verwenden.Stub () anstelle von sinon.stub ().

Verwenden Sie Sinon.Test () Wraping -Test erm?glicht es uns, Sinons

sandbox -Funktion zu verwenden, sodass wir Spione und Stubs durch diese.spy (), this.stub () und this.mock () erstellen k?nnen () (). und Simulation. Jedes Test-Stand-In, der mit der Sandbox erstellt wurde, wird automatisch aufger?umt. Beachten Sie, dass unser Beispielcode oben nicht stub.restore () enth?lt - es ist unn?tig, da der Test Sandboxen ist.

Wenn Sie Sinon.Test () verwenden, wann immer m?glich, k?nnen Sie das Problem vermeiden, dass der Test aufgrund eines frühen Tests zuf?llig fehlschl?gt, ohne dass der Test aufgrund von Fehlern eigenst?ndig ist.

Sinon ist keine magische

Sinon führt viele Operationen aus und kann manchmal schwer zu verstehen, wie es funktioniert. Schauen wir uns einige einfache JavaScript -Beispiele an, wie Sinon funktioniert, damit wir besser verstehen k?nnen, wie es intern funktioniert. Dies hilft Ihnen dabei, es effizienter in verschiedenen Situationen zu verwenden.

Wir k?nnen auch manuell Spione, Stubs und Simulationen erstellen. Der Grund, warum wir Sinon verwenden, ist, dass es Aufgaben trivial macht - manuell zu schaffen, kann sehr komplex sein, aber lassen Sie uns sehen, wie es funktioniert, um zu verstehen, was Sinon tut.

Zun?chst ist Spy im Wesentlichen ein Funktionsumschlag:

var spy = sinon.spy();

//我們可以像函數(shù)一樣調用間諜
spy('Hello', 'World');

//現(xiàn)在我們可以獲取有關調用的信息
console.log(spy.firstCall.args); //輸出：['Hello', 'World']

Wir k?nnen mit benutzerdefinierten Funktionen problemlos Spionagefunktionen erhalten. Beachten Sie jedoch, dass Sinons Spione ein breiteres Angebot an Funktionen bieten - einschlie?lich der Unterstützung der Behauptung. Dies macht Sinon bequemer.

Was ist mit dem Stub?

Um einen sehr einfachen Stub zu erstellen, k?nnen Sie einfach eine Funktion durch eine neue Funktion ersetzen:

var user = {
  ...
  setName: function(name){
    this.name = name;
  }
}

//為 setName 函數(shù)創(chuàng)建一個間諜
var setNameSpy = sinon.spy(user, 'setName');

//現(xiàn)在，每當我們調用該函數(shù)時，間諜都會記錄有關它的信息
user.setName('Darth Vader');

//我們可以通過查看間諜對象來查看
console.log(setNameSpy.callCount); //輸出：1

//重要最后一步 - 刪除間諜
setNameSpy.restore();

Sinons Stubs bieten jedoch mehrere Vorteile:

• Sie enthalten volle Spionagefunktionen
• Sie k?nnen das ursprüngliche Verhalten einfach mit stub.restore ()
wiederherstellen
• Sie k?nnen gegen Sinon Stubs
behaupten

Simulationen kombinieren einfach das Verhalten von Spione und Stubs, so dass ihre Funktionalit?t auf unterschiedliche Weise verwendet werden kann.

Obwohl Sinon manchmal so aussieht, als ob es viel "Magie" gemacht hat, kann dies in den meisten F?llen leicht mit Ihrem eigenen Code erfolgen. Sinon ist viel bequemer zu bedienen, anstatt für diesen Zweck eine eigene Bibliothek schreiben zu müssen.

Schlussfolgerung

Testen des Reallebens erscheint manchmal zu kompliziert und kann leicht vollst?ndig aufgeben. Aber bei Sinon wird das Testen fast jeder Code -Art zu einer Kinderspiel.

Denken Sie nur an das Hauptprinzip: Wenn die Funktion Ihren Test schwer zu schreiben macht, versuchen Sie, ihn durch einen Test-Stand-in zu ersetzen. Dieses Prinzip gilt unabh?ngig von der Funktion.

M?chten Sie wissen, wie Sie Sinon in Ihrem eigenen Code anwenden? Besuchen Sie meine Website und ich schicke Ihnen meinen kostenlosen Sinon -Leitfaden für reale Welt, der drei Beispiele für Sinon Best Practices und die Anwendung in verschiedenen Arten von Testsituationen enth?lt!

FAQs über Sinon.js Test (FAQ)

Was ist der Unterschied zwischen Mocks, Spione und Stubs in Sinon.js?

In Sinon.js haben Mocks, Spione und Stubs unterschiedliche Verwendungen. Ein Spion ist eine Funktion, die alle als Parameter, Rückgabewerte, den Wert davon aufzeichnet und die Ausnahme (falls vorhanden). Sie k?nnen verwendet werden, um Funktionsaufrufe und Antworten zu verfolgen. Der Stub ?hnelt einem Spion, hat aber ein vorprogrammiertes Verhalten. Sie erfassen auch Informationen darüber, wie sie aufgerufen werden, aber im Gegensatz zu Spione k?nnen sie verwendet werden, um das Verhalten von Methoden zu kontrollieren, um Methoden zu erzwingen, um Fehler zu werfen oder bestimmte Werte zurückzugeben. Simulation ist eine falsche Methode mit vorprogrammiertem Verhalten (wie Stubs) sowie vorprogrammierten Erwartungen (wie Spion).

Wie kann man Sinon.js für Unit -Tests in JavaScript verwenden?

sinon.js ist ein leistungsstarkes Werkzeug zum Erstellen von Spione, Stubs und Mocks bei JavaScript -Tests. Um es zu verwenden, müssen Sie es zun?chst in Ihr Projekt aufnehmen, indem Sie Skript -Tags in Ihrem HTML verwenden oder über NPM installieren. Sobald Sie enthalten sind, k?nnen Sie mit seiner API Spione, Stubs und Mocks erstellen und verwalten. Diese k?nnen dann verwendet werden, um den Code zu isolieren, den Sie testen, und sicherstellen, dass er wie erwartet funktioniert.

Wie kann man einen Spion in Sinon.js erstellen?

Es ist einfach, einen Spion in Sinon.js zu erstellen. Sie müssen nur die Funktion Sinon.spy () aufrufen. Dies gibt eine Spionagefunktion zurück, die Sie in Ihren Tests verwenden k?nnen. Der Spion wird Informationen darüber aufgezeichnet, wie Sie es aufrufen k?nnen, die Sie dann in Ihren Tests einchecken k?nnen. Sie k?nnen beispielsweise überprüfen, wie oft ein Spion aufgerufen wird, welche Parameter es verwendet, um ihn zu nennen und wie er zurückgibt.

Wie erstellt man Stubs in Sinon.js?

Um einen Stub in Sinon.js zu erstellen, müssen Sie die Funktion Sinon.Stub () aufrufen. Dies gibt eine Stubfunktion zurück, die Sie in Ihren Tests verwenden k?nnen. Der Stub verh?lt sich wie ein Spion und erfasst Informationen darüber, wie Sie es aufrufen k?nnen, erm?glicht es Ihnen jedoch auch, sein Verhalten zu steuern. Zum Beispiel k?nnen Sie den Stub einen Fehler werfen oder einen bestimmten Wert zurückgeben.

Wie kann man in Sinon.js ein Mock erstellen?

Einen Schein in Sinon.js beinhaltet, die Funktion Sinon.mock () zu rufen. Dadurch wird ein Scheinobjekt zurückgegeben, das Sie in Ihren Tests verwenden k?nnen. Das Scheinobjekt verh?lt sich wie ein Spion, protokolliert Informationen darüber, wie man es nennt, und ?hnelt einem Stub, sodass Sie sein Verhalten steuern k?nnen. Aber es erm?glicht Ihnen auch, Erwartungen darüber festzulegen, wie Sie es nennen k?nnen.

Wie kann man Sinon.js mit anderen Testframeworks verwenden?

sinon.js ist so konzipiert, dass sie mit jedem JavaScript -Test -Framework verwendet werden soll. Es bietet einen eigenst?ndigen Test -Framework, kann aber auch in andere beliebte Test -Frameworks wie Mokka, Jasmin und Qunit integriert werden. Die Dokumentation von Sinon.js enth?lt Beispiele für die Integration in diese und andere Testframeworks.

Wie kann man einen Stub oder Spion zu seiner ursprünglichen Funktion wiederherstellen?

Wenn Sie die Funktion durch Stub oder Spion ersetzt haben, k?nnen Sie die ursprüngliche Funktion wiederherstellen, indem Sie die Methode .restore () auf dem Stub oder Spion aufrufen. Dies ist nützlich, wenn Sie nach dem Testen aufr?umen m?chten, um sicherzustellen, dass der Stub oder der Spion andere Tests nicht beeinflusst.

Wie kann man überprüfen, ob Spy mit spezifischen Parametern aufgerufen wurde?

sinon.js bietet verschiedene M?glichkeiten, um zu überprüfen, wie man einen Spion nennt. Sie k?nnen beispielsweise die Methode. CalledWith () verwenden, um zu überprüfen, ob ein Spion mit einem bestimmten Parameter aufgerufen wurde. Sie k?nnen auch die Methode .CaledonceWith () verwenden, um zu überprüfen, ob der Spion nur einmal mit einem bestimmten Parameter aufgerufen wurde.

Wie kann ich einen Stub zu einem bestimmten Wert machen?

Sie k?nnen die Methode von .returns () verwenden, um den Stub zu einem bestimmten Wert zurückzuführen. Wenn Sie beispielsweise einen Stub namens Mystub haben, k?nnen Sie den Wert 'Foo' zurückgeben, indem Sie Mystub.Returns ('foo') anrufen.

Wie kann man einen Stub machen, einen Fehler zu werfen?

Sie k?nnen mit der Methode .Thows () verwenden, um den Stub zu einem Fehler zu werfen. Wenn Sie beispielsweise einen Stub namens Mystub haben, k?nnen Sie einen Fehler machen, indem Sie Mystub.Throws () aufrufen. Standardm??ig wirft dies ein Fehlerobjekt aus, aber Sie k?nnen den Fehler auch einen bestimmten Fehlertyp auswirken, indem Sie den Namen des Fehlers als Parameter übergeben.

Das obige ist der detaillierte Inhalt vonSinon Tutorial: JavaScript -Tests mit Mocks, Spione & Stubs. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!