eufemia icon indicating copy to clipboard operation
eufemia copied to clipboard

Autocomplete: Focus issues with the Autocomplete component (when data is empty)

Open kimroen opened this issue 11 months ago • 1 comments

🐛 Bug Report

In some scenarios such as the one described below, the Autocomplete component does not allow moving focus away from it through normal means (like clicking outside of it, clicking a different element, or tabbing with the keyboard).

This causes some unexpected behavior as you can see in this GIF:

CleanShot 2024-03-19 at 15 24 10

The second autocomplete has this bug, the first one does not.

Interestingly, the top item does open its drawer when being clicked, but the second input still also has the focus state and styling.

To Reproduce

One way of reproducing this behavior is to set open_on_focus and have an empty data property. Here's a CodeSandbox recreating this.

Both these inputs have open_on_focus: the top one has some data and behaves as expected, but the bottom one will not allow moving focus elsewhere using the mouse.

Expected behavior

The autocomplete component should allow navigating away by any normal input method.

Eufemia Version

10.22.0

kimroen avatar Mar 26 '24 10:03 kimroen