PlayWright 无法截取屏幕截图 - 页面已关闭

Question

我正在尝试使用Jest 和PlayWright 截取失败的测试用例，处理函数在自定义环境中定义，如下所示

const PlaywrightEnvironment = require('jest-playwright-preset/lib/PlaywrightEnvironment')
    .default

class CustomEnvironment extends PlaywrightEnvironment {
    async setup() {
        await super.setup()
    }

    async teardown() {
        await super.teardown()
    }

    async handleTestEvent(event, state) {
        if (event.name === 'test_done' && event.test.errors.length > 0) {
            const parentName = event.test.parent.name.replace(/\W/g, '-')
            const specName = event.test.name.replace(/\W/g, '-')

            await this.global.page.screenshot({
                path: `screenshots/${parentName}_${specName}.png`,
            })
        }
    }
}

module.exports = CustomEnvironment;

但是，每次测试后我都会关闭页面..

afterEach(async () => {
    await page.close();
});

这导致page 在截屏之前被关闭

测试套件无法运行

page.screenshot: Target page, context or browser has been closedError:

  18 |             const specName = event.test.name.replace(/\W/g, '-')
  19 |
> 20 |             await this.global.page.screenshot({
     |                                    ^
  21 |                 path: `screenshots/${parentName}_${specName}.png`,
  22 |             })
  23 |         }

有没有办法将事件传递给afterEach，以便在发生错误时它不会关闭，或者有一种方法可以更同步地截屏，以便afterEach在截屏之前不会被执行拍了吗？

Answer 1

您可能希望在自定义夹具/配置中使用 page.close() 的故意特殊情况，但根据您的尝试，我不会说您就是这种情况。默认情况下，浏览器/上下文将在每次测试后自动关闭，因此也会关闭正在测试的页面。可以看到默认的拆解here。

删除您的 afterEach 方法应该可以解决问题。 :)

其他显着特点：

• 查看Playwright-Test，了解自定义配置/固定装置如何帮助您创建一致的测试环境（即，如果您希望某些环境截取屏幕截图only-on-failure 而不是其他环境。
• Playwright 还支持page object models——该功能使您的测试更具可读性和可维护性。我还有一个示例 here，如果有帮助，您可以参考新版 Playwright 的页面对象模型。