Asynchroner Codetest der React-App

Hier werde ich Ihnen zeigen, wie Sie den asynchronen Code von React-App testen. Ich hoffe, dass Sie eine grundlegende Idee haben, wie man die grundlegenden Testfälle schreibt, wenn nicht, schauen Sie sich bitte meinen vorherigen Artikel hier an , das ist ziemlich einfach. Wenn Sie mit der asynchronen Codeausführung vertraut sind.
Es gibt mehrere Möglichkeiten, dies zu erreichen, wie im Folgenden erläutert:

1. Promise :
In diesem Beispiel unten habe ich eine einfache Funktion erstellt, die uns verspricht, den bestimmten Benutzer im angegebenen Array zu finden.

Unten ist der Testfall für die oben geschriebene, auf Versprechen basierende Funktion:

Unten sehen Sie die erwartete Ausgabe, wenn Sie „ npm test — Promise.spec.js“ auf Ihrem vs code-Terminal ausführen:

2. API-Endpunkt:
Hier führen wir einen einfachen axios-API-Aufruf aus, um einige Benutzerdaten über einen Open Source / kostenlosen API-Dienst abzurufen. Und wird Testfälle über die gleichen schreiben.

Unten sind die Testfälle für die obige async/await-basierte fetchingUsers-Funktion:

Sie können die folgenden Befehle auf Ihrem Terminal ausführen: „npm test — api.spec.js“

3. CallBack:
Hier haben wir eine einfache Multiplikationsfunktion erstellt, die 2 Argumente (dh Nummer und Callback-Funktion) benötigt . Sobald dies ihre vollständige Aufgabe erledigt hat, wird die Callback-Funktion (dh cb) aufgerufen.

function callbackBasedFunc(number, cb) {
         cb(number * 2);
}

describe("Async Code Test cases::", () => {
   test(“to check multiplication once callback finish:”, (done) => {
        function callback(data) {
                 expect(data).toEqual(4);
                 done();
        }
        callbackBasedFunc(2, callback);
   });
});

um ein oder zwei oder drei zu klatschen… 👏👏👏
DANKE.