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

Only activate the Tab on mouseup #1192

Merged
merged 1 commit into from
Mar 4, 2022
Merged

Only activate the Tab on mouseup #1192

merged 1 commit into from
Mar 4, 2022

Conversation

RobinMalfait
Copy link
Collaborator

This PR will fix when the Tab gets activated. We want it to get activated when you focus it via the keyboard and when you click it. But we also want the click to be completed (mouseup) before activating.
But by default on a button, the focus event gets fired before the click event. This means that the Tab gets activated to early.

This doesn't happen on Safari, but it does happen on Chrome and other browsers.
This PR will fix that behaviour, and only enable it if the click is complete (mouseup).

Fixes: #845

@vercel
Copy link

vercel bot commented Mar 4, 2022

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployments, click below or on the icon next to each commit.

headlessui-react – ./packages/playground-react

🔍 Inspect: https://vercel.com/tailwindlabs/headlessui-react/8EtQ3QjzJFaWJanbGR4ksYjnkeWs
✅ Preview: https://headlessui-react-git-fix-tabs-trigger-tailwindlabs.vercel.app

headlessui-vue – ./packages/playground-vue

🔍 Inspect: https://vercel.com/tailwindlabs/headlessui-vue/CDEu4xp6TxFwLhiXVMxJojNfNqyx
✅ Preview: https://headlessui-vue-git-fix-tabs-trigger-tailwindlabs.vercel.app

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

Successfully merging this pull request may close these issues.

[Bug]: Tabs component: tab change is triggered on "mousedown" instead of "mouseup"
1 participant