Jellyfin-web: Unable to select saved login+password in login form using arrow

[agilob]

Describe the bug
I use keyboard to navigate webui and can't login to jellyfin by selecting username+password using arrows

To Reproduce
https://gfycat.com/greenunrulyhalicore

Start typing your username, as autocomplete arrives, press arrow down to select it from the list

Expected behavior
Pressing arrow down navigates to a field below.

System (please complete the following information):

• OS: docker
• Browser: Firefox
• Jellyfin Version: 10.4.0

[agilob]

Standard way to navigate between fields is to use tab [down] and tab+shift [up]

[JustAMan]

@joshuaboniface is it the same as you expressed?
@EraYaN can this be related to your works of enabling keyboard navigation for TVs and such?

[anthonylavado]

@JustAMan I think it's definitely the keyboard nav. It's probably active on all screens, including this one, so that it could be navigated with a remote.

Relevant file: https://github.com/jellyfin/jellyfin-web/blob/release-10.4.z/src/components/keyboardnavigation.js

[stale[bot]]

Issues go stale after 90d of inactivity. Mark the issue as fresh by adding a comment or commit. Stale issues close after an additional 14d of inactivity. If this issue is safe to close now please do so. If you have any questions you can reach us on Matrix or Social Media.

[agilob]

Still a bug and regression.

[JustAMan]

@dmitrylyzo does this ring any bells for your experiments with TV + keyboard support?

[dkanada]

I don't personally consider this a regression, it was a concious decision to disable keyboard navigation for the desktop layout. My personal solution for this would be an additional preference to manually enable keyboard navigation rather than enable it globally for the desktop layout, but that's open to discussion.

[JustAMan]

The problem here is that keyboard navigation looks to be _not_ disabled here, but rather uses TV remote-like behaviour (where arrow keys move focus around instead of missing-on-the-remote Tab).

[agilob]

This is broken user experience comparing to previous versions and unmet expectations from generally known web from behaviour. Navigation with tab / tab+shift is a common thing that works across all devices, whether you're in a browser, desktop app or mobile, it always works the same when using keyboard.

Here I would like to add that this affects not only login form but all forms in jellyfin, library management too.

Being unable to navigate autocomplete with arrows when dropdown appears is a bug, broken keyboard navigation is a regression here.

[dmitrylyzo]

@JustAMan
I mainly use the keyboard for navigation only. On a real TV I use a remote control (keyboard for some tests and when I am stuck with a broken focus). So, I almost do not edit the inputs.

Tizen 4 (real)/5: no autocompletion, no dropdown list.
WebOS 3/4: autocompletion is part of screen keyboard, no dropdown list.

No dropdown lists - no problem (almost).

Why "almost"?

• There is issue #682, which also exists on TV (if you want to edit inputs). In fact, the root of issues #682 and #504 (this) the same.

• Another inconvenience that I have is that the on-screen keyboard "stops" navigation. It grabs key handling, so focus stay on the input, and I have to press Back/Esc on each navigation step.

• Also, on-screen keyboard has arrow keys which not work for cursor manipulation due to navigation handling - the same as #682.

I tried to block on-screen keyboard ee6428e3bfd614c52932be4e19d380a87b4b8b6d, but have success in Tizen app only.
In short,

• On focus emby-input blocked with readonly
• Enter to enter in edit mode
• Back/Esc to out edit mode
• Enter in edit mode - submit the form.
• In edit mode arrow keys "reverted" to default behavior.

In browsers (Tizen, WebOS) and WebOS app Back handled by system/browser, and I cannot exit edit mode. Some (crazy) idea was to push browser history and exit edit mode on pop, but I have not tried this.

Maybe the approach above could be a solution for #682 on TV (if exit edit mode will be solved), but not for desktop.