问题
I am trying to learn how to test apps, build with electron, using spectron. for this I took an example application from the web with a simple header, counter label, and incrementer button.
I use mocha as a test runnen.
The test should launch the app, push the button and check the counter label.
I can't even get to the point where the app is launched properly.
I am getting the error " TypeError: Cannot read property 'waitUntilWindowLoaded' of undefined" when I run the test.
Also when looking at the launched app I see an error in the devtools: "Uncaught ReferenceError: require is not defined"
main.js
const {app, BrowserWindow} = require('electron')
const url = require('url')
const path = require('path')
let win
function createWindow() {
win = new BrowserWindow({width: 800, height: 600})
win.loadURL(url.format ({
pathname: path.join(__dirname, 'index.html'),
protocol: 'file:',
slashes: true
}))
// open dev tools
win.webContents.openDevTools();
}
app.on('ready', createWindow)
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset = "UTF-8">
<title>Hello World!</title>
<link rel = "stylesheet"
href = "./bower_components/bootstrap/dist/css/bootstrap.min.css" />
</head>
<body>
<div class = "container">
<h1>This page is using Bootstrap and jQuery!</h1>
<h3 id = "click-counter"></h3>
<button class = "btn btn-success" id = "countbtn">Click here</button>
<script src = "./view.js" ></script>
</div>
</body>
</html>
view.js
let $ = require('jquery') // jQuery now loaded and assigned to $
let count = 0
$('#click-counter').text(count.toString())
$('#countbtn').on('click', () => {
count ++
$('#click-counter').text(count)
})
package.json
{
"name": "gui_testing",
"version": "1.0.0",
"description": "app to test spectron",
"main": "main.js",
"scripts": {
"test": "mocha"
},
"author": "ACW",
"license": "ISC",
"dependencies": {
"jquery": "^3.4.1"
},
"devDependencies": {
"electron": "^7.1.7",
"mocha": "^6.2.2",
"spectron": "^9.0.0"
}
}
./test/index.js
const assert = require('assert')
const path = require('path')
const { Application } = require('spectron')
const electronPath = require('electron') // Require Electron from the binaries included in node_modules.
const baseDir = path.join(__dirname, '..')
const sleep = time => new Promise(r => setTimeout(r, time))
describe('Application launch', function () {
this.timeout(30000)
const app = new Application({
path: electronPath,
args: [baseDir]
})
before(function () { app.start() })
after(function () { app.stop() })
it('show an initial window', async function () {
await app.client.waitUntilWindowLoaded();
const count = await app.client.getWindowCount();
assert.equal(count, 1)
})
})
回答1:
Create your browser window like this.
win = new BrowserWindow({width: 800, height: 600,
webPreferences: {
nodeIntegration: true
}
})
Then this will resolve the undefined require issue.
回答2:
after googling and trying for a few days I found that disabling "devtools" seems to resolve the "TypeError: Cannot read property 'waitUntilWindowLoaded' of undefined"
How can this be related?
来源:https://stackoverflow.com/questions/59533379/simple-example-of-electron-app-with-spectron-test