如何在Cucumber.js BDD框架中集成Zerostep AI功能

错误原因 #

1. Playwright Test上下文不匹配：你在Cucumber步骤定义中嵌套调用了Playwright的test()函数，而test()只能在Playwright Test框架的专属运行上下文（如.spec.js测试文件）中使用，无法在Cucumber的独立运行环境中执行，这直接触发了上下文不匹配的报错。
2. 无效的test参数传递：直接从@playwright/test导入test对象并传给Zerostep的ai函数是无效的，该test对象依赖Playwright Test的运行时环境，而Cucumber没有提供这个环境。

解决方案 #

1. 移除嵌套的Playwright test()调用 #

Cucumber的Scenario本身就是测试上下文，不需要在步骤中额外嵌套Playwright的test()函数。

2. 为Zerostep提供兼容的test替代对象 #

在非Playwright Test环境中，Zerostep只需要一个包含基础断言能力的对象，我们可以模拟一个兼容的test代理对象，替代原生Playwright test。

3. 用Cucumber World传递page对象 #

避免使用全局变量存储page，改用Cucumber的World对象管理上下文，避免多场景运行时的冲突。

修改后的代码示例 #

Hooks文件 #

const { Before, After } = require('@cucumber/cucumber');
const { chromium } = require('playwright');

Before(async function () {
    const browser = await chromium.launch();
    this.page = await browser.newPage(); // 将page挂载到Cucumber World对象
});

After(async function () {
    await this.page.close();
});

步骤定义文件 #

const { Given, When, Then } = require('@cucumber/cucumber');
const { expect } = require('@playwright/test');
const { ai } = require('@zerostep/playwright');

// 生成兼容Zerostep的test代理对象，提供必要的断言能力
const createZerostepTestProxy = () => ({
    expect: expect
    // 若Zerostep需要其他方法（如fail、pass），可在此扩展
});

Given('User Navigates to the application', async function() {
    await ai("Navigate to https://www.globalsqa.com/samplepagetest/", {
        page: this.page,
        test: createZerostepTestProxy()
    });
});

Given('User enters the valid email', async function() {
    await ai("Type 'statsHarinderSAgusain@yopmail.com' into Email textfield", {
        page: this.page,
        test: createZerostepTestProxy()
    });
});

Given('User enters the valid password', async function() {
    await ai("Type 'Harinder@12345' into Enter Password textfield", {
        page: this.page,
        test: createZerostepTestProxy()
    });
});

When('User clicks on login button on vs application', async function() {
    await ai("Click on 'Login' button", {
        page: this.page,
        test: createZerostepTestProxy()
    });
});

Then('User is presented on dashboard page', async function() {
    await ai("Validate 'Enroll a new patient' button is visible", {
        page: this.page,
        test: createZerostepTestProxy()
    });
});

注意事项 #

• 确保@zerostep/playwright与@playwright/test版本兼容，避免版本冲突引发的隐性问题。
• 不要在Cucumber步骤中直接使用Playwright Test的API（如test()、test.describe()），两者属于独立的测试框架，上下文无法互通。

内容的提问来源于stack exchange，提问作者Harinder Singh Gusain