Extract Jest step definition to a separate file

Viewed 324

I'm doing some e2e tests with Jest and Puppeteer and I hit a bottleneck. I want to move step definitions to separate file so that I can reuse them across different tests.

I encounter the following issue:

Enter image description here

Here is my setup:

File dummyTest.test.js:

import {loginUser} from '../steps/test';

describe(
'dummy test',
() => {
    let page;
    beforeAll( async () => {
        const context = await browser.createIncognitoBrowserContext();
        page = await context.newPage();
        await page.setViewport( { width: 1200, height: 960 } );
        await page.goto( 'http://localhost:8080' );
    }, timeout );

    afterAll( async () => {
        await page.close();
        delay( 1000 );
        console.log( 'killing all chromium zombies' );
        exec( 'kill -9 $(ps aux | grep \'chromium\' | awk \'{print $2})\'' );
        exec( 'kill -9 $(ps aux | grep \'http-server\' | awk \'{print $2})\'' );
    }, 10000 );

    it( 'should see login page', loginUser, 10000 );
},
10000 );

File test.js:

export const loginUser = async () => {
await page.waitForSelector( 'form' );
await page.click( 'input[name=email]' );
await page.type( 'input[name=email]', 'me@me.com' );
await page.click( 'input[name=password]' );
await page.type( 'input[name=password]', 'test123' );
await page.screenshot( { path: './test-results/PrefilledLogin.png' } );
await page.keyboard.down( 'Enter' );
await page.screenshot( { path: './test-results/LoginSubmit.png' } );
};

What am I doing wrong?

1 Answers

I solved it.

In order for this to work, I had to pass the page object, and the done callback to the function:

it( 'should see login page', ( done ) => loginUser( done, page ), 10000 );
Related