Skip to content

Capture-phase keyboard handler crashes on startsWith, breaking form submissions #268

@slonweiss

Description

@slonweiss

Description

When using react-grab v0.1.29 in a React 19 app, the keyboard capture-phase handler ba crashes with:

Uncaught TypeError: Cannot read properties of undefined (reading 'startsWith')
    at Kn (react-grab.js:1126:56)
    at ba (react-grab.js:2903:19)
    at Z$1.addWindowListener.capture (react-grab.js:2959:10)

The crash occurs in the minified function Kn, called as Kn(Pr(), e.code). One of these values is undefined when .startsWith() is called on it.

Impact

This isn't just a noisy console error — it prevents form submissions from working reliably. We have a sign-in form where users type an email and click "Continue". When typing quickly, the exception during the capture phase interferes with React's event processing, causing the form's submit handler to never fire (no network request is made).

The click capture handler has a data-react-grab-ignore-events escape hatch, but the keyboard handler (ba) does not check for this attribute before calling Kn, so there's no workaround short of deferring the import.

Reproduction

  1. Install react-grab in a React 19 Vite app with a form (e.g., email input + submit button)
  2. Type quickly into the input and immediately click the submit button
  3. Observe the TypeError in console and the form submission not firing

Environment

  • react-grab: 0.1.29
  • React: 19.2.x
  • Vite: 7.x
  • Browser: Chrome (macOS)

Suggested fix

Add a null check in Kn before calling .startsWith(), and/or check data-react-grab-ignore-events in the keyboard handler before processing.

Workaround

Deferring the import so react-grab loads after the app is interactive:

<script type="module">
  if (import.meta.env.DEV) {
    window.addEventListener("DOMContentLoaded", () => {
      setTimeout(() => import("react-grab"), 2000);
    });
  }
</script>

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions