@serenity-js/webdriverio

Serenity/JS

Serenity/JS is a framework designed to make acceptance and regression testing of modern full-stack applications faster, more collaborative and easier to scale.

Visit serenity-js.org for the latest tutorials and API docs, and follow @SerenityJS and @JanMolak on Twitter for project updates.

Subscribe to Serenity/JS YouTube channel to get notified when new demos and video tutorials are available.

Learning Serenity/JS

To learn more about Serenity/JS, follow the tutorial, review the examples, and create your own test suite with Serenity/JS template projects.

If you have any questions, join us on Serenity/JS Community Chat.

Serenity/JS WebdriverIO

@serenity-js/webdriverio module is a Screenplay Pattern-style adapter for WebdriverIO, that helps with testing Web-based and mobile apps.

Installation

To install this module, run the following command in your WebdriverIO project directory:

npm install --save-dev @serenity-js/{core,webdriverio}

Next, install one of the below test runner adapters.

Usage with Cucumber.js

To use Serenity/JS WebdriverIO with Cucumber.js, install the following adapter:

npm install --save-dev @serenity-js/cucumber

Please note that Serenity/JS WebdriverIO / Cucumber integration supports both Serenity/JS reporting services and native Cucumber.js reporters.

Usage with Jasmine

To use Serenity/JS WebdriverIO with Jasmine, install the following adapter:

npm install --save-dev @serenity-js/jasmine

Usage with Mocha

To use Serenity/JS WebdriverIO with Mocha, install the following adapter:

npm install --save-dev @serenity-js/mocha

Configuring Webdriverio

// wdio.conf.ts

// Import Serenity/JS reporting services, a.k.a. the "Stage Crew Members"
import { ArtifactArchiver } from '@serenity-js/core';
import { ConsoleReporter } from '@serenity-js/console-reporter';
import { SerenityBDDReporter } from '@serenity-js/serenity-bdd';
import { Photographer, TakePhotosOfFailures } from '@serenity-js/webdriverio';

export const config = {
    // Tell WebdriverIO to use Serenity/JS framework
    framework: '@serenity-js/webdriverio',

    serenity: {
        // Configure Serenity/JS to use an appropriate test runner adapter
        runner: 'cucumber',
        // runner: 'mocha',
        // runner: 'jasmine',

        // Register StageCrewMembers we've imported at the top of this file    
        crew: [
            ArtifactArchiver.storingArtifactsAt(process.cwd(), 'target/site/serenity'),
            ConsoleReporter.forDarkTerminals(),
            new SerenityBDDReporter(),
            Photographer.whoWill(TakePhotosOfFailures),
        ]
    },

    // configure Cucumber runner
    cucumberOpts: {
        // see the Cucumber configuration options below
    },

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

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

    specs: [
        // load Cucumber feature files
        './features/**/*.feature',
        // or Mocha/Jasmine spec files 
        // './spec/**/*.spec.ts',
    ],
    
    // add any additional native WebdriverIO reports
    // reporters: [
    //     'spec',
    // ],

    // ... other WebdriverIO-specific configuration   
};

Learn more about:

• Cucumber configuration options
• Jasmine configuration options
• Mocha configuration options
• WebdriverIO configuration file

Interacting with websites and web apps

import { actorCalled } from '@serenity-js/core';
import { Ensure, equals } from '@serenity-js/assertions';
import { by, BrowseTheWeb, Navigate, Target, Text } from '@serenity-js/webdriverio';

class SerenityJSWebsite {
    static header = Target.the('header').located(by.css('h1'));
}

actorCalled('Wendy')
    .whoCan(
        BrowseTheWeb.using(browser)
    )
    .attemptsTo(
        Navigate.to('https://serenity-js.org'),
        Ensure.that(
            Text.of(SerenityJSWebsite.header), 
            equals('Next generation acceptance testing')
        ),
    )

To learn more, check out the example projects.

Template Repositories

The easiest way for you to start writing web-based acceptance tests using Serenity/JS, WebdriverIO and either Mocha, Cucumber or Jasmine is by using one of the below template repositories:

• Serenity/JS, Mocha, and WebdriverIO template
• Serenity/JS, Cucumber, and WebdriverIO template (coming soon!)
• Serenity/JS, Jasmine, and WebdriverIO template (coming soon!)

More coming soon!

New features, tutorials, and demos are coming soon, so follow us on Twitter and join the Serenity/JS Community chat channel to stay up to date!