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 close on expand in Firefox #231

Merged
merged 3 commits into from Apr 3, 2019
Merged

Conversation

ellinge
Copy link
Collaborator

@ellinge ellinge commented Apr 1, 2019

What does it do?

Prevents event bubbling on node expand-click. The function isOutsideClick only gets a short part of two items (li.node + i.expand), then the parents stop, in Firefox. This causes it to be detected as an outside click.

In chrome the path is instead empty and no outside click is therefore detected.

Fixes #198

Can test here (switching between v1.17/developTemp):
Expand the first two nodes:
bild
Scroll to bottom and expand:
bild

https://ellinge.github.io/react-dropdown-tree-select-test/#v117-nocheckeddefault
https://ellinge.github.io/react-dropdown-tree-select-test/#DevelopTemp-nocheckeddefault

There still seems to be some issue with scroll in firefox after initial scroll and expand which does not happen in chrome. The expanded item gets out of view. This also happens on scoll and check.

Type of change

  • Bug fix

@coveralls
Copy link

coveralls commented Apr 2, 2019

Pull Request Test Coverage Report for Build 974

  • 2 of 2 (100.0%) changed or added relevant lines in 1 file are covered.
  • No unchanged relevant lines lost coverage.
  • Overall coverage increased (+0.02%) to 94.862%

Totals Coverage Status
Change from base Build 967: 0.02%
Covered Lines: 325
Relevant Lines: 335

💛 - Coveralls

@codeclimate
Copy link

codeclimate bot commented Apr 2, 2019

Code Climate has analyzed commit 0c58269 and detected 0 issues on this pull request.

View more on Code Climate.

Copy link
Collaborator

@mrchief mrchief left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍

@mrchief mrchief merged commit 7439328 into develop Apr 3, 2019
@mrchief mrchief deleted the fix/#198 branch April 3, 2019 03:12
mrchief pushed a commit that referenced this pull request Apr 18, 2019
## What does it do?

Prevents event bubbling on node expand-click. The function isOutsideClick only gets a short part of two items (li.node + i.expand), then the parents stop, in Firefox. This causes it to be detected as an outside click.

In chrome the path is instead empty and no outside click is therefore detected.

Fixes #198 

Can test here (switching between v1.17/developTemp):
Expand the first two nodes:
![bild](https://user-images.githubusercontent.com/17863113/55436725-5bce8b80-559d-11e9-927d-17149643100c.png)
Scroll to bottom and expand:
![bild](https://user-images.githubusercontent.com/17863113/55436759-6c7f0180-559d-11e9-8bd9-7ad141b5c9ca.png)

https://ellinge.github.io/react-dropdown-tree-select-test/#v117-nocheckeddefault
https://ellinge.github.io/react-dropdown-tree-select-test/#DevelopTemp-nocheckeddefault

There still seems to be some issue with scroll in firefox after initial scroll and expand which does not happen in chrome. The expanded item gets out of view. This also happens on scoll and check.

## Type of change

- [x] Bug fix
@mrchief
Copy link
Collaborator

mrchief commented Jun 10, 2019

🎉 This PR is included in version 2.0.0 🎉

The release is available on:

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Dropdown closes when opening parent ( in long list)
3 participants