Skip to content

Commit 3857e07

Browse files
committed
docs: add React troubleshooting guide
1 parent af1d4ec commit 3857e07

2 files changed

Lines changed: 63 additions & 0 deletions

File tree

docs/config.json

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -60,6 +60,10 @@
6060
{
6161
"label": "Formatting & Display",
6262
"to": "framework/react/guides/formatting-display"
63+
},
64+
{
65+
"label": "Troubleshooting",
66+
"to": "framework/react/guides/troubleshooting"
6367
}
6468
]
6569
}
Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
---
2+
title: Troubleshooting
3+
id: troubleshooting
4+
---
5+
6+
# Troubleshooting
7+
8+
This page collects the most common reasons hotkeys don’t fire (or fire unexpectedly) and how to fix them.
9+
10+
## My hotkey doesn’t fire while typing in an input/textarea
11+
12+
By default, TanStack Hotkeys **ignores** keyboard events that originate from common text input elements (for example `input`, `textarea`, and contenteditable regions). This prevents hotkeys from breaking normal typing.
13+
14+
**Fix options:**
15+
16+
- Bind the hotkey to a more specific target (for example a focused panel) instead of `document`.
17+
- Use a dedicated UI (like a command palette) that intentionally captures key events.
18+
19+
## My hotkey fires even when focus is inside an input
20+
21+
If a hotkey is firing while the user is typing, it usually means the event is being listened to on a target that’s too broad (or you’re bypassing the default input filtering).
22+
23+
**Fix:**
24+
25+
- Make sure you’re using the default input filtering behavior.
26+
- Prefer scoping hotkeys to a container (panel/dialog) that must be focused.
27+
28+
## The same hotkey fires twice
29+
30+
Common causes:
31+
32+
- In React development (especially with Strict Mode), effects and subscriptions can run more than once, which can expose missing cleanup or double-registration.
33+
- You accidentally registered the same hotkey in multiple components.
34+
35+
**Fix:**
36+
37+
- Ensure hotkeys are registered in exactly one place.
38+
- If you need per-route registration, clean up registrations on unmount.
39+
40+
## Hotkeys behave differently on macOS vs Windows/Linux
41+
42+
Use `Mod` when you mean “Cmd on macOS, Ctrl elsewhere”.
43+
44+
Examples:
45+
46+
- `Mod+K` (Cmd+K on macOS, Ctrl+K on Windows/Linux)
47+
- `Mod+Shift+P`
48+
49+
## My hotkey uses a symbol key and doesn’t match `event.key`
50+
51+
Some keyboard layouts can produce characters where `event.key` isn’t the physical key you expect (for example when using Option/Alt combinations).
52+
53+
**Tip:** Prefer the library helpers that normalize key names and hotkey strings instead of comparing raw `event.key` yourself.
54+
55+
## Still stuck?
56+
57+
If you can share a minimal reproduction, discussions are the fastest way to get help:
58+
59+
- https://github.com/tanstack/hotkeys/discussions

0 commit comments

Comments
 (0)