Skip to content

Add aria-label to Revisions button in Post Summary sidebar#78140

Merged
t-hamano merged 10 commits into
WordPress:trunkfrom
vishnucmsminds:fix/revisions-button-a11y
May 12, 2026
Merged

Add aria-label to Revisions button in Post Summary sidebar#78140
t-hamano merged 10 commits into
WordPress:trunkfrom
vishnucmsminds:fix/revisions-button-a11y

Conversation

@vishnucmsminds
Copy link
Copy Markdown
Contributor

What?

Closes #78138

This PR adds a descriptive aria-label to the Revisions button in the Post Summary sidebar panel.

Why?

Previously, the Revisions button in the Post Summary sidebar only displayed the count of revisions (e.g., "3"). For screen reader users, this was announced simply as "3 button," which lacked context. Adding a descriptive aria-label ensures that users understand the button's purpose is to open the revisions screen.

How?

In packages/editor/src/components/post-last-revision/index.js, I've updated the PrivatePostLastRevision component's Button to include an ariaLabel prop. The label is localized and dynamically includes the revision count: Open revisions screen: %s revisions.

Testing Instructions

  1. Open a post or page that has at least two revisions.
  2. Open the Settings sidebar and ensure you are on the Post tab.
  3. Locate the Summary panel.
  4. Inspect the Revisions button (the one showing the number of revisions).
  5. Verify that it now has an aria-label attribute like aria-label="Open revisions screen: X revisions".

Testing Instructions for Keyboard

  1. Navigate to the Revisions button using the Tab key.
  2. Use a screen reader (like VoiceOver or NVDA) to verify that the button is announced with the new descriptive label instead of just the number.

Use of AI Tools

This PR was authored with the assistance of Claude Opus 4.6. I have reviewed and tested the changes to ensure they meet the project's standards and solve the reported accessibility issue.

@github-actions
Copy link
Copy Markdown

github-actions Bot commented May 11, 2026

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: vishnupprajapat <vishnuprajapat@git.wordpress.org>
Co-authored-by: vishnucmsminds <prajapatvishnu@git.wordpress.org>
Co-authored-by: t-hamano <wildworks@git.wordpress.org>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

@github-actions github-actions Bot added [Package] Editor /packages/editor First-time Contributor Pull request opened by a first-time contributor to Gutenberg repository labels May 11, 2026
@github-actions
Copy link
Copy Markdown

👋 Thanks for your first Pull Request and for helping build the future of Gutenberg and WordPress, @vishnucmsminds! In case you missed it, we'd love to have you join us in our Slack community.

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

@t-hamano t-hamano added [Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). [Feature] History History, undo, redo, revisions, autosave. labels May 11, 2026
@t-hamano t-hamano moved this to 🔎 Needs Review in WordPress 7.0 Editor Tasks May 11, 2026
Comment thread packages/editor/src/components/post-last-revision/index.js Outdated
@t-hamano t-hamano added the Backport to WP 7.0 Beta/RC Pull request that needs to be backported to the WordPress major release that's currently in beta label May 11, 2026
Copy link
Copy Markdown
Contributor

@t-hamano t-hamano left a comment

Choose a reason for hiding this comment

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

LGTM!

@t-hamano t-hamano added the [Type] Bug An existing feature does not function as intended label May 11, 2026
@t-hamano
Copy link
Copy Markdown
Contributor

@vishnucmsminds, Do you know about E2E tests? The button label has changed, so we need to update the E2E tests accordingly. The files that need to be modified are as follows:

  • specs/editor/various/footnotes-revisions.spec.js
  • specs/editor/various/revision-block-diff.spec.js
  • specs/editor/various/revision-fields-diff.spec.js

In other words, we need to change the code included in the file above as follows.

                } );
                await settingsSidebar.getByRole( 'tab', { name: 'Post' } ).click();
                await settingsSidebar
-                       .getByRole( 'button', { name: '2', exact: true } )
+                       .getByRole( 'button', { name: 'Open revisions screen: 2 revisions' } )
                        .click();
                await expect(
                        page.getByRole( 'button', { name: 'Restore' } )

@vishnucmsminds
Copy link
Copy Markdown
Contributor Author

  • specs/editor/various/footnotes-revisions.spec.js
  • specs/editor/various/revision-block-diff.spec.js
  • specs/editor/various/revision-fields-diff.spec.js

Thanks for the feedback @t-hamano! I've updated the E2E tests in the following files to match the new button label:
test/e2e/specs/editor/various/footnotes-revisions.spec.js
test/e2e/specs/editor/various/revision-block-diff.spec.js
test/e2e/specs/editor/various/revision-fields-diff.spec.js

Please let me know if any further changes are needed.

@t-hamano t-hamano merged commit 8b0af9c into WordPress:trunk May 12, 2026
45 of 49 checks passed
@github-project-automation github-project-automation Bot moved this from 🔎 Needs Review to ✅ Done in WordPress 7.0 Editor Tasks May 12, 2026
@github-actions github-actions Bot added this to the Gutenberg 23.2 milestone May 12, 2026
@github-actions github-actions Bot added Backported to WP Core Pull request that has been successfully merged into WP Core and removed Backport to WP 7.0 Beta/RC Pull request that needs to be backported to the WordPress major release that's currently in beta labels May 12, 2026
gutenbergplugin pushed a commit that referenced this pull request May 12, 2026
* Add aria-label to Revisions button in Post Summary sidebar

* Change ariaLabel to aria-label for better standard compliance

* Update E2E tests to match the new revisions button aria-label

* Update E2E tests to match new Revisions button aria-label

---------

Co-authored-by: vishnupprajapat <vishnuprajapat@git.wordpress.org>
Co-authored-by: vishnucmsminds <prajapatvishnu@git.wordpress.org>
Co-authored-by: t-hamano <wildworks@git.wordpress.org>
@github-actions
Copy link
Copy Markdown

I just cherry-picked this PR to the wp/7.0 branch to get it included in the next release: ad384d5

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Backported to WP Core Pull request that has been successfully merged into WP Core [Feature] History History, undo, redo, revisions, autosave. 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] Editor /packages/editor [Type] Bug An existing feature does not function as intended

Projects

Development

Successfully merging this pull request may close these issues.

a11y: revision button lacks sufficient context

3 participants