Missing first focus event when focusing window with show: false

index.html

<!-- Empty -->

main.js

const {app, BrowserWindow} = require('electron')
const path = require('path')

function createWindow () {
  const mainWindow = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      nodeIntegration: true,
      preload: path.resolve(__dirname, './preload.js')
    },
    show: false,
  })

  mainWindow.loadURL('https://unixpapa.com/js/testkey.html')
}

app.on('ready', createWindow)

app.on('window-all-closed', function () {
  if (process.platform !== 'darwin') {
    app.quit()
  }
})

app.on('activate', function () {
  const allWindows = BrowserWindow.getAllWindows()
  if (allWindows.length === 0) return
  allWindows[0].show()
  allWindows[0].focus()
})

preload.js

let focusDiv

const focusStyle = `
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 2px solid yellow
`
const blurStyle = `
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 2px solid gray
`

window.addEventListener('DOMContentLoaded', createElement)

function createElement () { 
  focusDiv = document.createElement("div")
  focusDiv.style = blurStyle
  document.body.appendChild(focusDiv)
}

window.addEventListener('focus', () => {
  focusDiv.style = focusStyle
})
window.addEventListener('blur', () => {
  focusDiv.style = blurStyle
})

renderer.js

// This file is required by the index.html file and will
// be executed in the renderer process for that window.
// All of the Node.js APIs are available in this process.

styles.css

/* Empty */