Skip to content

Conversation

@marissa-makes
Copy link
Contributor

@marissa-makes marissa-makes commented Nov 18, 2022

What?

Removes an unnecessary role=presentation attribute from the a span within the BlockVariationPicker component.

Why?

As described in #45753, the ARIA role=presentation attribute is not necessary on an element that doesn't have a native role (in this case, a span containing the label for the variation).

How?

This change removes the extraneous attribute, which is currently not serving any particular purpose. This change also does not hide the label from assistive technology.

Testing Instructions

Reproduction from the original issue:

  1. Add a Columns or Query loop block
  2. Note: to make the block variations appear in the Query loop block, click 'Start empty'.
  3. Inspect the source of the visible text below the variation buttons.
  4. observe the role="presentation" attribute is present. Ensure the attribute is not present
  5. Optionally test with a screen reader.
  6. Navigate the variations using the screen reader arrows navigation (ie. with VoiceOver it's Control+Option+Right (or Left) arrow)
  7. Observe the visible text is read out

Tested with Safari+VoiceOver and Chrome+VoiceOver.

Screenshots or screencast

Before:

before image

After:

image

@codesandbox
Copy link

codesandbox bot commented Nov 18, 2022

CodeSandbox logoCodeSandbox logo  Open in CodeSandbox Web Editor | VS Code | VS Code Insiders

@github-actions github-actions bot added the First-time Contributor Pull request opened by a first-time contributor to Gutenberg repository label Nov 18, 2022
@github-actions
Copy link

👋 Thanks for your first Pull Request and for helping build the future of Gutenberg and WordPress, @marissa-makes! In case you missed it, we'd love to have you join us in our Slack community, where we hold regularly weekly meetings open to anyone to coordinate with each other.

If you want to learn more about WordPress development in general, check out the Core Handbook full of helpful information.

Copy link
Contributor

@alexstine alexstine left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@marissa-makes Thanks for the PR! LGTM.

@alexstine alexstine added [Type] Enhancement A suggestion for improvement. [Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). [Type] Code Quality Issues or PRs that relate to code quality [Package] Block editor /packages/block-editor labels Nov 19, 2022
@alexstine alexstine merged commit 8795c6e into WordPress:trunk Nov 19, 2022
@github-actions github-actions bot added this to the Gutenberg 14.7 milestone Nov 19, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

First-time Contributor Pull request opened by a first-time contributor to Gutenberg repository [Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). [Package] Block editor /packages/block-editor [Type] Code Quality Issues or PRs that relate to code quality [Type] Enhancement A suggestion for improvement.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants