Cannot read property on of undefined. Electron BrowserWindow object

Question

I am trying to learn Electron, but am running into an issue with the Pluralsight tutorial I am using. I installed the 'electron-prebuilt' module. I get an error everytime I run "npm start". The window opens as expected, but the error message that pops up in a dialog box kind of ruins the whole thing. Here is the error:

Uncaught Exception: TypeError: Cannot read property 'on' of undefined at Object.

There's more to the long error message but it won't let me copy and paste, and the rest of the error just refers to the location of the supposed problem on line 14 of my main.js code. Here is my main.js file:

const electron = require('electron')
const app = electron.app
const BrowserWindow = electron.BrowserWindow

let mainWindow

app.on('ready', _ => {
  mainWindow = new BrowserWindow({
      height: 400,
      width: 400
  })
})

mainWindow.on('closed', _ => {
    console.log('closed')
    mainWindow = null
})

It's indicating that the BrowserWindow object I created doesn't have an "on" method, but I know this to be false per the Electron documentation:

https://electronjs.org/docs/api/browser-window

So I'm thinking that the value of mainWindow just isn't being set. I could try instantiating mainWindow with a new BrowserWindow object at the time I declare it, but I get an error message if I try that indicating that I can only instantiate BrowserWindow objects in ready functions.

0.sh 0.sh · Accepted Answer · 2018-02-19T04:25:26

you have to understand how callbacks work in node.js, callbacks are executed asynchronously, before app.onready fires, mainWindow is still undefined hence the declaration of let mainWindow assigns undefined to mainWindow, take mainWindow.on("closed", ....) into the app.on("ready") event handler. Do this

const electron = require('electron')
const app = electron.app
const BrowserWindow = electron.BrowserWindow

let mainWindow

app.on('ready', _ => {
  mainWindow = new BrowserWindow({
      height: 400,
      width: 400
  })
  mainWindow.on('closed', _ => {
    console.log('closed')
    mainWindow = null
  })
})

Cannot read property on of undefined. Electron BrowserWindow object

2 Answers