Did you import the service hook scripts into your application via e.g. import('wdio-electron-service/main') and import('wdio-electron-service/preload')?

[aaronculp-droneup]

I'm having this error when running "npm run wdio" --

javascript error: javascript error: Electron context bridge not available! Did you import the service hook scripts into your application via e.g. import('wdio-electron-service/main') and import('wdio-electron-service/preload')?

package.json
{ "name": "dbx-ui", "productName": "DBX UI Platform", "version": "1.0.0", "description": "DBX UI Built with Electron / React / Vite", "main": "./dist/main/index.js", "author": "example.com", "homepage": "https://www.electronjs.org", "scripts": { "format": "prettier --write .", "lint": "eslint . --ext .js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix", "start": "electron-forge start", "dev": "electron-vite dev --outDir=dist", "package": "electron-vite build --outDir=dist && NODE_ENV=test electron-forge package", "make": "electron-vite build --outDir=dist && electron-forge make", "build": "electron-vite build --outDir=dist", "wdio": "NODE_ENV=test wdio run wdio.conf.js --watch" }, "dependencies": { "@electron-toolkit/preload": "^2.0.0", "@electron-toolkit/utils": "^2.0.0", "axios": "^1.6.2", "electron-squirrel-startup": "^1.0.0", "express": "^4.18.2", "framer-motion": "^10.16.16", "react-router-dom": "^6.21.1", "styled-components": "^6.1.3", "wdio-electron-service": "^6.0.2" }, "devDependencies": { "@electron-forge/cli": "^7.2.0", "@electron-forge/maker-deb": "^7.2.0", "@electron-forge/maker-rpm": "^7.2.0", "@electron-forge/maker-squirrel": "^7.2.0", "@electron-forge/maker-zip": "^7.2.0", "@electron-forge/plugin-auto-unpack-natives": "^7.2.0", "@electron-toolkit/eslint-config": "^1.0.1", "@electron-toolkit/eslint-config-prettier": "^1.0.1", "@vitejs/plugin-react": "^4.0.4", "@wdio/cli": "^8.27.1", "@wdio/cucumber-framework": "^8.27.1", "@wdio/local-runner": "^8.27.0", "@wdio/mocha-framework": "^8.27.0", "@wdio/spec-reporter": "^8.27.0", "electron": "^28.1.1", "electron-chromedriver": "^28.1.2", "electron-vite": "^1.0.27", "eslint": "^8.47.0", "eslint-plugin-react": "^7.33.2", "prettier": "^3.0.2", "react": "^18.2.0", "react-dom": "^18.2.0", "vite": "^4.4.9" } }

test/specs/test.e2e.js

`
describe('Electron Testing', () => {
it('should print application title', async () => {
const logs = await browser.electron.execute(
(electron) => electron.app.getPath({ sessionData }),
);

      console.log("logs", logs)
      console.log('Hello', await browser.getTitle(), 'application!')
      await browser.pause(5000)
  })

})
`

I've also added inside main / preload as well...

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

if (isTest) require('wdio-electron-service/preload')`

Looking to understand this issue and what needs to change for this to be solved! When I comment out
`
const logs = await browser.electron.execute(
(electron) => electron.app.getPath({ sessionData }),
);

    console.log("logs", logs)

`

from my test file it works... I'm new to testing but I'm trying to achieve getting the sessionData from electron.app.getPath.. I'm actually trying to set a variable to localStorage so my app will run ...

window.localStorage.setItem('internetConnection', true)

App is hidden by this variable inside app.js.. making a variable to ensure we are connected to the internet, if not I show a

trying to reconnect..

So trying to replicate a localStorage variable in my test so I can get into the app... Plz help! <3

[christian-bromann]

I've also added inside main / preload as well...

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

Make sure you compile your Electron application with the right NODE_ENV set so that the import is actually part of the bundled and tested app.

[aaronculp-droneup]

do i need to add it to

NODE_ENV=test npm run wdio

as well?

[christian-bromann]

I wouldn't hurt, also see https://youtu.be/mAqxh3L_sP4?si=h505lTiYt5ItiJ34&t=863

[aaronculp-droneup]

Still getting that error...

I've also noticed I'm not importing in the test file....

test/specs/test.e2e.js --
trying to run import below gives error

import { browser } from '@wdio/globals'

Error:

[0-0] RUNNING in chrome - file:///test/specs/test.e2e.js
[0-0] Error: Unable to load spec files quite likely because they rely on browser object that is not fully initialized.
browser object has only capabilities and some flags like isMobile.
Helper files that use other browser commands have to be moved to before hook.
Spec file(s): file:///Users/aaron.culp/Desktop/repos/groundinfrasvc-ui/test/specs/test.e2e.js
Error: /Users/aaron.culp/Desktop/repos/groundinfrasvc-ui/test/specs/test.e2e.js:2
import { browser } from '@wdio/globals'
^^^^^^

SyntaxError: Cannot use import statement outside a module

^^ i am NOT using typescript

[christian-bromann]

Seems like an ESM/CJS confusion. Make sure you use the right import mechanism for the type of modules you run. Maybe this boilerplate can help: https://github.com/webdriverio/electron-boilerplate

[aaronculp-droneup]

I think i fixed it by "require('wdio-electron-service')" in the test.2e.js file