electron - 在 Windows 上对 Electron 应用程序进行端到端测试

Question

我正在努力实现的目标:

我想建立一个具有适当 headless 端到端测试配置的 Electron 项目。

遇到的问题

Spectronjs 似乎是实现这一目标的解决方案。但是，没有任何配置可以防止窗口在每次测试时打开。阅读存储库上的一些线程+关于测试的 Electron 文档提到了 Xvfb。我试图解决这个问题，但到目前为止我明白这不能安装在 Windows 上？而且别无选择。

页面上的列表包括其他选项，例如 Appvoyer 或 CicleCI，但这些又是新的，我几乎找不到关于这些的指南，更不用说，我不太喜欢我必须执行所有这些步骤(链接到 github/bitbucket 帐户等)。

我也尝试过从 electronjs 列表页面浏览演示应用程序，但并不是所有的应用程序都有测试，当他们测试时，它们有时是用似乎不同的编程语言编写的，或者专门针对 angular 或 react ，而我的目标是使用 vuejs。

任何人都可以指出我在 Windows 上对 Electron 应用程序进行离线端到端 headless 测试的干净示例吗？

Answer 1

有几种选择如何 E2E 测试 Electron 应用程序，不幸的是，它们都不是真正的 headless 。在 Windows 上你不需要 Xvfb，它是 Linux 的东西。在 Windows 上，即使在 CI 环境中也有一个“屏幕”可用(我有使用 Appveyor 和 Azure Pipelines 的经验)。

Puppeteer-core (Puppeteer-core 不含 Chrome )

Spectron

Selenium-webdriver

Webdriver.io

过去我使用 Spectron，但我最近切换到 Puppeteer，我对切换感到非常满意。

Short Puppeteer 试用测试文件:

const electron = require("electron");
const puppeteer = require("puppeteer-core");

const delay = ms =>
  new Promise(resolve => {
    setTimeout(() => {
      resolve();
    }, ms);
  });

(async () => {
  try {
    const app = await puppeteer.launch({
      executablePath: electron,
      args: ["."],
      headless: false,
    });
    const pages = await app.pages();
    const [page] = pages;

    await page.setViewport({ width: 1200, height: 700 });
    await delay(5000);
    const image = await page.screenshot();
    console.log(image);
    await page.close();
    await delay(2000);

    await app.close();
  } catch (error) {
    console.error(error);
  }
})();

我正在使用以下配置在 Win、Linux 和 MacOS 上的 Azure Pipelines(开源项目免费)中测试和构建一个 Electron 应用程序:
azure-pipelines.yml