Input composition is canceled with ESC, but modal closes unexpectedly during IME composition

Author: thashimoto123Created Dec 5, 2025Updated Jun 27, 2026

Describe the bug

When using an inside a react-modal, pressing the Escape key during IME text composition (e.g., Japanese, Chinese) closes the modal. The expected behavior is that the composition should be canceled, not that the modal itself closes.

To Reproduce

  1. Open a modal created with react-modal.
  2. Focus an element inside the modal.
  3. Start typing using an IME (e.g., Japanese).
  4. While still in composition mode, press the Escape key.
  5. The modal closes unexpectedly.

Expected behavior

  • Pressing Escape during IME composition should cancel the composition only.
  • The modal should remain open.
  • This matches typical browser behavior and common UX expectations.

Actual behavior

  • The modal interprets the Escape key as a request to close and dismisses the modal even though the input is in composition mode.

Demo

1. Actual behavior (react-modal)

The modal closes when pressing Escape during IME composition.

Image

2. Expected behavior (native <dialog>)

Image

Environment

  • react-modal version: 3.16.3
  • React version: 18.3.1
  • Browser: Chrome
  • OS: macOS