paint-brush
TypeScript vs. JavaScript im automatisierten REST-API-Testvon@bormando
3,333 Lesungen
3,333 Lesungen

TypeScript vs. JavaScript im automatisierten REST-API-Test

von Dmitrii Bormotov6m2023/08/04
Read on Terminal Reader
Read this story w/o Javascript

Zu lang; Lesen

TypeScript ist eine Programmiersprache, die als Paket im Node.js-Ökosystem präsentiert wird. Mit diesem Paket können Sie: 1. Führen Sie prägnante (absolute) Importe in Ihr Projekt durch. 2. Erstellen Sie benutzerdefinierte Typen für Ihre Anfrage- und Antwortnutzlasten. 3. Verwenden Sie Intellisense- und Typprüfungsfunktionen, um weniger Syntaxfehler in Ihrem Code zu machen. Benutzerdefinierte Typen dienen auch als Dokumentation für Ihre Nutzdaten – Sie müssen hierfür nicht mehr bei Ihren externen Sammlungen/Tools nachfragen!
featured image - TypeScript vs. JavaScript im automatisierten REST-API-Test
Dmitrii Bormotov HackerNoon profile picture
0-item

Hallo zusammen!


Ich wurde von meinen Studierenden und Mentees zu diesem Artikel inspiriert. Ich empfehle ihnen oft, TypeScript zu lernen, sobald sie mit dem Testautomatisierungsprozess auf JavaScript vertraut sind. Sehen wir uns an, welche Merkmale die Verwendung von TypeScript in Ihrem Testautomatisierungs-Framework im Hinblick auf REST-API-Tests aufweist …


Den vollständigen Code eines Testprojekts finden Sie hier .

Typoskript

Lassen Sie uns nicht zu tief darauf eingehen, was TypeScript ist und wie es sich von JavaScript unterscheidet, und das Wichtige benennen: Es ist die Programmiersprache . Aber ganz wichtig: Es hängt direkt von JavaScript ( Node.js- Plattform) ab.


TypeScript wird als Node.js- Paket präsentiert, daher betrachte ich es einfach als JavaScript mit einigen coolen Funktionen.


Um mehr über die Sprache selbst und ihre Angebote zu erfahren, besuchen Sie bitte die offizielle Website , während wir über ihre Funktionen im Hinblick auf die Testautomatisierung sprechen …

Projektaufbau

Lassen Sie uns den Erstellungsprozess eines Testautomatisierungsprojekts auf TypeScript durchgehen:


  1. Erstellen Sie ein Node.js- Projekt.

    npm init -y

  2. Installieren Sie das TypeScript- Paket.

    npm i typescript

  3. Generieren Sie eine Standard- TypeScript- Konfiguration für das Projekt – tsconfig.json .

    npx tsc --init


Der obige Befehl generiert eine Standardkonfigurationsdatei, ich empfehle jedoch, sie stark zu kürzen, etwa so :


 { "compilerOptions": { "baseUrl": "./", "module": "esnext", "target": "esnext", "sourceMap": false, "moduleResolution": "node", "allowJs": true, "skipLibCheck": true, "resolveJsonModule": true, "allowSyntheticDefaultImports": true, "paths": { "*": ["./*"] } } }


Diese Konfiguration enthält das erforderliche Minimum:


  • verwendet die neueste EcmaScript- Version,
  • macht JSON-Importe verfügbar,
  • ermöglicht die Verwendung des absoluten Pfads beim Import.


Sie können Ihre Konfiguration mithilfe der offiziellen Dokumentation erweitern.


Werkzeugauswahl

Sie können jedes Tool verwenden, das das Node.js- Ökosystem zu bieten hat, aber meiner Erfahrung nach entscheiden sich die meisten Ingenieure, die mit TypeScript arbeiten, aus mehreren guten Gründen für Jest :


  • großartige Community-Unterstützung (Updates, Antworten, Dokumente, Codebeispiele),
  • flexible Konfiguration.


Früher hatte ich Spaß daran, Mocha + Chai zu verwenden, um den Kern des Projekts einzurichten, aber jetzt bleibe ich auch bei Jest, da es sowohl einen Testläufer als auch eine Assertionsbibliothek enthält.


Axios scheint der beliebteste HTTP-Client zu sein, daher schlage ich vor, dass dies auch Ihre Wahl ist.


Ich kann nicht sagen, dass Sie gezwungen sind, dies für Ihr Setup zu verwenden, aber ich sage, dass es das Übliche ist, wenn Sie sich die Projekte ansehen.


Jetzt installieren Sie einfach diese Pakete als Abhängigkeiten:

npm i jest axios

Typsammlungen

Einige Pakete (wie Axios ) enthalten TypeScript- Typen, Jest und Mocha jedoch nicht. Außerdem benötigt Jest ein ts-jest- Paket zusammen mit @types/jest , um ordnungsgemäß zu funktionieren – das erste aktiviert TypeScript- Funktionen und das zweite ermöglicht die Verwendung von IntelliSense .


Denken Sie also daran: Wenn Sie bei der Verwendung einiger Pakete nicht über die Funktion zur automatischen Vervollständigung verfügen, fehlen Ihnen wahrscheinlich Typdeklarationen.


Lassen Sie uns auch TypeScript -bezogene Erweiterungen (Pakete) installieren:

npm i ts-jest @types/jest

Aufbau

Jest erfordert eine ts-jest- Konfigurationsvoreinstellung, daher müssen Sie diese in Ihrer Konfigurationsdatei (oder package.json ) deklarieren:


 { "jest": { "preset": "ts-jest" } }


Wenn Sie innerhalb eines Projekts den absoluten Pfad verwenden möchten, müssen Sie auch Ihre Konfiguration anpassen:


 { "jest": { "preset": "ts-jest", "moduleDirectories": [ "node_modules", "<rootDir>" ] } }


Mit dieser Konfiguration können Sie Tests mit einem einfachen Befehl ausführen ... jest


Konfigurieren Sie Ihr Testskript in package.json also wie folgt:


 { "scripts": { "test": "jest" } }


Und führen Sie Ihre Tests dann jederzeit mit dem Befehl npm test oder npm run test aus.


Laufende Tests


Ich empfehle Ihnen außerdem , eine Jest Runner-Erweiterung zu installieren, wenn Sie Visual Studio Code- Benutzer sind. Damit können Sie gewünschte Tests/Suites mit nur einem Klick ausführen / debuggen . In WebStorm handelt es sich um eine integrierte Funktion.


Führen Sie Tests mit einem Klick aus und debuggen Sie sie!

Benutzerdefinierte Typen

Die Hauptfunktion, die TypeScript in REST-API-Tests einführt, ist... Typen , Natürlich!


Sie können angeben, wie Ihr Anfrage- und Antworttext aussehen soll, d. h. Schlüsselnamen , Werttypen und ETC.


Nehmen wir als Beispiel einen Paysis- Server – wir können seine Request-Body-Nutzlast für den /auth Endpunkt als Typ aufschreiben:


 export type AuthRequestBody = { login: string password: string }


Und das Gleiche gilt für den Antworttext – welcher Server soll unsere Anfrage senden:


 export type AuthResponseBody = { token?: string message?: string }


Da es für Erfolgs-/Misserfolgsszenarien eine andere Nutzlast geben würde, können Sie Schlüssel über das „ ?“ als „optional“ markieren. Charakter.


Sobald dies erledigt ist, können Sie diese Typen verwenden, um Anfragen und Überprüfungen in Ihren Tests zu verfassen ...

Anfrage

In Axios können Sie über die Anforderungskonfiguration angeben, welchen Text Sie senden:


 const payload: AxiosRequestConfig<AuthRequestBody> = { method: 'post', url: '/auth', data: { login: process.env.USERNAME, password: process.env.PASSWORD, }, }


AuthRequestBody in AxiosRequestConfig<AuthRequestBody> bedeutet genau das ☝️

Dies bedeutet, dass Sie gezwungen sind, die Nutzlast zu verwenden, die dem bereitgestellten Typ AuthRequestBody im data entspricht. Wenn Sie vergessen, einige erforderliche Felder festzulegen oder zu viele Felder festzulegen, wird eine Fehlermeldung angezeigt.

Antwort

Das Gleiche gilt auch für die Reaktion:


 const response: AxiosResponse<AuthResponseBody> = await client.request(payload)


Dadurch wird die automatische Vervollständigung zum Objekt response.data hinzugefügt, sodass Sie auf die Felder response.data.token “ oder response.data.message zugreifen können.

Erweiterte Tools

Abgesehen von den oben genannten einfachen Dingen ist es auch möglich, ein JSON-Schema aus Ihren benutzerdefinierten Typen zu generieren . Damit können Sie nicht jeden einzelnen Schlüssel in einem Antworttext überprüfen, um festzustellen, ob er mit dem Schema übereinstimmt, sondern die gesamte Nutzlast .


Die Idee ist also:


  1. Generieren Sie ein JSON- Schema aus benutzerdefinierten Typen.
  2. Verwenden Sie einen benutzerdefinierten Matcher toMatchSchema, um den Antworttext zu validieren.


Ziemlich coole Sache, aber denken Sie daran, dass Ihre Tests nach diesen Änderungen möglicherweise unzuverlässig werden – das passiert, wenn einige zusätzliche Felder erscheinen, sodass Sie das Schema regelmäßig aktualisieren müssen.

Abschluss

Die Einrichtung von TypeScript kann schwierig sein, insbesondere wenn Sie es zum ersten Mal verwenden, aber es lohnt sich!


Wenn Sie Ihre Eingabe- und Ausgabedaten mit Typen abdecken, kann es beim Parsen dieser Objekte auf keinen Fall zu Tippfehlern oder anderen Syntaxfehlern kommen. Es erspart Ihnen einfache Fehler und lässt Sie die Struktur Ihrer Anfragen direkt in Ihrem Code sehen, sodass Sie keine HTTP- Sammlung (wie Postman ) öffnen und nach der benötigten Anfrage suchen müssen, um zu sehen, welchen Text sie anfordert/antwortet mit.


Teilen Sie mir Ihre Erfahrungen und Ihre Meinung mit.