Search code examples
javascriptreactjsjestjselectronspectron

Spectron app.start() isn't launching the app


I'm relatively new to Spectron and Jest and I can't figure out why the app isn't launching when I call app.start() in my unit test. Right now when I run npm test, the app won't start, eventually times out (even after 30 seconds) and always sends this error message:

Timeout - Async callback was not invoked within the 15000 ms timeout specified by jest.setTimeout.Error: Timeout - Async callback was not invoked within the 15000 ms timeout specified by jest.setTimeout. at mapper (node_modules/jest-jasmine2/build/queueRunner.js:27:45)

So far I've tried:

  • making sure I'm using the correct versions of spectron and electron (11.0.0 and 9.0.0 respectively)
  • running npm test from my root folder, my src folder, and my tests folder.
  • deleting my node_modules folder, reinstalling everything, and rebuilding the app.
  • using path.join(__dirname, '../../', 'node_modules', '.bin', 'electron') as my app.path.

Here's my test1.js file:

const path = require('path')
const electronPath = require('electron');// for testing app from the src folder
const { jest } = require('@jest/globals');
import "regenerator-runtime/runtime";

let app = new Application({
    path: electronPath,
    args: [path.join(__dirname, '..')],
    startTimeout: 20000,
    connectionRetryCount: 1,
    connectionRetryTimeout: 10000,
    chromeDriverLogPath: path.join(__dirname, 'chrome_log'),
    webdriverLogPath: path.join(__dirname)
});

describe('Cyborg Cloud Welcome Test', function () {
    beforeEach(() => {
      return app.start()
    }, 15000)

    afterEach(() => {
      if(app && app.isRunning()) { 
         return app.stop(); 
      }
   }); 
    
    test('shows an initial window', async () => {
      let count = await app.client.getWindowCount();
      console.log("count: ", count)
      expect(count).toEqual(1)
    });

  });

  
test("Jest properly installed and configured!", ()=>{})

And my package.json:

  "name": "cyborg_cloud_explorer",
  "version": "0.2.7",
  "homepage": "./",
  "author": "Cyborg Inc.",
  "description": "Searchable, end-to-end encrypted cloud storage manager powered by Cyborg Stealth.",
  "main": "build/electron.js",
  "scripts": {
    "start": "electron .",
    "prestart": "npm run build",
    "pack": "electron-builder --dir",
    "dev": "concurrently \"npm run start-browser\" \"wait-on http://localhost:3000 && electron .\"",
    "start-browser": "react-scripts start",
    "eject": "react-scripts eject",
    "ebuild": "npm run build && /node_modules/.bin/build",
    "build": "react-scripts build",
    "dist": "electron-builder",
    "test": "jest __tests__/ --coverage",
    "marge": "marge report.json",
    "electron-dev": "concurrently \"BROWSER=none npm start\" \"wait-on http://localhost:3000 && electron .\"",
    "electron-pack": "build --em.main=build/electron.js",
    "preelectron-pack": "npm run build"
  },
  "dependencies": {
    "@babel/plugin-proposal-decorators": "^7.12.1",
    "@material-ui/core": "^4.12.3",
    "aws4": "^1.11.0",
    "axios": "^0.21.1",
    "babel-plugin-syntax-dynamic-import": "^6.18.0",
    "babel-preset-env": "^1.7.0",
    "base32": "0.0.6",
    "convert-csv-to-json": "^1.3.1",
    "convert-excel-to-json": "^1.7.0",
    "core-js": "^3.17.2",
    "dotenv": "^10.0.0",
    "ffi-napi": "^3.0.1",
    "franc-min": "^5.0.0",
    "hyperquest": "^2.1.3",
    "jssha": "^3.2.0",
    "keytar": "^6.0.1",
    "mammoth": "^1.4.17",
    "mochawesome-report-generator": "^5.1.0",
    "ndjson": "^2.0.0",
    "nibbler": "^0.2.0",
    "node-addon-api": "^3.1.0",
    "node-html-parser": "^3.3.6",
    "node-machine-id": "^1.1.12",
    "node-tika": "0.0.1",
    "react-beautiful-dnd": "^13.1.0",
    "react-file-icon": "^1.0.0",
    "react-hotkeys-hook": "^3.4.0",
    "react-scripts": "^4.0.3",
    "ref-napi": "^2.1.2",
    "ref-struct-napi": "^1.1.1",
    "version": "^0.1.2",
    "xml2js": "^0.4.23"
  },
  "devDependencies": {
    "@babel/cli": "^7.15.4",
    "@babel/core": "^7.1.0",
    "@babel/plugin-proposal-class-properties": "^7.1.0",
    "@babel/plugin-transform-object-assign": "^7.1.0",
    "@babel/plugin-transform-runtime": "^7.1.0",
    "@babel/preset-env": "^7.1.0",
    "@babel/preset-react": "^7.1.0",
    "babel-core": "^7.0.0-bridge.0",
    "babel-jest": "^26.6.3",
    "babel-loader": "^8.1.0",
    "babel-plugin-transform-class-properties": "^6.24.1",
    "babel-plugin-transform-decorators-legacy": "^1.3.5",
    "babel-preset-react": "^6.24.1",
    "chai": "^4.2.0",
    "chai-as-promised": "^7.1.1",
    "concurrently": "^6.0.2",
    "dotenv": "^10.0.0",
    "electron": "^9.0.0",
    "electron-builder": "^22.9.1",
    "electron-builder-squirrel-windows": "^22.10.4",
    "electron-chromedriver": "^11.0.0",
    "eslint": "^7.17.0",
    "jest": "^26.6.0",
    "mocha": "^8.2.1",
    "mochawesome": "^6.2.1",
    "node-key-sender": "^1.0.11",
    "react": "^16.2.0",
    "react-dom": "^16.2.0",
    "react-redux": "^7.2.4",
    "react-router-dom": "^5.2.0",
    "regenerator-runtime": "^0.13.9",
    "selenium-webdriver": "^4.0.0-beta.1",
    "spectron": "^11.0.0",
    "spectron-keys": "0.0.1",
    "wait-on": "^5.3.0"
  },
  "build": {
    "productName": "Cyborg Cloud Explorer",
    "artifactName": "CloudExplorer",
    "compression": "normal",
    "forceCodeSigning": false,
    "copyright": "Copyright 2020 Cyborg Inc., all rights reserved.",
    "asarUnpack": [
      "assets/cyborg_cloud_engine/linux/x64/cyborg_cloud_engine.so"
    ],
    "extraResources": [
      "assets/vs_redist/*"
    ],
    "files": [
      "src/assets/fonts/**/*",
      "src/assets/media",
      "src/assets/dictionaries",
      "src/assets/cyborg_cloud_engine",
      "src/pages/**/*",
      "src/*",
      "build/**/*"
    ],
    "directories": {
      "buildResources": "assets"
    },
    "win": {
      "target": "squirrel",
      "icon": "src/assets/media/cyborg.ico"
    },
    "linux": {
      "target": "AppImage",
      "icon": "./assets/media/256x256.png",
      "executableName": "CloudExplorer",
      "category": "Network",
      "appId": "Cyborg.Cloud.Explorer"
    },
    "mac": {
      "target": "dmg",
      "icon": "./assets/media/cyborg.icns",
      "appId": "com.cloud.explorer",
      "category": "public.app-category.business"
    },
    "squirrelWindows": {
      "iconUrl": "https://cyborg-cloud-explorer-assets.s3.amazonaws.com/cyborg.ico",
      "loadingGif": "src/assets/media/installing_cyborg_cloud.gif"
    }
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

and my babel.config.json file:

  "presets": [
    "@babel/preset-env",
    "@babel/preset-react"
  ],
  "plugins": [
    ["@babel/plugin-proposal-decorators", { "legacy": true }],
    ["@babel/plugin-proposal-class-properties", { "loose": true }],
    ["@babel/plugin-proposal-private-property-in-object", { "loose": true }],
    ["@babel/plugin-proposal-private-methods", { "loose": true }]
  ]
}

Solution

  • I came across this Spectron tutorial on YouTube: https://www.youtube.com/watch?v=srBKdQT51UQ

    It was published in September 2020 (almost a year ago as of the time of this post) and they suggested downgrading to electron 8.0.0 and Spectron 10.0.0. When I downgraded, the app magically launched when app.start was called.