Zum Hauptinhalt springen

Frameworks

WebdriverIO Runner bietet integrierte Unterstützung für Mocha, Jasmineund Cucumber.js. Sie können es auch mit Drittanbieter-Open-Source-Frameworks, wie Serenity/JS integrieren.

Integrieren von WebdriverIO mit Testframeworks

Um WebdriverIO mit einem Testframework zu integrieren, benötigen Sie ein Adapterpaket, das auf NPM verfügbar ist. Beachten Sie, dass das Adapterpaket am selben Speicherort installiert werden muss, an dem WebdriverIO installiert ist. Wenn Sie also WebdriverIO global installiert haben, stellen Sie sicher, dass Sie auch das Framework-Adapterpaket global installieren.

Durch die Integration von WebdriverIO in ein Test-Framework können Sie über die globale browser Variable in Ihren Spezifikationsdateien oder Schrittdefinitionen auf die WebdriverIO-Instanz zugreifen. Beachten Sie, dass WebdriverIO sich auch um das Instanziieren und Beenden der Selenium-Sitzung kümmert, so dass Sie es nicht selbst tun müssen selbst.

Verwendung von Mocha​

Installieren Sie zuerst das Adapterpaket von NPM:

npm install @wdio/mocha-framework --save-dev

Standardmäßig stellt WebdriverIO eine Assertion-Library bereit, die Sie direkt nutzen können:

describe('my awesome website', () => {
    it('should do some assertions', async () => {
        await browser.url('https://webdriver.io')
        await expect(browser).toHaveTitle('WebdriverIO · Next-gen browser and mobile automation test framework for Node.js | WebdriverIO')
    })
})

WebdriverIO unterstützt Mochas BDD (Standard), TDD und QUnit Interfaces.

Wenn Sie Ihre Spezifikationen gerne im TDD-Stil schreiben, setzen Sie die Eigenschaft ui in Ihrer Konfiguration mochaOpts auf tdd. Jetzt sollten Ihre Testdateien wie folgt geschrieben sein:

suite('my awesome website', () => {
    test('should do some assertions', async () => {
        await browser.url('https://webdriver.io')
        await expect(browser).toHaveTitle('WebdriverIO · Next-gen browser and mobile automation test framework for Node.js | WebdriverIO')
    })
})

Wenn Sie andere Mocha-spezifische Einstellungen definieren möchten, können Sie dies mit dem Schlüssel mochaOpts in Ihrer Konfigurationsdatei tun. Eine Liste aller Optionen finden Sie auf der Mocha-Projektwebsite.

Hinweis: WebdriverIO unterstützt nicht die veraltete Verwendung von done Callbacks in Mocha:

it('should test something', (done) => {
    done() // throws "done is not a function"
})

Mocha-Optionen​

Die folgenden Optionen können in Ihrer wdio.conf.js angewendet werden, um Ihre Mocha-Umgebung zu konfigurieren. Hinweis: Nicht alle Optionen werden unterstützt, z. B. führt die Anwendung der Option parallel zu einem Fehler, da der WDIO-Testrunner seine eigene Art hat, Tests parallel auszuführen. You can pass these framework options as arguments, e.g.:

wdio run wdio.conf.ts --mochaOpts.grep "my test" --mochaOpts.bail --no-mochaOpts.checkLeaks

This will pass along the following Mocha options:

{
    grep: ['my-test'],
    bail: true
    checkLeacks: false
}

The following Mocha options are supported:

require​

Die Option require ist nützlich, wenn Sie grundlegende Funktionen hinzufügen oder erweitern möchten (WebdriverIO-Framework-Option).

Type: string|string[]
Default: []

compilers​

Verwenden Sie die angegebenen Module, um Dateien zu kompilieren. Compiler werden ausgeführt bevor die von require definierten Fixtures (WebdriverIO-Framework-Option).

Type: string[]
Default: []

allowUncaught​

Propagieren Sie nicht erfasste Fehler.

Type: boolean
Default: false

bail​

Tests beenden nach dem ersten Fehlschlag.

Type: boolean
Default: false

checkLeaks​

Suchen Sie nach globalen Variablenlecks.

Type: boolean
Default: false

delay​

Ausführung der Root-Suite verzögern.

Type: boolean
Default: false

fgrep​

Fokussieren der Tests, die diesem Pattern folgen.

Type: string
Default: null

forbidOnly​

Tests, die mit only markiert sind, werden als Fehler angegeben.

Type: boolean
Default: false

forbidPending​

Brechen Sie den Test-Lauf beim ersten Fehler ab.

Type: boolean
Default: false

fullTrace​

Vollständiger Stacktrace bei Fehler anzeigen.

Type: boolean
Default: false

global​

Mocha Variablen im Globalen Scope injizieren.

Type: string[]
Default: []

grep​

Filter Tests, die dem Regulären Ausdruck entsprechen.

Type: RegExp|string
Default: null

invert​

Testfilter-Matches umkehren.

Type: boolean
Default: false

retries​

Anzahl der Wiederholungen fehlgeschlagener Tests.

Type: number
Default: 0

timeout​

Timeout-Schwellenwert (in ms).

Type: number
Default: 30000

Verwendung von Jasmin​

Installieren Sie zuerst das Adapterpaket von NPM:

npm install @wdio/jasmine-framework --save-dev

Anschließend können Sie Ihre Jasmine-Umgebung konfigurieren, indem Sie in Ihrer Konfiguration die Eigenschaft jasmineOpts festlegen. Eine Liste aller Optionen finden Sie auf der Jasmine-Projektwebsite.

Jasmin-Optionen​

Die folgenden Optionen können in Ihrer wdio.conf.js angewendet werden, um Ihre Jasmine-Umgebung mit der Eigenschaft jasmineOpts zu konfigurieren. Weitere Informationen zu diesen Konfigurationsoptionen finden Sie in der Jasmine-Dokumentation. You can pass these framework options as arguments, e.g.:

wdio run wdio.conf.ts --jasmineOpts.grep "my test" --jasmineOpts.failSpecWithNoExpectations --no-jasmineOpts.random

This will pass along the following Mocha options:

{
    grep: ['my-test'],
    bail: true
    checkLeacks: false
}

The following Jasmine options are supported:

defaultTimeoutInterval​

Standard-Timeout-Intervall für Tests.

Type: number
Default: 60000

helpers​

Liste von Dateipfaden (und Globs) relativ zu spec_dir, die vor den Jasmin-Spezifikationen eingefügt werden sollen.

Type: string[]
Default: []

requires​

Die Option requires ist nützlich, wenn Sie grundlegende Funktionen hinzufügen oder erweitern möchten (WebdriverIO-Framework-Option.

Type: string[]
Default: []

random​

Ob die Ausführungsreihenfolge der Spezifikation randomisiert werden soll.

Type: boolean
Default: true

seed​

Seed als Basis für die Randomisierung zu verwenden. Null bewirkt, dass der Seed zu Beginn der Ausführung zufällig bestimmt wird.

Type: Function
Default: null

failSpecWithNoExpectations​

Definiert, ob der Test als fehlgeschlagen markiert werden soll, wenn keine Assertion gemacht wurde. Standardmäßig wird eine Spezifikation, die keine Assertion enthält, als bestanden gemeldet. Wenn Sie dies auf „true“ setzen, wird eine solcher Test als Fehler gemeldet.

Type: boolean
Default: false

oneFailurePerSpec​

Ob bewirkt werden soll, dass Tests nur einen Erwartungsfehler aufweisen.

Type: boolean
Default: false

specFilter​

Funktion zum Filtern von Spezifikationen.

Type: Function
Default: (spec) => true

grep​

Führen Sie nur Tests aus, die mit dieser Zeichenfolge oder diesem regulären Ausdruck übereinstimmen. (Nur zutreffend, wenn keine benutzerdefinierte specFilter Funktion eingestellt ist)

Type: string|Regexp
Default: null

invertGrep​

Wenn gesetzt, werden die übereinstimmenden Tests invertiert und nur Tests ausgeführt, die nicht mit dem in grepverwendeten Ausdruck übereinstimmen. (Nur zutreffend, wenn keine benutzerdefinierte specFilter Funktion eingestellt ist)

Type: boolean
Default: false

Cucumber verwenden​

Installieren Sie zuerst das Adapterpaket von NPM:

npm install @wdio/cucumber-framework --save-dev

Wenn Sie Cucumber verwenden möchten, setzen Sie die Eigenschaft framework auf cucumber , indem Sie framework: 'cucumber' zur Konfigurationsdatei hinzufügen.

Optionen für Cucumber können in der Konfigurationsdatei mit cucumberOptsangegeben werden. Schauen Sie sich die gesamte Liste der Optionen hier an.

Um Cucumber schnell zum Laufen zu bringen, werfen Sie einen Blick auf unser Cucumber-Boilerplate Projekt, welches viele Step-Definitionen enthält, die Sie für den Einstieg benötigen, um sofort mit dem Schreiben von Feature-Dateien zu starten.

Cucumber Optionen​

Die folgenden Optionen können in Ihrer wdio.conf.js angewendet werden, um Ihre Cucumber-Umgebung mit der Eigenschaft cucumberOpts zu konfigurieren:

Adjusting options through the command line

The cucumberOpts, such as custom tags for filtering tests, can be specified through the command line. This is accomplished by using the cucumberOpts.{optionName}="value" format.

For example, if you want to run only the tests that are tagged with @smoke, you can use the following command:

# When you only want to run tests that hold the tag "@smoke"
npx wdio run ./wdio.conf.js --cucumberOpts.tags="@smoke"
npx wdio run ./wdio.conf.js --cucumberOpts.name="some scenario name" --cucumberOpts.failFast

This command sets the tags option in cucumberOpts to @smoke, ensuring that only tests with this tag are executed.

backtrace​

Vollständige Rückverfolgung für Fehler anzeigen.

Type: Boolean
Default: true

requireModule​

Laden von Modulen, die vor den Support Dateien geladen werden sollen.

Type: string[]
Default: []
Example:

cucumberOpts: {
    requireModule: ['@babel/register']
    // or
    requireModule: [
        [
            '@babel/register',
            {
                rootMode: 'upward',
                ignore: ['node_modules']
            }
        ]
    ]
 }

failFast​

Brechen Sie den Test-Lauf beim ersten Fehler ab.

Type: boolean
Default: false

name​

Führen Sie nur die Szenarien aus, deren Name dem Ausdruck entspricht (wiederholbar).

Type: RegExp[]
Default: []

require​

Liste der Dateien, die die Step-Definitionen implementieren. Liste der Dateien, die die Step-Definitionen implementieren Liste der Dateien, die die Step-Definitionen implementieren Sie können auch einen Glob für Ihre Step-Definitionen angeben.

Type: string[]
Default: [] Example:

cucumberOpts: {
    require: [path.join(__dirname, 'step-definitions', 'my-steps.js')]
}

import​

Paths to where your support code is, for ESM.

Type: String[]
Default: [] Example:

cucumberOpts: {
    import: [path.join(__dirname, 'step-definitions', 'my-steps.js')]
}

strict​

Fehlgeschlagen, wenn undefinierte oder ausstehende Schritte vorhanden sind.

Type: boolean
Default: false

tags​

Führen Sie nur die Funktionen oder Szenarien mit Tags aus, die dem Ausdruck entsprechen. Weitere Einzelheiten finden Sie in der Cucumber-Dokumentation.

Type: String
Default: ``

timeout​

Timeout in Millisekunden für Schrittdefinitionen.

Type: Number
Default: 30000

retry​

Specify the number of times to retry failing test cases.

Type: Number
Default: 0

retryTagFilter​

Only retries the features or scenarios with tags matching the expression (repeatable). This option requires '--retry' to be specified.

Type: RegExp

language​

Default language for your feature files

Type: String
Default: en

order​

Run tests in defined / random order

Type: String
Default: defined

format​

Name and output file path of formatter to use. WebdriverIO primarily supports only the Formatters that writes output to a file.

Type: string[]

formatOptions​

Options to be provided to formatters

Type: object

tagsInTitle​

Add cucumber tags to feature or scenario name

Type: Boolean
Default: false

Please note that this is a @wdio/cucumber-framework specific option and not recognized by cucumber-js itself

ignoreUndefinedDefinitions​

Behandeln Sie undefinierte Definitionen als Warnungen.

Type: Boolean
Default: false

Please note that this is a @wdio/cucumber-framework specific option and not recognized by cucumber-js itself

failAmbiguousDefinitions​

Uneindeutige Definitionen als Fehler markieren.

Type: Boolean
Default: false

Please note that this is a @wdio/cucumber-framework specific option and not recognized by cucumber-js itself

tagExpression​

Only execute the features or scenarios with tags matching the expression. Please see the Cucumber documentation for more details.

Type: String
Default: ``

Please note that this option would be deprecated in future. Use tags config property instead

profile​

Geben Sie das zu verwendende Cucumber-Profil an.

Type: string[]
Default: []

Kindly take note that only specific values (worldParameters, name, retryTagFilter) are supported within profiles, as cucumberOpts takes precedence. Additionally, when using a profile, make sure that the mentioned values are not declared within cucumberOpts.

Skipping tests in cucumber​

Beachten Sie, dass Sie, wenn Sie einen Test mit den in cucumberOpts verfügbaren Filterfunktionen für Cucumber Tests überspringen möchten, dies für alle Browser und Geräte tun werden, die in den Funktionen konfiguriert sind. Um Szenarien nur für bestimmte Browser-Kombinationen überspringen zu können, ohne dass eine Sitzung gestartet wird, falls dies nicht erforderlich ist, stellt WebdriverIO die folgende spezifische Tag-Syntax für Gurke bereit:

@skip([condition])

ist eine optionale Kombination von Capability-Eigenschaften mit ihren Werten, die, wenn alle übereinstimmen, dazu führen, dass das markierte Szenario oder Feature übersprungen wird. Natürlich können Sie Szenarien und Funktionen mehrere Tags hinzufügen, um Tests unter verschiedenen Bedingungen zu überspringen.

Sie können auch die Annotation '@skip' verwenden, um Tests zu überspringen, ohne 'tagExpression' zu ändern. In diesem Fall werden die übersprungenen Tests im Testbericht angezeigt.

Hier haben Sie einige Beispiele für diese Syntax:

  • @skip oder @skip(): Überspringt immer das markierte Element
  • @skip(browserName="chrome"): Der Test wird nicht für Chrome-Browser ausgeführt.
  • @skip(browserName="firefox";platformName="linux"): überspringt den Test in Firefox in Linux.
  • @skip(browserName=["chrome","firefox"]): Markierte Steps werden sowohl mit Chrome- als auch mit dem Firefox-Browser übersprungen.
  • @skip(browserName=/i.*explorer/): capabilities with browsers matching the regexp will be skipped (like iexplorer, internet explorer, internet-explorer, ...).

Import Step Definition Helper​

Um Schrittdefinitionshelfer wie Given, When or Then oder Hooks zu verwenden, sollten Sie then from @cucumber/cucumberimportieren, z. B. so:

import { Given, When, Then } from '@cucumber/cucumber'

Wenn Sie Cucumber jetzt bereits für andere Arten von Tests verwenden, die nichts mit WebdriverIO zu tun haben und für die Sie eine bestimmte Version verwenden, müssen Sie diese Helfer in Ihre e2e-Tests aus dem WebdriverIO Cucumber-Paket importieren, z.B.:

import { Given, When, Then, world, context } from '@wdio/cucumber-framework'

Dadurch wird sichergestellt, dass Sie die richtigen Helfer innerhalb des WebdriverIO-Frameworks verwenden, und Sie können eine unabhängige Cucumber-Version für andere Arten von Tests verwenden.

Publishing Report​

Cucumber provides a feature to publish your test run reports to https://reports.cucumber.io/, which can be controlled either by setting the publish flag in cucumberOpts or by configuring the CUCUMBER_PUBLISH_TOKEN environment variable. However, when you use WebdriverIO for test execution, there's a limitation with this approach. It updates the reports separately for each feature file, making it difficult to view a consolidated report.

To overcome this limitation, we've introduced a promise-based method called publishCucumberReport within @wdio/cucumber-framework. This method should be called in the onComplete hook, which is the optimal place to invoke it. publishCucumberReport requires the input of the report directory where cucumber message reports are stored.

You can generate cucumber message reports by configuring the format option in your cucumberOpts. It's highly recommended to provide a dynamic file name within the cucumber message format option to prevent overwriting reports and ensure that each test run is accurately recorded.

Before using this function, make sure to set the following environment variables:

  • CUCUMBER_PUBLISH_REPORT_URL: The URL where you want to publish the Cucumber report. If not provided, the default URL 'https://messages.cucumber.io/api/reports' will be used.
  • CUCUMBER_PUBLISH_REPORT_TOKEN: The authorization token required to publish the report. If this token is not set, the function will exit without publishing the report.

Here's an example of the necessary configurations and code samples for implementation:

import { v4 as uuidv4 } from 'uuid'
import { publishCucumberReport } from '@wdio/cucumber-framework';

export const config = {
    // ... Other Configuration Options
    cucumberOpts: {
        // ... Cucumber Options Configuration
        format: [
            ['message', `./reports/${uuidv4()}.ndjson`],
            ['json', './reports/test-report.json']
        ]
    },
    async onComplete() {
        await publishCucumberReport('./reports');
    }
}

Please note that ./reports/ is the directory where cucumber message reports will be stored.

Using Serenity/JS​

Serenity/JS ist ein Open-Source-Framework, das entwickelt wurde, um Akzeptanz- und Regressionstests komplexer Softwaresysteme schneller, kollaborativer und einfacher zu skalieren.

Für WebdriverIO-Testsuiten bietet Serenity/JS:

Beispiel für einen Serenity BDD-Bericht

Installing Serenity/JS​

Um Serenity/JS zu einem WebdriverIO-Projekthinzuzufügen, installieren Sie die folgenden Serenity/JS-Module von NPM:

npm install @serenity-js/{core,web,webdriverio,assertions,console-reporter,serenity-bdd} --save-dev

Erfahren Sie mehr über Serenity/JS-Module:

Configuring Serenity/JS​

Um die Integration mit Serenity/JS zu aktivieren, konfigurieren Sie WebdriverIO wie folgt:

wdio.conf.ts
import { WebdriverIOConfig } from '@serenity-js/webdriverio';

export const config: WebdriverIOConfig = {

    // Tell WebdriverIO to use Serenity/JS framework
    framework: '@serenity-js/webdriverio',

    // Serenity/JS configuration
    serenity: {
        // Configure Serenity/JS to use the appropriate adapter for your test runner
        runner: 'cucumber',
        // runner: 'mocha',
        // runner: 'jasmine',

        // Register Serenity/JS reporting services, a.k.a. the "stage crew"
        crew: [
            // Optional, print test execution results to standard output
            '@serenity-js/console-reporter',

            // Optional, produce Serenity BDD reports and living documentation (HTML)
            '@serenity-js/serenity-bdd',
            [ '@serenity-js/core:ArtifactArchiver', { outputDirectory: 'target/site/serenity' } ],

            // Optional, automatically capture screenshots upon interaction failure
            [ '@serenity-js/web:Photographer', { strategy: 'TakePhotosOfFailures' } ],
        ]
    },

    // Configure your Cucumber runner
    cucumberOpts: {
        // see Cucumber configuration options below
    },


    // ... or Jasmine runner
    jasmineOpts: {
        // see Jasmine configuration options below
    },

    // ... or Mocha runner
    mochaOpts: {
        // see Mocha configuration options below
    },

    runner: 'local',

    // Any other WebdriverIO configuration
};

Erfahren Sie mehr über

Producing Serenity BDD reports and living documentation​

Serenity BDD-Berichte und Dokumentation werden von Serenity BDD CLIgeneriert, ein Java-Programm, das vom Modul @serenity-js/serenity-bdd heruntergeladen und verwaltet wird.

Um Serenity BDD-Berichte zu erstellen, muss Ihre Testsuite:

  • Laden Sie die Serenity BDD CLI herunter, indem Sie serenity-bdd update aufrufen, das die CLI jar lokal zwischenspeichert
  • Erstellen Sie Zwischenberichte von Serenity BDD .json , indem Sie SerenityBDDReporter gemäß den Konfigurationsanweisungenregistrieren
  • Rufen Sie die Serenity BDD-CLI auf, wenn Sie den Bericht erstellen möchten, indem Sie serenity-bdd runaufrufen

Das von allen Serenity/JS-Projektvorlagen verwendete Muster basiert auf der Verwendung von:

  • ein postinstall NPM-Skript zum Herunterladen der Serenity BDD CLI
  • npm-failsafe , um den Berichtsprozess auch dann auszuführen, wenn die Testsuite selbst fehlgeschlagen ist (genau dann, wenn Sie Testberichte am meisten benötigen ...).
  • rimraf als bequeme Methode zum Entfernen aller Testberichte, die vom vorherigen Lauf übrig geblieben sind
package.json
{
  "scripts": {
    "postinstall": "serenity-bdd update",
    "clean": "rimraf target",
    "test": "failsafe clean test:execute test:report",
    "test:execute": "wdio wdio.conf.ts",
    "test:report": "serenity-bdd run"
  }
}

Um mehr über den SerenityBDDReporterzu erfahren, konsultieren Sie bitte:

Using Serenity/JS Screenplay Pattern APIs​

Das Screenplay Pattern ist ein innovativer, benutzerzentrierter Ansatz zum Schreiben hochwertiger automatisierter Abnahmetests. Es führt Sie zu einer effektiven Nutzung von Abstraktionsebenen, Ihren Testszenarien dabei, die Geschäftssprache Ihrer Domäne zu erfassen, und fördert gute Test- und Softwareentwicklungsgewohnheiten in Ihrem Team.

Standardmäßig, wenn Sie @serenity-js/webdriverio als Ihr WebdriverIO Framework, registrieren, konfiguriert Serenity/JS standardmäßig Cast von Akteuren, wobei jeder Akteur Folgendes kann:

Dies sollte ausreichen, um Ihnen den Einstieg in die Einführung von Testszenarien, die dem Drehbuchmuster folgen, auch in einer vorhandenen Testsuite zu erleichtern, zum Beispiel:

specs/example.spec.ts
import { actorCalled } from '@serenity-js/core'
import { Navigate, Page } from '@serenity-js/web'
import { Ensure, equals } from '@serenity-js/assertions'

describe('My awesome website', () => {
    it('can have test scenarios that follow the Screenplay Pattern', async () => {
        await actorCalled('Alice').attemptsTo(
            Navigate.to(`https://webdriver.io`),
            Ensure.that(
                Page.current().title(),
                equals(`WebdriverIO · Next-gen browser and mobile automation test framework for Node.js | WebdriverIO`)
            ),
        )
    })

    it('can have non-Screenplay scenarios too', async () => {
        await browser.url('https://webdriver.io')
        await expect(browser)
            .toHaveTitle('WebdriverIO · Next-gen browser and mobile automation test framework for Node.js | WebdriverIO')
    })
})

Weitere Informationen zum Drehbuchmuster finden Sie hier:

Welcome! How can I help?

WebdriverIO AI Copilot