diff --git a/CHANGELOG.md b/CHANGELOG.md index dba3b3c826..3a63dd5afd 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -13,6 +13,8 @@ and this project adheres to - ⚡️(frontend) improve accessibility: - #1248 - #1235 + - #1255 + - #1262 ## [3.5.0] - 2025-07-31 @@ -31,9 +33,7 @@ and this project adheres to - ♻️(frontend) redirect to doc after duplicate #1175 - 🔧(project) change env.d system by using local files #1200 - ⚡️(frontend) improve tree stability #1207 -- ⚡️(frontend) improve accessibility - - #1232 - - #1255 +- ⚡️(frontend) improve accessibility #1232 - 🛂(frontend) block drag n drop when not desktop #1239 ### Fixed diff --git a/src/frontend/apps/e2e/__tests__/app-impress/doc-grid.spec.ts b/src/frontend/apps/e2e/__tests__/app-impress/doc-grid.spec.ts index 7b200c664d..1881541e95 100644 --- a/src/frontend/apps/e2e/__tests__/app-impress/doc-grid.spec.ts +++ b/src/frontend/apps/e2e/__tests__/app-impress/doc-grid.spec.ts @@ -119,7 +119,7 @@ test.describe('Document grid item options', () => { await page.getByText('push_pin').click(); // Check is pinned - await expect(row.getByLabel('Pin document icon')).toBeVisible(); + await expect(row.locator('[data-testid^="doc-pinned-"]')).toBeVisible(); const leftPanelFavorites = page.getByTestId('left-panel-favorites'); await expect(leftPanelFavorites.getByText(docTitle)).toBeVisible(); @@ -128,7 +128,7 @@ test.describe('Document grid item options', () => { await page.getByText('Unpin').click(); // Check is unpinned - await expect(row.getByLabel('Pin document icon')).toBeHidden(); + await expect(row.locator('[data-testid^="doc-pinned-"]')).toBeHidden(); await expect(leftPanelFavorites.getByText(docTitle)).toBeHidden(); }); @@ -227,18 +227,18 @@ test.describe('Documents filters', () => { // Initial state await expect(allDocs).toBeVisible(); - await expect(allDocs).toHaveAttribute('aria-selected', 'true'); + await expect(allDocs).toHaveAttribute('aria-current', 'page'); await expect(myDocs).toBeVisible(); await expect(myDocs).toHaveCSS('background-color', 'rgba(0, 0, 0, 0)'); - await expect(myDocs).toHaveAttribute('aria-selected', 'false'); + await expect(myDocs).not.toHaveAttribute('aria-current'); await expect(sharedWithMe).toBeVisible(); await expect(sharedWithMe).toHaveCSS( 'background-color', 'rgba(0, 0, 0, 0)', ); - await expect(sharedWithMe).toHaveAttribute('aria-selected', 'false'); + await expect(sharedWithMe).not.toHaveAttribute('aria-current'); await allDocs.click(); diff --git a/src/frontend/apps/e2e/__tests__/app-impress/doc-header.spec.ts b/src/frontend/apps/e2e/__tests__/app-impress/doc-header.spec.ts index ed7486cde1..a1542353bf 100644 --- a/src/frontend/apps/e2e/__tests__/app-impress/doc-header.spec.ts +++ b/src/frontend/apps/e2e/__tests__/app-impress/doc-header.spec.ts @@ -409,7 +409,7 @@ test.describe('Doc Header', () => { const row = await getGridRow(page, docTitle); // Check is pinned - await expect(row.getByLabel('Pin document icon')).toBeVisible(); + await expect(row.locator('[data-testid^="doc-pinned-"]')).toBeVisible(); const leftPanelFavorites = page.getByTestId('left-panel-favorites'); await expect(leftPanelFavorites.getByText(docTitle)).toBeVisible(); @@ -424,7 +424,7 @@ test.describe('Doc Header', () => { await page.goto('/'); // Check is unpinned - await expect(row.getByLabel('Pin document icon')).toBeHidden(); + await expect(row.locator('[data-testid^="doc-pinned-"]')).toBeHidden(); await expect(leftPanelFavorites.getByText(docTitle)).toBeHidden(); }); diff --git a/src/frontend/apps/impress/src/components/DropButton.tsx b/src/frontend/apps/impress/src/components/DropButton.tsx index 22f18f670a..0232616701 100644 --- a/src/frontend/apps/impress/src/components/DropButton.tsx +++ b/src/frontend/apps/impress/src/components/DropButton.tsx @@ -33,6 +33,13 @@ const StyledButton = styled(Button)` font-size: 0.938rem; padding: 0; ${({ $css }) => $css}; + + &:focus-visible { + outline: 2px solid var(--c--theme--colors--primary-500); + outline-offset: 2px; + border-radius: 4px; + transition: none; + } `; export interface DropButtonProps { diff --git a/src/frontend/apps/impress/src/features/docs/doc-management/components/SimpleDocItem.tsx b/src/frontend/apps/impress/src/features/docs/doc-management/components/SimpleDocItem.tsx index 5fa63bc6b2..ff1524b651 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-management/components/SimpleDocItem.tsx +++ b/src/frontend/apps/impress/src/features/docs/doc-management/components/SimpleDocItem.tsx @@ -52,14 +52,17 @@ export const SimpleDocItem = ({ filter: drop-shadow(0px 2px 2px rgba(0, 0, 0, 0.05)); `} $padding={`${spacingsTokens['3xs']} 0`} + data-testid={isPinned ? `doc-pinned-${doc.id}` : undefined} > {isPinned ? (