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.

Sign up for GitHub

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

Jump to bottom

TOTP Codes should auto-select any contents upon tab #155

Open
dd32 opened this issue May 10, 2023 · 2 comments · May be fixed by #166
Open

TOTP Codes should auto-select any contents upon tab #155

dd32 opened this issue May 10, 2023 · 2 comments · May be fixed by #166
Assignees
@adamwoodnz
Labels
enhancement New feature or request priority: low ui Related to user interface
Milestone
Iteration 2

Comments

@dd32
Copy link
Member

dd32 commented May 10, 2023

  1. Enter 123123 into the TOTP setup screen
  2. Focus on the first box.
  3. Type 4
  4. Auto-tabbed to the next input
  5. Type 5. Unable to, until you delete the character in the field.

Ideally at step 4, upon tabbing to an input that has contents, it should select the existing content to allow typing over it, but not clear it.

This could also be achieved as a general "Upon field being focused, select the character" style to allow easy overwrite.
@dd32 dd32 added enhancement New feature or request ui Related to user interface priority: low labels May 10, 2023
@dd32 dd32 added this to the Iteration 2 milestone May 10, 2023
@dd32
Copy link
Member Author

dd32 commented May 11, 2023

I looked into this, and it's incredibly simple to do.. but.. I ran into an edge-case that I wasn't able to easily workaround.

The auto-tabbing is based on an onChange event handler, but if you type the same digit that's already displayed, it doesn't trigger the change event, which causes it not to advance, which instantly breaks your flow.

The alternative is to simulate the change event, tab on keyup, etc, which quickly went down the path of "This is getting messy"

@adamwoodnz adamwoodnz self-assigned this May 18, 2023
@adamwoodnz adamwoodnz linked a pull request May 18, 2023 that will close this issue
Open
@adamwoodnz
Copy link
Contributor

@dd32 I've raised the above PR and I think it covers the issues you've described. Try it out :)

@adamwoodnz adamwoodnz modified the milestones: Iteration 2, Iteration 1 May 18, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@adamwoodnz adamwoodnz

Labels
enhancement New feature or request priority: low ui Related to user interface
Projects
@adamwoodnz's WIP
Status: Todo
Milestone
Iteration 2
Development

Successfully merging a pull request may close this issue.

Auto select TOTP input contents when focused WordPress/wporg-two-factor
3 participants
@dd32 @adamwoodnz @StevenDufresne