search

codemirror / dev

Development repository for the CodeMirror editor project
https://codemirror.net/
Other
5.96k stars 377 forks source link

Editor does not properly lose focus, causing other input fields in the browser to become unusable #1414

Closed wangfulong closed 4 months ago

wangfulong commented 4 months ago

Describe the issue

image

When pressing Esc to close a dialog, if the editor is focused, all external input fields become uneditable

Steps to Reproduce:

  1. Create a page with a CodeMirror editor and some other input fields.
  2. Focus on the CodeMirror editor.
  3. Press the Esc key to close the Dialog containing the editor.
  4. Attempt to focus on and type in other input fields.

I fixed this problem using the following method.

image

However, with the same focus issue in Next.js, when I focus on the editor and directly click the button to trigger router.push, the input fields on the redirected page also become uneditable.

So I had to switch to using the Next.js Link component, which allows the editor to lose focus properly when clicked.

Browser and platform

No response

Reproduction link

No response

Pearce-Ropion commented 4 months ago

We are seeing this issue any time the input is defocused or unmounted through any means other than pressing enter to complete the transaction.

marijnh commented 4 months ago

This is a Chrome bug. It should be fixed in version 128. You may be able to work around it by removing focus from the editor before removing it from the DOM.

Pearce-Ropion commented 4 months ago

~This issue is not fixed with the latest version of chrome.~

Edit. nvm, the latest version is v126