Chrome autocomplete incorrectly triggers actions with keydown events (regardless of KeyboardEvent filters)
Nobody has claimed this yet.
Assessment
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Newbie friendliness
- 42/100
- Issue type
- Bug
- Clarity
- Mostly clear
- Activity status
- Stale
- Tech stack
- typescript
- Domain
- frontend
Research direction
Start with the linked CodePen and reproduce the autocomplete-selection case in Chrome, then trace Stimulus's keydown action and KeyboardEvent-filter handling. Done means autocomplete suggestions no longer invoke filtered keydown actions when Chrome dispatches a non-KeyboardEvent, with the existing reproduction covered by a regression test if the test location is identified.
Written by the indexing model from the issue text.
Description
When using a Stimulus action like:
<button data-action="keydown.meta+k@window->search#open">
In Google Chrome, clicking an input’s autocomplete suggestion unexpectedly triggers the controller action even though no key is pressed.
It seems that Chrome dispatches an Event with type === "keydown", but it is not an instance of KeyboardEvent. This happens regardless of the key filter (and using @window or not).
Reproduction
Use this CodePen: https://codepen.io/matheusrich/pen/xbwOOqm
Steps:
- Click inside the input field and wait for the autocomplete list to appear.
- Pick a suggestion from the autocomplete list.
- ✅ Stimulus incorrectly triggers the action
Workaround
On my controller, I'm using this to prevent this behavior for now
if (event.type == "keydown" && !(event instanceof KeyboardEvent)) return
I'll submit a fix to for this on Stimulus.
Chrome Version 138.0.7204.169 (Official Build) (x86_64)
- Dominant language
- TypeScript
- Stars
- 13.1k
- Forks
- 441
- PR merge metrics
- No merged PRs in 30d
Contributor guide
No contributing guide indexed for this repository
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
More from hotwired/stimulus
-
Difficulty 5/5 Over a week Newbie friendliness 35/100
-
Difficulty 5/5 Over a week Newbie friendliness 35/100
-
Difficulty 5/5 Over a week Newbie friendliness 25/100
-
Difficulty 3/5 1-2 days Newbie friendliness 35/100
-
Difficulty 5/5 Over a week Newbie friendliness 35/100
All issues in hotwired/stimulus
Similar issues
-
clawsweeper:fix-shape-clear clawsweeper:queueable-fix clawsweeper:source-repro impact:ux-friction issue-rating: 🦞 diamond lobster no-stale P3
Difficulty 2/5 1-3 hours Newbie friendliness 78/100
-
community first-timers-only good first issue hacktoberfest help wanted low hanging fruit up-for-grabs
Difficulty 1/5 Under an hour Newbie friendliness 76/100
-
code-quality refactoring
Difficulty 2/5 1-3 hours Newbie friendliness 84/100
github/gh-aw-firewall#8816 ·
-
integration:quickjs org:external priority:backlog topic:code-interpreter topic:middleware type:feature
Difficulty 2/5 1-3 hours Newbie friendliness 74/100
langchain-ai/deepagents#6450 ·
-
Difficulty 1/5 Under an hour Newbie friendliness 88/100
vercel/react-tweet#225 ·