javascript error: Cannot convert undefined or null to object in Electron Userland Spectron

Explanation of the problem

The test suite of an Electron application is encountering issues after updating Electron to v10 and Spectron to v12. The issue is preventing the test suite from running. To diagnose the issue, the user created a single test using code from Spectron’s readme and ran it with Jest. The following error was encountered:

javascript error: javascript error: Cannot convert undefined or null to object
      (Session info: chrome=85.0.4183.98)

      at getErrorFromResponseBody (node_modules/webdriver/build/utils.js:121:10)
      at WebDriverRequest._request (node_modules/webdriver/build/request.js:149:56)
      at Browser.wrapCommandFn (node_modules/@wdio/utils/build/shim.js:74:23)
      at Browser.wrapCommandFn (node_modules/@wdio/utils/build/shim.js:74:23)

Although the application window launches, the test is still failing. The user is using Node v14.10.1, Spectron v12.0.0, Electron v10.1.2, and ChromeDriver v85.0.4183.98.

The issue is related to a JavaScript error that is preventing the test suite from running correctly. The error message Cannot convert undefined or null to object is indicating that a null or undefined value was passed to an object where a value was expected. The error is originating from the file node_modules/webdriver/build/utils.js at line 121. The issue appears to be with the WebDriver request and is being caught by the WebDriverRequest._request method in the file node_modules/webdriver/build/request.js at line 149. The error is then being caught by the Browser.wrapCommandFn method in the file node_modules/@wdio/utils/build/shim.js at line 74.

Troubleshooting with the Lightrun Developer Observability Platform

Getting a sense of what’s actually happening inside a live application is a frustrating experience, one that relies mostly on querying and observing whatever logs were written during development.
Lightrun is a Developer Observability Platform, allowing developers to add telemetry to live applications in real-time, on-demand, and right from the IDE.

• Instantly add logs to, set metrics in, and take snapshots of live applications
• Insights delivered straight to your IDE or CLI
• Works where you do: dev, QA, staging, CI/CD, and production

Start for free today

Problem solution for javascript error: Cannot convert undefined or null to object in Electron Userland Spectron

let myObject = { prop1: "value1", prop2: "value2" };

if (myObject) {
  console.log(myObject.prop1); // logs "value1"
}

Other popular problems with Spectron

Problem: Uncaught Exception: Could not find module ‘app’

This error occurs when Spectron is unable to find the ‘app’ module. This can happen when the application under test is not properly packaged or the path to the application is incorrect.

Solution:

To solve this issue, make sure the application is properly packaged and the path to the application is specified correctly in the app property in the Spectron configuration.

Here’s an example:

const { Application } = require('spectron');
const path = require('path');

const app = new Application({
  path: path.join(__dirname, '..', 'node_modules', '.bin', 'electron'),
  args: [path.join(__dirname, '..', 'app')]
});

In this example, the code sets the path to the Electron binary and the application under test using the path module. The path.join() method is used to join the paths together, ensuring that the correct path is specified on any operating system.

Problem: Error: Timed out after 30000ms waiting for the application to launch

This error occurs when Spectron times out waiting for the application to launch. This can happen when the application is taking too long to launch, or if there is an issue with the application that is preventing it from launching.

Solution:

To solve this issue, increase the timeout value in the Spectron configuration.

Here’s an example:

const { Application } = require('spectron');
const path = require('path');

const app = new Application({
  path: path.join(__dirname, '..', 'node_modules', '.bin', 'electron'),
  args: [path.join(__dirname, '..', 'app')],
  startTimeout: 60000
});

In this example, the code sets the startTimeout property to 60000, which increases the timeout value to 60 seconds. This should be sufficient for most applications to launch.

Problem: Uncaught Exception: Could not find a valid WebDriver host

This error occurs when Spectron is unable to find a valid WebDriver host. This can happen when the WebDriver is not properly configured, or if the WebDriver is not running.

Solution:

To solve this issue, make sure the WebDriver is properly configured and running.

Here’s an example:

const { Application } = require('spectron');
const path = require('path');

const app = new Application({
  path: path.join(__dirname, '..', 'node_modules', '.bin', 'electron'),
  args: [path.join(__dirname, '..', 'app')],
  webdriverLogPath: path.join(__dirname, 'webdriver.log')
});

app.start().then(() => {
  console.log('WebDriver host found');
});

A brief introduction to Spectron

Spectron is an open-source testing framework for Electron applications. It allows developers to write automated tests for their Electron applications, making it easier to ensure that the application is working as expected. Spectron is built on top of WebDriver and uses it to interact with the Electron application. This allows developers to test the application’s UI and functionalities, making it a comprehensive testing solution for Electron applications.

Spectron provides a high-level API for interacting with Electron applications. This API abstracts the underlying WebDriver API, making it easier for developers to write tests without having to worry about the underlying details. Spectron also provides a convenient way to launch and manage Electron applications during testing. This makes it easy to start and stop the application, as well as to manage the application’s state during testing. Spectron also provides a way to run tests in parallel, making it possible to significantly speed up the test suite execution time.

Most popular use cases for Spectron

1. Automated UI testing of Electron applications

Spectron can be used to automate the testing of an Electron application’s user interface. This allows developers to verify that the application is displaying the correct UI elements and that they are functioning correctly. This helps to catch any issues with the UI before they become a problem for users.

Here’s an example of using Spectron to test the presence of a button in an Electron application:

const { Application } = require('spectron');
const path = require('path');

const app = new Application({
  path: path.join(__dirname, '..', 'node_modules', '.bin', 'electron'),
  args: [path.join(__dirname, '..', 'app')]
});

app.start().then(() => {
  const button = app.client.element('#button');
  expect(button).to.exist;
});

In this example, the code launches the Electron application and uses the Spectron API to access the WebDriver instance. The code then uses the WebDriver API to find a button with the id of button. The code uses the expect library to verify that the button exists, which confirms that the button is present in the UI.

2. Automated functional testing of Electron applications

Spectron can also be used to automate the testing of an Electron application’s functionality. This allows developers to verify that the application is performing the correct actions and producing the correct results. This helps to catch any issues with the functionality before they become a problem for users.

Here’s an example of using Spectron to test the functionality of a button in an Electron application:

const { Application } = require('spectron');
const path = require('path');

const app = new Application({
  path: path.join(__dirname, '..', 'node_modules', '.bin', 'electron'),
  args: [path.join(__dirname, '..', 'app')]
});

app.start().then(() => {
  const button = app.client.element('#button');
  button.click();
  const result = app.client.element('#result');
  expect(result).to.exist;
});

In this example, the code launches the Electron application and uses the Spectron API to access the WebDriver instance. The code then uses the WebDriver API to find a button with the id of button and to click it. The code then finds an element with the id of result and uses the expect library to verify that the result element exists, which confirms that the button is performing the expected action.

3. Debugging Electron applications

Spectron can also be used for debugging Electron applications. This allows developers to run tests to isolate and reproduce issues with the application, making it easier to identify and fix problems. The Spectron API provides a convenient way to access the WebDriver instance, which can be used to interact with the Electron application and inspect its state. This can be useful for examining the application’s behavior, inspecting elements, and accessing the application’s logs. This can be a valuable tool for debugging complex Electron applications and ensuring that they are functioning correctly.