使用CucumberJS / Puppeteer，如何扩展具有多个场景的页面对象？

// LoginPage.js

const { Page } = require('puppeteer');

class LoginPage extends Page {
  constructor(page) {
    super(page);
    this.usernameInput = '#username';
    this.passwordInput = '#password';
    this.loginButton = '#login-button';
  }

  async login(username, password) {
    await this.page.type(this.usernameInput, username);
    await this.page.type(this.passwordInput, password);
    await this.page.click(this.loginButton);
  }
}

module.exports = LoginPage;

// ScenarioPage.js

const { Page } = require('puppeteer');
const LoginPage = require('./LoginPage');

class ScenarioPage extends Page {
  constructor(page) {
    super(page);
    this.loginPage = new LoginPage(page);
  }

  async performScenario1() {
    await this.loginPage.login('username1', 'password1');
    // 执行场景1的操作
  }

  async performScenario2() {
    await this.loginPage.login('username2', 'password2');
    // 执行场景2的操作
  }
}

module.exports = ScenarioPage;

// test.js

const { chromium } = require('playwright');
const { defineParameterType, Given, When, Then } = require('cucumber');
const ScenarioPage = require('./ScenarioPage');

defineParameterType({
  name: 'scenario',
  regexp: /Scenario (\d+)/,
  transformer: (number) => parseInt(number),
});

Given('I am on the scenario page', async function () {
  this.browser = await chromium.launch();
  this.page = await this.browser.newPage();
  this.scenarioPage = new ScenarioPage(this.page);
});

When('I perform Scenario {scenario}', async function (scenario) {
  if (scenario === 1) {
    await this.scenarioPage.performScenario1();
  } else if (scenario === 2) {
    await this.scenarioPage.performScenario2();
  }
});

Then('I should see the result of Scenario {scenario}', async function (scenario) {
  // 验证场景的结果
});

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