Electron Does Not Listen Keydown Event

I am a backend developer who got a little project to fix it. So my boss gives me an electron project which runs on touch devices. I know that I can listen any key events in Javascr

Solution 1:

There is a known issue in Electron ( which has lately been marked as wontfix ) that prevents the usual approach to catch key events using the traditional JS approach.

There also is a small library called electron-localshortcut that circumvents this issue by hijacking the Electron global shortcuts API when the window is active.

Use like this in your main.js:

const electronLocalshortcut = require('electron-localshortcut');
electronLocalshortcut.register(mainWindow, 'F12', () => {
    // Open DevTools
});

Solution 2:

You can use the library mousetrap to add global short cut, because it can be installed through node and could bypass the problem of electron mentioned in the accepted answer.

A code example in the render process would be:

var Mousetrap = require('mousetrap');
Mousetrap.bind('4', function() { console.log('4'); });

Solution 3:

Without additional libraries you can use "globalShortcut" of electron

const { app, BrowserWindow, globalShortcut } = require("electron");
globalShortcut.register("CmdOrCtrl+F12", () => {
  mainWindow.isFocused() && mainWindow.webContents.toggleDevTools();
});

I think F12 is preserved so I use ctrl+f12 which is not far off