electron: [Bug]: Input field becomes unresponsive after window.Alert() and window.confirm()

Preflight Checklist

I have read the Contributing Guidelines for this project.
I agree to follow the Code of Conduct that this project adheres to.
I have searched the issue tracker for a feature request that matches the one I want to file, without success.

Electron Version

16.0.1

What operating system are you using?

Windows

Operating System Version

Windows 10

What arch are you using?

x64

Last Known Working Electron version

No response

Expected Behavior

The input field is clickable and responsive after the user makes a selection from a windows Alert or Confirm.

Actual Behavior

The input field is unclickable. The workaround is to open/close devtools.

Testcase Gist URL

No response

Additional Information

It seems like this is a on-going issue from other users.

https://github.com/electron/electron/issues/22923

https://stackoverflow.com/questions/56805920/cant-edit-input-text-field-after-window-alert/56806101#56806101

I’m able to reproduce this issue consistently from windows electron app

I was able to reproduce this issue from electron-quick-start repo with the latest electron build 16.0.1 using the following index.html code below

<!DOCTYPE html>
<!--Display Alert Message on Button Click Event.-->
<html>
    <head>
        <title>Display Alert Message on Button Click Event.</title>
        <script type="text/javascript">
            function showMessage() {
                alert("Hello friends, this is message.");
            }
        </script>
    </head>
    <body>
            <h1>Display Alert Message on Button Click Event.</h1>
            <b>Click on button to display message: </b><br />
            <br />
            <input type="button" id="btnShowMsg" value="Click Me!" onClick="showMessage()" />
            <input type="text"/>
    </body>
</html>

About this issue

Original URL
State: open
Created 3 years ago
Reactions: 4
Comments: 32 (2 by maintainers)

Most upvoted comments

Same issue in Electron 17.1.0.

I have found a temporary workaround to get the focus back by sending an event from the renderer proces to the main process, where it triggers the focus out and in. I haven’t managed to do this right from the renderer process, so If someone has a simpler recipe, please share.

Main process:

ipcMain.on('focus-fix', () => {
    win.blur();
    win.focus();
});

…where win is an instance of BrowserWindow.

Renderer (browser) process: ipcRenderer.send('focus-fix');

Actual code example of using this in renderer process:

if (confirm('Please confirm some action...')) {
   // Some code here for OK action
   ipcRenderer.send('focus-fix');
}
else {
   // Some code here for Cancel action
   ipcRenderer.send('focus-fix');
}

As you can see I am using ipcRenderer.send('focus-fix'); in every place where I want to trigger the focus. This piece of code can also be wrapped into a function.

existical on Mar 7, 2022

Same issue in 20.1.3

OtavioSDev on Sep 14, 2022

same issue. electron 16.0.1, windows 11 64 bits.

switching to another app and then coming back to the electron app makes it responsive again, but it’s only a temprary fix.

ItsYanko on Nov 23, 2021

Same issue with 29.1.0. But now I’m using IPC to invoke dialog.showMessageBox(), instead of call window.alert() directly.

LsYueh on Apr 12, 2024

The only solution I have found is either stop using alert() in your code entirely, or make your own custom alert notifications.

Mogeiman on Apr 4, 2023

still a problem in the version of electron I downloaded yesterday. (latest stable version)

tjwrona on Feb 5, 2023

bump

keerthi16 on Jan 10, 2023