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

bug: LdSelect with filter doesn't always get focus #813

Closed
3 tasks done
dpitois opened this issue Jul 10, 2023 · 1 comment · Fixed by #814
Closed
3 tasks done

bug: LdSelect with filter doesn't always get focus #813

dpitois opened this issue Jul 10, 2023 · 1 comment · Fixed by #814
Labels
bug An issue describing unexpected or malicious behaviour. confirmed This label indicates that the issue has been reproduced and verified by the core team. released

Comments

@dpitois
Copy link

dpitois commented Jul 10, 2023

Prerequisites

Liquid version

5.5.0

Framework bindings

React

Current behavior

Sometime, the focus is not done, and the bug can be observed when user clicks quickly on the LdSelect.

Expected behavior

The focus should always be done.

Steps to reproduce

Available sandbox on CodeSandbox

  1. Click on the 1st LdSelect of the form
  2. Click with different speeds
  3. Focus may be done, or not
    a. Most of the time it is OK when <ClickLogger /> has a duration above 50ms
    b. Maybe the focus is missing when the component displays a duration between 30 and 40ms

Note: the durations above are not accurate, sometime it works when being in the 30-40ms range, and sometime it does not work when above (like 130ms for example).

Code reproduction URL

https://codesandbox.io/p/github/dpitois/liquid-select-focus-bug/main?file=/README.md:1,1&workspaceId=bd142dc9-6e08-409c-9537-d407ff1d0ee3

Additional information

The provided repo and sandbox help to reproduce the bug based on the click duration, but in our implementation based on Custom Element and a React wrapped creating these elements, the bug is more easily reproduced.
Because it is an internal project, it can not be shared in public, but if needed, we can try to get in touch with Merck internal tools like Teams to show the bug.

@dpitois dpitois added bug An issue describing unexpected or malicious behaviour. triage An issue that needs assessment to determine its validity and urgency labels Jul 10, 2023
@borisdiakur borisdiakur added confirmed This label indicates that the issue has been reproduced and verified by the core team. and removed triage An issue that needs assessment to determine its validity and urgency labels Jul 10, 2023
borisdiakur added a commit that referenced this issue Jul 10, 2023
Background: It looks like the Tether enable method returns before the actual popper element is visible. So we need to "wait" for it to become visible before setting the focus on the filter input element.

Fixes #813
borisdiakur added a commit that referenced this issue Jul 11, 2023
Background: It looks like the Tether enable method returns before the actual popper element is visible. So we need to "wait" for it to become visible before setting the focus on the filter input element.

Fixes #813
github-actions bot pushed a commit that referenced this issue Jul 11, 2023
## [5.6.4](v5.6.3...v5.6.4) (2023-07-11)

### Bug Fixes

* **ld-select:** wait for popper to be visible before focusing filter ([ce8419d](ce8419d)), closes [#813](#813)
@borisdiakur
Copy link
Contributor

🎉 This issue has been resolved in version 5.6.4 🎉

The release is available on:

📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug An issue describing unexpected or malicious behaviour. confirmed This label indicates that the issue has been reproduced and verified by the core team. released
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants