Was ist WebdriverIO?

WebDriverIO ist ein Open-Source Framework basierend auf NodeJS zur Automatisierung moderner Web- und Mobilanwendungen. Es nutzt das Webdriver-Protokoll, das von Browseranbietern entwickelt und unterstützt wird und garantiert somit echtes browserübergreifendes E2E-Testing, während andere Automatisierungsframeworks modifizierte Browser herunterladen, die nicht von echten Benutzern verwendet werden oder das Benutzerverhalten durch Einfügen JavaScript emulieren.

Setup: Protocol Bindings / Standalone

WebdriverIO ist so konzipiert, dass es in jeder beliebigen Umgebung und für jede Art von Aufgabe funktioniert, unabhängig von 3rd-Party-Frameworks und benötigt nur Node.js zur Ausführung. Für grundlegende Interaktionen mit dem Webdriver-Protokoll (und anderen Automatisierungsprotokollen) verwendet WebdriverIO seine eigenen Protokollbindungen, die auf dem NPM-Package webdriver aufbauen. Für Interaktionen mit Web-Elementen wird jedoch der Standalone–Modus empfohlen, so können zusätzlich zum Protokoll neue Befehle, Auto-Waits oder Smart-Locators definiert werden.

const WebDriver = require('webdriver');

(async () => {
    const client = await WebDriver.newSession({
        capabilities: { browserName: 'firefox' }
    })

    await client.navigateTo('https://www.google.com/ncr')

    const searchInput = await client.findElement('css selector', '#lst-ib')
    await client.elementSendKeys(searchInput['element-6066-11e4-a52e-4f735466cecf'], 'WebDriver')

    const searchBtn = await client.findElement('css selector', 'input[value="Google Search"]')
    await client.elementClick(searchBtn['element-6066-11e4-a52e-4f735466cecf'])

    console.log(await client.getTitle()) // outputs "WebDriver - Google Search"

    await client.deleteSession()
})()

Beispielsweise lassen sich obige Protokoll-Interaktionen mit dem Standalone-Modus vereinfachen:

const { remote } = require('webdriverio');

(async () => {
    const browser = await remote({
        logLevel: 'trace',
        capabilities: {
            browserName: 'chrome'
        }
    })

    await browser.url('https://duckduckgo.com')

    const inputElem = await browser.$('#search_form_input_homepage')
    await inputElem.setValue('WebdriverIO')

    const submitBtn = await browser.$('#search_button_homepage')
    await submitBtn.click()

    console.log(await browser.getTitle()) // outputs: "Title is: WebdriverIO (Software) at DuckDuckGo"

    await browser.deleteSession()
})().catch((e) => console.error(e))

Einige Features von WebdriverIO

• Automatisierung moderner Web-Anwendungen in React, Vue, Angular etc.
• Automatisierung Desktop-Applikationen z.B. in Electron.js
• Verwendet das Webdriver-Protokoll, ein offizieller W3C Web-Standard, unterstützt von vielen Browsern
• Vereinfachtes Element Command Chaining im asynchronen Modus, z.B. await (await (await $('#foo')).$$('.bar'))[42].click()wird zu await $('#foo').$$('.bar')[42].click()
• Ermöglicht den Testern, eigene Befehle im Test-Skript durch addCommand() zu schreiben