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

Fix the post summary Status toggle button accessibility #63988

Merged
merged 2 commits into from
Sep 3, 2024
Merged

Fix the post summary Status toggle button accessibility #63988

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
2cb9388
Fix Change status label.
afercia Jul 10, 2024
6764872
Add missing aria-expanded attribute to Status setting.
afercia Jul 10, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 3 additions & 2 deletions packages/editor/src/components/post-status/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -171,17 +171,18 @@ export default function PostStatus() {
contentClassName="editor-change-status__content"
popoverProps={ popoverProps }
focusOnMount
renderToggle={ ( { onToggle } ) => (
renderToggle={ ( { onToggle, isOpen } ) => (
<Button
variant="tertiary"
size="compact"
onClick={ onToggle }
icon={ postStatusesInfo[ status ]?.icon }
aria-label={ sprintf(
// translators: %s: Current post status.
__( 'Change post status: %s' ),
__( 'Change status: %s' ),
postStatusesInfo[ status ]?.label
) }
aria-expanded={ isOpen }
>
{ postStatusesInfo[ status ]?.label }
</Button>
Expand Down
4 changes: 1 addition & 3 deletions test/e2e/specs/editor/various/change-detection.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -80,9 +80,7 @@ test.describe( 'Change detection', () => {

// Toggle post as needing review (not persisted for autosave).
await editor.openDocumentSettingsSidebar();
await page
.getByRole( 'button', { name: 'Change post status:' } )
.click();
await page.getByRole( 'button', { name: 'Change status:' } ).click();
await page.getByRole( 'radio', { name: 'Pending' } ).click();
// Force autosave to occur immediately.
await Promise.all( [
Expand Down
6 changes: 2 additions & 4 deletions test/e2e/specs/editor/various/post-visibility.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ test.describe( 'Post visibility', () => {
await editor.openDocumentSettingsSidebar();

await page
.getByRole( 'button', { name: 'Change post status:' } )
.getByRole( 'button', { name: 'Change status:' } )
.click();
await page.getByRole( 'radio', { name: 'Private' } ).click();

Expand Down Expand Up @@ -57,9 +57,7 @@ test.describe( 'Post visibility', () => {
name: 'Close',
} )
.click();
await page
.getByRole( 'button', { name: 'Change post status:' } )
.click();
await page.getByRole( 'button', { name: 'Change status:' } ).click();
await page.getByRole( 'radio', { name: 'Private' } ).click();
await page
.getByRole( 'region', { name: 'Editor top bar' } )
Expand Down
4 changes: 1 addition & 3 deletions test/e2e/specs/editor/various/preview.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -183,9 +183,7 @@ test.describe( 'Preview', () => {

// Return to editor and switch to Draft.
await editorPage.bringToFront();
await page
.getByRole( 'button', { name: 'Change post status:' } )
.click();
await page.getByRole( 'button', { name: 'Change status:' } ).click();
await page.getByRole( 'radio', { name: 'Draft' } ).click();
await page
.getByRole( 'region', { name: 'Editor top bar' } )
Expand Down
2 changes: 1 addition & 1 deletion test/e2e/specs/editor/various/switch-to-draft.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@ test.describe( 'Clicking "Switch to draft" on a published/scheduled post/page',

await editor.openDocumentSettingsSidebar();
await page
.getByRole( 'button', { name: 'Change post status:' } )
.getByRole( 'button', { name: 'Change status:' } )
.click();
await page.getByRole( 'radio', { name: 'Draft' } ).click();

Expand Down
Loading