Einführung in Front-End-Testtools

js_test_framework

Dieses Tool wird hauptsächlich für Web-Front-End-Unit-Tests verwendet. Es implementiert Vor-Ort-Tests auf der Schnittstelle, indem es js-Methoden direkt im Browser aufruft

Git-Adresse:

Prozess

1. Erfassen Sie die erforderlichen Anfragen vor Ort über testLive. testLive zeichnet alle Anfragen während des Zeitraums auf und kann erneut erfasst werden. gleichzeitig ausführen

2. Geben Sie die von testLive aufgezeichnete Anforderung über die Ausgabemethode an die Konsole aus, schreiben Sie die Ausgabedaten in die RequestData des benutzerdefinierten Moduls und registrieren Sie sie anschließend in der requestFactory Definieren der Daten

3. Schreiben Sie die Test.js des benutzerdefinierten Moduls, rufen Sie die Netzwerkanforderung in der requestFactory auf, schreiben Sie die Behauptungen, die beurteilt werden müssen, und registrieren Sie den Unit-Test und den Prozess Test jedes Moduls an den testManager

4. Führen Sie den Testfall im testManager aus, sehen Sie sich die Ergebnisse während der Testausführung an und analysieren Sie die Ergebnisse

Beispiel der Dateiverzeichnisstruktur

Basic: Kernmodul

testLive
requestFactory
testManager

Modul: externes Modul, nur Beispiel

user

userRequestData
userTest

Produkt

productRequestData
ProduktTest
...

Die drei Module

sind unabhängig von einander und können individuell angepasst und ersetzt werden

---

testLive

    前端录制现场,通过调用回调接口,记录下用户在前端界面的所有操作记录

Externe Schnittstelle

• startRecord startet Aufnahme, Name ist der Name der Aufnahme

• stopRecord Aufnahme beenden

• output Gibt die Ergebnismenge aller Aufnahmen aus

• runRecord Aufzeichnung ausführen

• shouRequest Verzeichnisstruktur und Details aller Aufzeichnungen anzeigen

• Callback externe Callback-Funktion, die externe Funktion kann in der Methode aufgerufen werden, rufen Sie diesen Rückruf auf

Erweiterungsmethode

• ajaxOverride schreibt die Ajax-Anfrage neu und fügt alle Jquery-Ajax zum Rückruf hinzu

---

requestFactory

    请求工厂,主要用于收集用户的所有请求记录

Externe Schnittstelle

• registerMethod-Registrierungsmethode, durch Dieser externe Methodenaufruf kann die Methode in requestFactory registrieren

• registerData-Registrierungsdaten. Diese Methode ähnelt registerMethod, außer dass die Parameterstruktur unterschiedlich ist

• getMethod ruft die Methode über den Methodennamen ab {Name: benutzerdefinierter Methodenname, URL: Netzwerkanforderungsadresse, methodType: Anforderungsmethode, Ausführung: Ausführungsmethode}

• getMethod.run Nach der Übergabe Mit getMethod können Sie die Ausführungsfunktion direkt aufrufen, um die Methode auszuführen und das Ergebnis zurückzugeben {costTime: Overhead-Zeit, requestData: Anforderungsparameter, Typ: Anforderungsmethode, URL: Netzwerkanforderungsadresse, ResponseData: Server-Rückgabeergebnis, Erfolg: ob die Anforderung war erfolgreich🎜>

• showMethods zeigt alle Anfragen in requestFactory an

---

testManager

    测试集成,用于管理测试,将测试模块化,以及结果的展示

Externe Schnittstelle

• registerMethod-Registrierungsmethode, über diese Methode kann ein externer Aufruf die Methode in testManager registrieren

• registerData-Registrierungsdaten, diese Methode Ähnlich wie bei registerMethod, mit der Ausnahme, dass die Parameterstruktur unterschiedlich ist.

• Laufmethode ausführen, der Rückgabewert sind die Ergebnisdetails dieses Laufs
  Die Verzeichnisstruktur ist｛assertQueue: eine Sammlung von alle Assertion-Ergebnisse, ResponseQueue: Sammlung aller Anforderungsergebnisse, errAssertQueue: Sammlung aller Assertion-Fehler, errorResponseQueue: Sammlung aller Netzwerk-Anforderungsfehler, spendTime: Anforderungszeitaufwand, Success: ob erfolgreich｝

• showAll zeigt die Verzeichnisstruktur aller getesteten Module an

• showMethods zeigt alle Testmethoden unter dem Modul anhand des Modulnamens an

• Basierend auf Webanalysetools:

• 1. Ali Test

• 2. Baidu Application Performance Testing Center

• 2. Webseitentest

3. PingDom-Tools
4. GTmetrix
>

• Browserbasierte Analysetools:

• 1. Chrome-eigenes Tool F12

• 2 -in: YSlow (Yahoo-Tool)

• 3. Page Speed ​​​​(Google)

• Interne Tool-Klasse

assertQueue Diese Klasse wird zum Aufzeichnen und Bestimmen der Ziele des Benutzers verwendet. Ob das Ergebnis mit dem tatsächlichen Ergebnis übereinstimmt und gleichzeitig die Ergebnismenge ausgegeben wird

Ergebnisbezogene Daten

• recordResponse wird verwendet, um die Ergebnisse von Netzwerkanfragen aufzuzeichnen

• assert User-Set Assertion

Das obige ist der detaillierte Inhalt vonEinführung in Front-End-Testtools. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!