diff --git a/frontend/src/lib/components/Pagination.svelte b/frontend/src/lib/components/Pagination.svelte
index 8cde307a..b9c4834b 100644
--- a/frontend/src/lib/components/Pagination.svelte
+++ b/frontend/src/lib/components/Pagination.svelte
@@ -95,7 +95,7 @@ const pageWindow = $derived.by(() => {
{/if}
-
+
{
>
{m.pagination_page_of({ page: page + 1, total: totalPages })}
+
+
+ {m.pagination_page_of({ page: page + 1, total: totalPages })}
+
diff --git a/frontend/src/lib/components/Pagination.svelte.spec.ts b/frontend/src/lib/components/Pagination.svelte.spec.ts
index 34469bf6..0d8aed2c 100644
--- a/frontend/src/lib/components/Pagination.svelte.spec.ts
+++ b/frontend/src/lib/components/Pagination.svelte.spec.ts
@@ -151,6 +151,15 @@ describe('Pagination', () => {
await expect.element(label).toHaveAttribute('aria-hidden', 'true');
});
+ it('sr-only span always provides aria-current="page" for screen readers at all breakpoints', async () => {
+ render(Pagination, { page: 2, totalPages: 10, makeHref });
+
+ const nav = page.getByRole('navigation');
+ const srLabel = nav.getByTestId('pagination-current-page-sr');
+ await expect.element(srLabel).toBeInTheDocument();
+ await expect.element(srLabel).toHaveAttribute('aria-current', 'page');
+ });
+
it('renders prev as a link pointing at page - 1 when not on first page', async () => {
render(Pagination, { page: 4, totalPages: 10, makeHref });