帶有光譜測試的電子應用程序的簡單示例

Question

我正在嘗試學習如何測試應用程序、使用電子構建、使用光譜。 為此，我從網絡上獲取了一個示例應用程序，其中包含一個簡單的標題、計數器標簽和增量器按鈕。

我使用 mocha 作為測試運行。

測試應啟動應用程序，按下按鈕並檢查計數器標簽。

我什至無法正確啟動應用程序。

運行測試時出現錯誤“TypeError：無法讀取未定義的屬性‘waitUntilWindowLoaded’”。

此外，在查看啟動的應用程序時，我在 devtools 中看到一個錯誤：“未捕獲的 ReferenceError：需要未定義”

主文件

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)

索引.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>

視圖.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)
})

包.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)
    })
})

Answer 1

像這樣創建瀏覽器窗口。

win = new BrowserWindow({width: 800, height: 600,
    webPreferences: {
        nodeIntegration: true
    }
})

然后這將解決未定義的要求問題。

Answer 2

在谷歌搜索並嘗試了幾天后，我發現禁用“devtools”似乎解決了“TypeError：無法讀取未定義的屬性‘waitUntilWindowLoaded’”

這有什么關系？

Answer 3

我在測試流程中添加了更多步驟，並不斷遇到類似的問題。 現在我的“index.js”包含一個這樣的測試：

 it('click button', async () => { await app.client.waitUntilWindowLoaded() await sleep(1000) const btnH = await app.client.$('#countbtn') await btnH.click() await sleep(1000) app.client.$('#countbtn').click() await sleep(1000) const txt = await app.client.$('#click-counter').getText() return assert.equal(txt, '2') })

出於某種原因，我得到了錯誤

類型錯誤：btnH.click 不是 Context 中的函數。 (test\\index.js:38:20) 在 processTicksAndRejections (internal/process/task_queues.js:93:5)

如果我直接在 app.client.$('#countbtn') 上執行 click() 它工作。 但是，如果我首先將結果存儲在變量中，則會出現錯誤。

帶有光譜測試的電子應用程序的簡單示例

問題描述

3 個解決方案

解決方案1
1 2019-12-30 17:04:28

解決方案2
1 2020-01-02 08:26:55

解決方案3
0 2020-02-03 10:08:54

帶有光譜測試的電子應用程序的簡單示例

問題描述

3 個解決方案

解決方案1 1 2019-12-30 17:04:28

解決方案2 1 2020-01-02 08:26:55

解決方案3 0 2020-02-03 10:08:54

解決方案1
1 2019-12-30 17:04:28

解決方案2
1 2020-01-02 08:26:55

解決方案3
0 2020-02-03 10:08:54