Page MenuHomePhabricator

Incorrect tab order on 2FA authentication page
Open, Needs TriagePublicBUG REPORT

Description

What is the problem?

The tabindex in the 2FA login form is not always in the correct order.

TOTP only on beta:

tabindex_totp_beta.png (743×460 px, 62 KB)

WebAuthn only on beta:

tabindex_webauthn_beta.png (743×460 px, 48 KB)

Patchdemo WebAuthn only:

tabindex_webauthn_patchdemo.png (594×375 px, 32 KB)

Patchdemo TOTP only:

tabindex_totp_patchdemo.png (580×429 px, 46 KB)

Patchdemo after WebAuthn error:

tabindex_webauthn_error_patchdemo.png (569×431 px, 37 KB)

Environment

Wiki(s):

Event Timeline

Mstyles updated Other Assignee, removed: Mstyles.

@dom_walden what do you think the tab order should be for the images listed? Outside of the WebAuthn error page, I think that the other pages seem to tab okay and the tab index increases. Is it that the bottom of the page has tab index set to 0 that's an issue for the other pages?

@dom_walden what do you think the tab order should be for the images listed? Outside of the WebAuthn error page, I think that the other pages seem to tab okay and the tab index increases. Is it that the bottom of the page has tab index set to 0 that's an issue for the other pages?

I assume they should all have index=-1. Otherwise, tabbing through the page takes you to the footer before it takes you to the form inputs.

I assume they should all have index=-1. Otherwise, tabbing through the page takes you to the footer before it takes you to the form inputs.

Per https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/tabindex: "A negative value (the exact negative value doesn't actually matter, usually tabindex="-1") means that the element is not reachable via sequential keyboard navigation."

We don't want everything to have index=-1 because that would mean we don't want the user to tab there. While the order is not currently optimal, tabbing does eventually get you to the input box.

I assume they should all have index=-1. Otherwise, tabbing through the page takes you to the footer before it takes you to the form inputs.

Per https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/tabindex: "A negative value (the exact negative value doesn't actually matter, usually tabindex="-1") means that the element is not reachable via sequential keyboard navigation."

We don't want everything to have index=-1 because that would mean we don't want the user to tab there. While the order is not currently optimal, tabbing does eventually get you to the input box.

Oh, could it be "0" then?