在Playwright中模拟C#风格静态类存储测试共享数据遇异常

需求背景 #

需要在Playwright测试中复用共用流程：当多个测试需要执行相同流程时，仅首次执行，后续测试若需求相同则跳过；若需求不同则重新执行对应流程。计划通过模拟C#风格的静态类存储测试间的公共状态数据来实现。

尝试的实现代码 #

CurrentState.ts（模拟静态类） #

export abstract class CurrentState {  // 尝试实现静态类
    static userSetting1: boolean = false;
    static userSetting2: boolean = false;
    static userSetting3: boolean = false;
}

myPage.ts（封装设置流程） #

export class myPage {
    async setUserSettings(userSetting1: boolean, userSetting2: boolean, userSetting3: boolean) {
        if(userSetting1 != CurrentState.userSetting1 || userSetting2 != CurrentState.userSetting2 || userSetting3 != CurrentState.userSetting3) {
            // 执行用户设置流程
            // 更新当前状态，避免后续相同设置重复执行
            CurrentState.userSetting1 = userSetting1;
            CurrentState.userSetting2 = userSetting2;
            CurrentState.userSetting3 = userSetting3;
        }
    }
}

测试代码 #

test(`1`, async ({page}) => {
    await myPage.setUserSettings(true, false, false);  // 预期执行流程：初始状态为false，需改为true
});

test(`2`, async ({page}) => {
    await myPage.setUserSettings(true, false, false);  // 预期跳过流程：设置与上一测试相同
});

test(`3`, async ({page}) => {
    await myPage.setUserSettings(false, true, false);  // 预期执行流程：设置与当前状态不同
});

问题现象 #

原本预期同一Worker运行的测试能共享CurrentState的静态值，但实际检查时这些值均为undefined，导致无法正确判断是否跳过流程。

问题原因分析 #

1. 方法调用错误：myPage中的setUserSettings是实例方法，但测试中直接通过类名myPage.setUserSettings调用，这种方式会导致方法内部无法正确访问CurrentState，甚至引发上下文错误。
2. 模块初始化问题：虽然TS中抽象类的静态属性在模块加载时会初始化，但如果模块导入路径错误（如重复导入、相对路径错误），可能导致加载多个CurrentState模块实例，静态属性无法共享。
3. Playwright测试隔离：即使同一Worker，若测试代码存在异步初始化问题，也可能导致静态属性未被正确赋值就被访问。

解决方案 #

方案1：修正方法调用方式 #

将setUserSettings改为静态方法，确保可以直接通过类名调用：

// myPage.ts
export class myPage {
    static async setUserSettings(userSetting1: boolean, userSetting2: boolean, userSetting3: boolean) {
        if(userSetting1 != CurrentState.userSetting1 || userSetting2 != CurrentState.userSetting2 || userSetting3 != CurrentState.userSetting3) {
            // 执行用户设置流程
            CurrentState.userSetting1 = userSetting1;
            CurrentState.userSetting2 = userSetting2;
            CurrentState.userSetting3 = userSetting3;
        }
    }
}

或者在测试中实例化myPage后调用实例方法（需确保类构造函数接收必要参数，如page）：

// 测试代码
test(`1`, async ({page}) => {
    const pageInstance = new myPage(page);
    await pageInstance.setUserSettings(true, false, false);
});

方案2：改用对象字面量实现静态存储 #

抛弃类的方式，直接用简单的对象存储状态，更简洁且避免类的复杂性：

// CurrentState.ts
export const CurrentState = {
    userSetting1: false,
    userSetting2: false,
    userSetting3: false
};

方案3：使用Playwright Worker Fixture（推荐） #

Playwright官方提供了Worker级别的Fixture机制，用于存储同一Worker内跨测试的共享状态，这是更可靠、符合Playwright测试模型的方式：

1. 定义Worker Fixture：

// my-test.ts
import { test as base } from '@playwright/test';

// 定义共享状态类型
type WorkerFixtures = {
    currentState: {
        userSetting1: boolean;
        userSetting2: boolean;
        userSetting3: boolean;
    };
};

// 扩展测试Fixtures，设置作用域为worker
export const test = base.extend<WorkerFixtures>({
    currentState: [async ({}, use) => {
        const initialState = {
            userSetting1: false,
            userSetting2: false,
            userSetting3: false
        };
        await use(initialState);
    }, { scope: 'worker' }]
});

2. 修改myPage.ts接收状态参数：

export class myPage {
    static async setUserSettings(page: Page, currentState: any, userSetting1: boolean, userSetting2: boolean, userSetting3: boolean) {
        if(userSetting1 != currentState.userSetting1 || userSetting2 != currentState.userSetting2 || userSetting3 != currentState.userSetting3) {
            // 执行用户设置流程
            currentState.userSetting1 = userSetting1;
            currentState.userSetting2 = userSetting2;
            currentState.userSetting3 = userSetting3;
        }
    }
}

3. 在测试中使用Fixture：

import { test } from './my-test';
import { myPage } from './myPage';

test(`1`, async ({page, currentState}) => {
    await myPage.setUserSettings(page, currentState, true, false, false);
});

test(`2`, async ({page, currentState}) => {
    await myPage.setUserSettings(page, currentState, true, false, false);
});

test(`3`, async ({page, currentState}) => {
    await myPage.setUserSettings(page, currentState, false, true, false);
});

总结 #

模块级静态变量在同一Worker内理论上可共享，但容易出现调用错误或模块加载问题。推荐使用Playwright的Worker Fixture存储跨测试状态，这是官方支持的方式，能确保状态在同一Worker内的测试间正确共享，且符合Playwright的测试隔离模型。

内容的提问来源于stack exchange，提问作者Andy Giebel