[Playwright] 複数のFixtureを定義し、組み合わせ可能(composable)にする方法

情報源

Best Practices for Working with Multiple Fixtures · microsoft/playwright · Discussion #14688
の JPtenBerge 氏の回答

利用（各Fixtureの定義は下参照）

your.spec.ts

import {test as base} from "@playwright/test"
import {fooFixture, FooFixture} from "fixtures/foo"
import {barFixture, BarFixture} from "fixtures/bar"

const test = base.extend<FooFixture & BarFixture>({...fooFixture, ...barFixture})

test('works', async ({page, foo, bar}) => {
    foo.doQux()
    bar.doCorge()
})

定義

fixtures/foo.ts

import {test} from "@playwright/test"

export interface FooFixture {
    foo: {
        doQux(): Promise<void>
    }
}

type ExtendParam = Parameters<typeof test.extend<FooFixture>>[0];

export const fooFixture: ExtendParam = {
    foo: async ({page}, use, workerInfo) => {
        await use({
            async doQux() {
            }
        })
    }
};

fixtures/bar.ts

import {test} from "@playwright/test"

export interface BarFixture {
    bar: {
        doCorge(): Promise<void>
    }
}

type ExtendParam = Parameters<typeof test.extend<BarFixture>>[0];

export const barFixture: ExtendParam = {
    bar: async ({page}, use, workerInfo) => {
        await use({
            async doCorge() {
            }
        })
    }
};