Extract Jest step definition to a separate file - jestjs

Question

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:
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?

Answer 1

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 );