Spectron测试使窗口打开

Question

我只是使用基本的Spectron测试文件( Typescript)来打开我的应用程序，获取窗口计数，然后大概退出。然而，“幽灵党”的app.stop()似乎只关闭了开发工具窗口，而让主窗口继续运行。我到处搜索，遇到了一些有这个问题的人的GitHub问题。人们最好的选择似乎就是使用pkill。我不想这样做，因为它可能会杀死更多的人(例如，在CI服务器上)。

在我展示所有代码之前，我的问题是，我需要做什么才能使Spectron的会话在测试后真正退出？

以下是我的spec.ts，其中包含我的测试：

import { Application } from "spectron";
import * as assert from "assert";
import * as electronPath from "electron";
import * as path from "path";

describe('Application launch', function () {
    this.timeout(10000);

    beforeEach(function () {
        this.app = new Application({
            path: electronPath,
            args: [path.join(__dirname, '..')]
        } as any);
        return this.app.start();
    })

    afterEach(function () {
        if (this.app && this.app.isRunning()) {
            // TODO: figure out way to close all windows
            return this.app.electron.app.quit();
        }
    });

    it('shows an initial window', function () {
        return this.app.client.getWindowCount().then(function (count: any) {
            //assert.equal(count, 1)
            // Please note that getWindowCount() will return 2 if `dev tools` are opened.
            assert.equal(count, 2);
        });
    });
});

这是我的package.json

{
  "main": "dist/js/entry/main.js",
  "scripts": {
    "build": "node_modules/.bin/tsc -p tsconfig.json && mkdir -p dist/static && rsync -ar --delete static/ dist/static/",
    "lint": "node_modules/.bin/tslint -c tslint.json -p tsconfig.json",
    "start": "node_modules/.bin/electron .",
    "build_start": "npm run build && npm start",
    "package": "node_modules/.bin/electron-builder",
    "package-test": "node_modules/.bin/electron-builder --dir",
    "test": "node_modules/.bin/mocha -r ts-node/register -r ignore-styles -r jsdom-global/register test/*.ts"
  },
  "devDependencies": {
    "@types/chai": "^4.1.4",
    "@types/mocha": "^5.2.4",
    "ajv": "^6.5.1",
    "asar": "^0.14.3",
    "chai": "^4.1.2",
    "electron": "^2.0.3",
    "electron-builder": "^20.16.0",
    "ignore-styles": "^5.0.1",
    "jasmine": "^3.1.0",
    "jsdom": "^11.11.0",
    "jsdom-global": "^3.0.2",
    "mocha": "^5.2.0",
    "spectron": "^3.8.0",
    "ts-node": "^7.0.0",
    "tslint": "^5.10.0",
    "typescript": "^2.9.2"
  },
  "build": {
    "appId": "your.id",
    "files": [
      "dist/**/*"
    ],
    "directories": {
      "output": "build"
    },
    "linux": {
      "category": "Video",
      "target": [
        "deb",
        "snap"
      ]
    }
  },
  "dependencies": {
    "@types/core-js": "^2.5.0",
    "moment": "^2.22.2",
    "winston": "^3.0.0"
  }
}

这是我的main.ts

import { app, BrowserWindow, ipcMain, crashReporter } from "electron";
import * as path from "path";

process.env.ELECTRON_PROCESS_NAME = "main";

import { initLogger } from "../common/logging";

let log = initLogger();
log.info("=== Starting up ===");

let mainWindow: Electron.BrowserWindow = null;

function createMainWindow() {
    if (mainWindow === null) {
        mainWindow = new BrowserWindow({
            height: 600,
            width: 800,
        });
        mainWindow.loadFile(path.join(__dirname, "../../static/ui.html"));
        mainWindow.webContents.openDevTools();
    }
}

app.on("ready", createMainWindow);

app.on("window-all-closed", () => {
    // On macOS it is common for applications and their menu bar
    // to stay active until the user quits explicitly with Cmd + Q
    if (process.platform !== "darwin") {
        log.info("Exiting...");
        app.quit();
    }
});

app.on("activate", () => {
    // On macOS it's common to re-create a window in the app when the
    // dock icon is clicked and there are no other windows open.
    createMainWindow();
});

Answer 1

一个简单的解决方案是禁用devtools，因为它们无论如何都不会出现在最终版本中。您可以添加一个"--debug“参数(在main.js中解析)，并将其添加到package.json的”启动“脚本中。然后，如果你不添加参数，devtools将不会在你的测试中打开。

如果你想保留devtools或者只是确保退出你的应用程序，你可以使用Node.js exit()函数停止你的主进程，这有点残酷：

afterEach(function () {
    if (this.app && this.app.isRunning()) {
        this.app.mainProcess.exit(0);
    }
});

我选择同时禁用devtools和确保退出(以防止我的应用程序中可能阻止退出的任何bug )。我不熟悉Mocha，因为我用的是AVA，我在JS工作，而不是TS。所以我试着修改这段代码，但可能会有一些错误：

beforeEach(function () {
    this.app = new Application({
        path: electronPath,
        // you could add --debug in the following array
        // don't do it, to keep the devtools closed
        args: [path.join(__dirname, '..')]
    } as any);
    return this.app.start();
})

// use ES8 'async' to be able to wait
afterEach(async function () {
    if (this.app && this.app.isRunning()) {
        // get the main process PID
        let pid = this.app.mainProcess.pid;

        // close the renderer window using its own js context
        // to get closer to the user action of closing the app
        // you could also use .stop() here
        await this.app.client.execute(() => {
            window.close();
        });

        // here, the app should be close

        try {
            // check if PID is running using '0' signal (throw error if not)
            process.kill(pid, 0);
        }
        catch(e) {
            // error catched : the process was not running

            // do someting to end the test with success !
            return;
        }

        // no error, process is still running, stop it
        this.app.mainProcess.exit(1);
        // do someting to end the test with error
        return
    }
});

Answer 2

尝尝这个

  app.on('window-all-closed', () => {
    // prevent quit on MacOS. But also quit if we are in test.
    if (process.platform !== 'darwin' || isTest) {
      app.quit();
    }
  });

isTest是const isTest = process.env.NODE_ENV === 'test';

然后应用程序将正常退出！

要获取process.env.NODE_ENV，您可能需要更新您的webpack以使用DefinePlugin：

  new webpack.DefinePlugin({
    'process.env.NODE_ENV': `"${process.env.NODE_ENV ?? 'production'}"`,
    // global: {},
  }),

Answer 3

使用最新的Electron，你必须在contextIsolation设置为false的情况下打开你的窗口。

const win = new BrowserWindow({
   ...,
   webPreferences: {
      nodeIntegration: true,
      contextIsolation: false,
      enableRemoteModule: true
   }
})