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

fix(Dropdown/Popover): conflict in toggle for touch devices #2272

Merged
merged 2 commits into from
Oct 1, 2024

Conversation

DanielQolami
Copy link
Contributor

@DanielQolami DanielQolami commented Sep 28, 2024

πŸ”— Linked issue

Resolves #2261, resolves #2097, resolves #1823 and resolves #1337

❓ Type of change

  • πŸ“– Documentation (updates to the documentation or readme)
  • 🐞 Bug fix (a non-breaking change that fixes an issue)
  • πŸ‘Œ Enhancement (improving an existing functionality)
  • ✨ New feature (a non-breaking change that adds functionality)
  • 🧹 Chore (updates to the build process or auxiliary tools and libraries)
  • ⚠️ Breaking change (fix or feature that would cause existing functionality to change)

πŸ“š Description

In the UDropdown & UPopover components, when you are in a touch device, clicking on the trigger button, doesn't do anything. because the "click" event & "touchstart" event conflict with each other.
so I add a gaurd in "onTouchStart" function to do a check if "props.mode === 'click'", return from the function.

πŸ“ Checklist

  • I have linked an issue or discussion.
  • I have updated the documentation accordingly.

- when on a touch device, the "onTouchStart" function opens the DropDown AND also, the "click" handler tries toggling the DropDown, so it closes the Dropdown
- when on a touch device, the "onTouchStart" function opens the Popover AND also, the "click" handler tries toggling the Popover, so it closes the Popover
@benjamincanac
Copy link
Member

benjamincanac commented Sep 30, 2024

@DanielQolami Is this also supposed to fix #2097, #1823 and #1337?

@benjamincanac benjamincanac changed the title fix(UDropdown): conflict in toggle for touch devices in UDropdown & UPopover fix(Dropdown/Popover): conflict in toggle for touch devices Sep 30, 2024
@DanielQolami
Copy link
Contributor Author

DanielQolami commented Sep 30, 2024

@DanielQolami Is this also supposed to fix #2097, #1823 and #1337?

Yes. It supports the fix on all three issues.

I read those issues and tried their "reproduction"s. as they all say in their comments, it doesn't works on touch devices when they click on the "trigger" button, but if they hold their finger on the "trigger" button and drag their finger to aside, only "onTouchStart" would be triggered and the dropdown/popover visibility would be toggled. This pull request will fix that.

@benjamincanac benjamincanac merged commit 4ae9654 into nuxt:dev Oct 1, 2024
2 checks passed
@benjamincanac
Copy link
Member

Thank you! 😊

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment