时间戳

首页 > 解决方案 > 在 Mocha 和 Playwright 的所有测试之前运行的 Root Hook 插件

vue.js - 在 Mocha 和 Playwright 的所有测试之前运行的 Root Hook 插件

问题描述

通过将这个插件添加到我的项目中，我为我的 Vuejs 项目连接了一些自动化测试。

Vuejs 应用程序是使用 vue-cli 创建的。

一切正常，Playwright 似乎是一个非常强大的自动化库。

所以我正在尝试编写一个 Mocha 根钩子插件，它在所有测试之前运行一次。看起来像这样：

钩子.js

const playwright = require("playwright");

export const mochaHooks = {
  beforeAll() {
    const browser = await playwright["chromium"].launch({
      headless: false
    });

    const context = await browser.newContext();

    await page.goto("https://localhost:44392/");

    await page.fill("#Username", "demokitchenadmin");
    await page.fill("#Password", "Test1234)");

    await page.click("button.btn-primary");

    await context.storageState({ path: 'state.json' });

    await page.close();
    await context.close();
    await browser.close();
  }
};

我不确定如何将它与我的 Vuejs 项目集成。我试图添加--require标志（doco），以便测试命令看起来像这样（in package.json）：

"scripts": {
    ...
    "test:e2e": "vue-cli-service test:e2e --require './tests/e2e/hooks.js",
},

不幸的是，这并没有成功运行该hooks.js文件中的代码。

任何人都可以将我推向正确的方向。干杯

标签： vue.jsautomated-testsvue-test-utilsplaywright

解决方案

好的。所以我很接近。
我不得不使用 CommonJS 语法。
我想我需要继续努力，因为我想让它在 Typescript 中工作。

无论如何，对于希望解决此问题的任何其他人，我将hooks.js文件更改如下：

const playwright = require("playwright");


exports.mochaHooks = {
  async beforeAll() {

    const browser1 = await playwright["chromium"].launch({
      headless: false
      //devtools: true
    });

    const context1 = await browser1.newContext();
    const page = await context1.newPage();

    await page.goto("https://localhost:44392/account/login");


    await page.fill("#Username", "demokitchenadmin");
    await page.fill("#Password", "Test1234)");

    await page.click("button.btn-primary");

    await context1.storageState({ path: 'state.json' });

    await page.close();
    await context1.close();
    await browser1.close();
  }
};

在我的package.json：

"scripts": {
    ...
    "test:e2e": "vue-cli-service test:e2e -r ./tests/e2e/hooks",
},

这很有效，并且该身份验证代码在我所有的测试之前运行了一次。

推荐阅读