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

"autoselect" selects all text when browser gets focus back #8175

Open
probert94 opened this issue Nov 19, 2024 · 2 comments
Open

"autoselect" selects all text when browser gets focus back #8175

probert94 opened this issue Nov 19, 2024 · 2 comments
Labels
needs research More information needed to estimate UX User experience issue vaadin-text-field

Comments

@probert94
Copy link

probert94 commented Nov 19, 2024

Description

I have a vaadin-text-field with autoselect.
When I select a part of the text and switch to another window and back to the browser, all text is selected again.
This is an issue if you are using for example Ditto clipboard tool as pasting focuses the Ditto window and before pasting, the browser is focused again.
The relevant code is in input-control-mixin.

Expected outcome

I would expect the text to only be selected if the field gets the focus in the webapp but not if the browser gets back the focus.
Another posibility would be to select all only if nothing is selected.

Minimal reproducible example

In this screen recording, the First name has autoselect=true, while the Last name has autoselect=false.
Not that when pasting into First name from Ditto, the whole text gets selected and overwritten, while it works as expected for Last name

Autoselect.mp4

Steps to reproduce

  1. Create a vaadin application with a field with "autoselect" set to true
  2. Focus part of the text
  3. Switch window and back to the browser
    All text is selected again

Environment

Vaadin version(s): Tested with 24.4.14

Browsers

Issue is not browser related

@web-padawan
Copy link
Member

The problem is that we can't detect whether the focus returns from outside or not. The event.relatedTarget only provides information about the element losing focus, if any. But it can be null also if page has focus but no element is focused.

I guess this could be workarounded by adding a global focusout listener and storing a global state by checking document.hasFocus() and then somehow checking that on focusin but that would need some research.

@web-padawan web-padawan added needs research More information needed to estimate vaadin-text-field labels Nov 19, 2024
@probert94
Copy link
Author

Maybe it is possible to keep the selection if there is any and select all if there is no selection.
The selection is preserved when the browser regains focus but is reset when the field is focussed again.
I tested it using the following code:
input.addEventListener("focus", e => console.log(input.selectionStart, input.selectionEnd).

@yuriy-fix yuriy-fix added the UX User experience issue label Nov 21, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
needs research More information needed to estimate UX User experience issue vaadin-text-field
Projects
None yet
Development

No branches or pull requests

3 participants