Eui: Form inputs not always receiving focus on mouse click

[peteharverson]

EUI form inputs sometimes are not receiving focus on mouse click.

For example, on opening this flyout in the ML Anomaly Explorer page, clicking on the EuiTextArea is not giving it focus:

Have also seen this happen on inputs inside Kibana Dashboard, such as the inputs in the date picker, and on the Index Patterns page inside Stack Management. The only way to get focus is to use the keyboard to TAB into the input.

Found on Kibana with EUI v26.3.1.

[chandlerprall]

I've replicated in the anomaly explorer page on Kibana master branch. Digging into the cause now.

Specifically: if I view a job in the single metric viewer and then switch to the Anomaly Explorer, the Annotations search box is never focusable. Also of interest: if I tab to that search box so it has focus, I cannot shift focus away from it by clicking on the page body.

Reproducible in Chrome, FF, Safari, and Edge on MacOS

Observerations/Findings

• No observed any calls to HTMLElement.prototype.focus, which may be used prevent the operation
• Added event listeners to document.body for click and mousedown events, both successfully bubble up with the expected target input field - browsers apply focus changes between these two events
• As described, tabbing still works; this does not appear to be related to any focus trapping
• Click on the input's _Clear_ button properly clears the input and focuses on the element, typing works, but cannot click to a non-interactive element (e.g. the page body) to de-select, have to tab out of the element. After this, clicking remains in-operable.
• Sometimes the element will become available again, once it does it remains
• Switching to another tab and immediately back appears to "resolve" the issue (in Chrome at least, in FF it seems I need to resize the window to be able to scroll the element out of view, and that works ~10% of the time.) Seems somewhat viewport related?

[chandlerprall]

@peteharverson I see something happening with the ml-swimlane-selector that may be related. It appears that opening the anomaly explorer adds 2 or 4 of these elements and never removes them, and they're doing something in response to mouse clicks on the page. Can you or someone on ML take a look into that?

[darnautov]

hey @chandlerprall, thanks for spotting this, the fix is coming

[darnautov]

The issue fixed by https://github.com/elastic/kibana/pull/72250, sorry for bothering! 😅