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: Prevent Dropdown Flickering on 'mousedown' rootCloseEvent #6714

Merged
merged 3 commits into from Oct 29, 2023

Conversation

mvaibhav77
Copy link
Contributor

@mvaibhav77 mvaibhav77 commented Oct 23, 2023

Issue
Closes #6712 and #3196

Description

This pull request addresses the issue reported in #6712. When a dropdown is open with rootCloseEvent set to 'mousedown,' it currently exhibits flickering behavior when the toggle button is clicked. This issue arises due to the combination of hiding and showing the dropdown within the same click event.

Changes Made

To resolve this issue, I've made the following changes:
Modified the handleToggle function to skip execution when the dropdown is open, and rootCloseEvent is set to 'mousedown,' and the toggle button is clicked. This change prevents the flickering behavior by allowing the dropdown to remain open in this specific scenario.

Result

React-Bootstrap.Dropdown.menu.flickering.issue.mp4

Additional Information

This change is made in response to the issue reported by @Fyers. We believe this modification improves the behavior of the dropdown component when rootCloseEvent is set to 'mousedown.'

I kindly request a review from the maintainers and the community to consider including this fix in the React Bootstrap project.

@mvaibhav77
Copy link
Contributor Author

Hi @kyletsang, could you kindly review my pull request (PR) when you have a moment?

@kyletsang
Copy link
Member

Could you add a test for this?

@mvaibhav77
Copy link
Contributor Author

Could you add a test for this?

Hey @kyletsang, added a test for the same.

@mvaibhav77
Copy link
Contributor Author

@kyletsang, Can you review the PR once more? I would like to get this PR merged before Hacktoberfest ends.

@kyletsang kyletsang merged commit a58a0cd into react-bootstrap:master Oct 29, 2023
10 of 12 checks passed
@kyletsang
Copy link
Member

Thanks

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.

Dropdown.Toggle does not work correctly when using mousedown as rootCloseEvent
2 participants