Skip to content

Update "Try another way" input to use a disclosure menu#15145

Merged
brandonkelly merged 16 commits into5.2from
feature/pt-1693-update-try-another-way-input-to-use-a-disclosure-menu
Jun 7, 2024
Merged

Update "Try another way" input to use a disclosure menu#15145
brandonkelly merged 16 commits into5.2from
feature/pt-1693-update-try-another-way-input-to-use-a-disclosure-menu

Conversation

@gcamacho079
Copy link
Copy Markdown
Contributor

@gcamacho079 gcamacho079 commented Jun 4, 2024

Description

  • Changes the “Try another way” button to a disclosure instead of a select-type component.
  • Implements a new spinner web component with visually hidden "Loading" text. This presents an alternative to using a live region for announcing loading states, as using the focus method results in the message being surfaced to screen reader users. (See attached video for VoiceOver demo)
Screen.Recording.2024-06-06.at.10.24.44.AM.mov

In the video above, selecting an option from the disclosure menu causes the menu to close, and programmatic focus is moved to the spinner; because the spinner has a visually hidden text node, “Loading“ is announced. The spinner is then hidden, and focus is moved to the new form field.

Related issues

Resolves PT-1693

@gcamacho079 gcamacho079 added the accessibility 👤 features related to accessibility label Jun 4, 2024
@linear
Copy link
Copy Markdown

linear Bot commented Jun 4, 2024

@gcamacho079 gcamacho079 marked this pull request as ready for review June 6, 2024 17:36
@brandonkelly
Copy link
Copy Markdown
Member

Couple things that could be better:

  • The chevron icon color should match the text color (dark gray; blue on hover).

The “Try another way” button label

  • The spinner is pretty jarring. Maybe lock the height of the container and center the spinner within it, so at least the pane height isn’t changing twice rapidly.

@gcamacho079 gcamacho079 requested a review from brandonkelly June 7, 2024 20:35
@gcamacho079
Copy link
Copy Markdown
Contributor Author

Couple things that could be better:

Thanks for reviewing, @brandonkelly! Just made those modifications. 🙏🏼

@brandonkelly
Copy link
Copy Markdown
Member

@gcamacho079 Thanks!!

[ci skip]
@brandonkelly brandonkelly merged commit b66938b into 5.2 Jun 7, 2024
@brandonkelly brandonkelly deleted the feature/pt-1693-update-try-another-way-input-to-use-a-disclosure-menu branch June 7, 2024 21:32
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

accessibility 👤 features related to accessibility

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants