WDIO Next.js Service

This service helps you to launch your application when using Next.js. It is a tiny wrapper around the next dev command that automatically starts the Next.js dev-server using your next.conf.js before launching the test.

Installation

If you are getting started with WebdriverIO you can use the configuration wizard to set everything up:

npm init wdio@latest .

It will detect your project as a Next.js project and will install all necessary plugins for you. If you are adding this service to an existing setup, you can always install it via:

npm install wdio-next-service --save-dev

Configuration

To enable the service, just add it to your services list in your wdio.conf.js file, e.g.:

// wdio.conf.js
export const config = {
    // ...
    services: ['next'],
    // ...
};

You can apply a service option by passing in an array with a config object, e.g.:

// wdio.conf.js
export const config = {
    // ...
    services: [
        ['next', {
            rootDir: './packages/next-app'
        }]
    ],
    // ...
};

If you need custom Next.js configurations for your WebdriverIO tests you can use the WDIO_NEXT_SERVICE environment variable to modify your Next.js setup, e.g.:

/** @type {import('next').NextConfig} */
const nextConfig = {};

if (process.env.WDIO_NEXT_SERVICE) {
    // add custom Next.js configuration for testing here
    // ...
}

export default nextConfig;

Usage

If your config is set up accordingly, the service will set the baseUrl option to point to your application. You can navigate to it via the url command, e.g.:

await browser.url('/')
await expect(browser).toHaveTitle('Create Next App')
await expect($('aria/Create Next App')).toBePresent()

Options

rootDir

Root directory of the project.

Type: string Default: process.cwd()

hostname

Hostname to start the server on.

Type: string Default: localhost

port

Port to start the server on.

Type: number Default: process.env.NUXT_PORT || config.devServer.port

For more information on WebdriverIO see the homepage.