use the same key in both render and main process electron?

Question

I am recently learning electron I have encountered a problem that I want to listen ESC in both process,

In Main process,

menu.append(new MenuItem({
    label: "Hide on Escape",
    visible: false,
    accelerator: "Escape",
    click: (item, window, event) => {
      if (window.isVisible()) {
        window.hide();
      }
    }
}))

In Render Process,

// on Key press Handler
const onKeyDownHandler = (event: React.KeyboardEvent) => {
    if (isContentEditable && event.key === "Enter") {
      applyContentEditable();
    } else if (event.key === "Enter") {
      onSelected && onSelected(pair);
    } else if (event.key === "Delete") {
      onDelete && onDelete(pair);
    } else if (event.key === "F2") {
      setIsContentEditable(true);
    } else if (event.key === "Escape") {
      resetContentEditable(); // Stop Renaming and get back to default
    }
}

But this didn't work the window hides before the render process. How can I Stop hide when it is listened by Render Process

Answer 1

There is an event.stopPropagation() method which prevents further propagation/calls on the same event Docs

And there is event.preventDefault() which can be used to stop default handling Docs

I still don't quite fully understand your setup and what you are try to achieve.
Another solution is to stop listening on the escape key in the main process at all. Only listen in the render process and then pass the event manually to the main process in case you want to take some action there as well (or the other way around, depending on what makes more sense for you).
For this passing you are probably looking at the electron ipcMain module https://www.electronjs.org/docs/latest/api/ipc-main