Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Toggle] keyboard interactions don't dispatch change event #1611

Open
Tracked by #1621
theetrain opened this issue Jan 2, 2023 · 0 comments
Open
Tracked by #1621

[Toggle] keyboard interactions don't dispatch change event #1611

theetrain opened this issue Jan 2, 2023 · 0 comments
Milestone

Comments

@theetrain
Copy link
Collaborator

Issue

e.preventDefault() is called during a keyup event:

on:keyup="{(e) => {
if (e.key === ' ' || e.key === 'Enter') {
e.preventDefault();
toggled = !toggled;
}
}}"

This prevents the change event from dispatching that otherwise should. Is this intentional?

Reproduction

Demo: https://stackblitz.com/edit/sveltejs-kit-template-default-ewqjmk?file=src%2Froutes%2F%2Bpage.svelte (inspired by #1609)

  • clicking on the toggle will call the on:change handler
  • using the ENTER or SPACE keys will not call the on:change handler

Proposal

I think it would be fair to forward on:keydown without handling it. The HTML <input type="checkbox"> will fire change on click and SPACE, not ENTER.

@theetrain theetrain added this to the v1.0.0 milestone Jan 29, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant