test: add a11y tests to showcases #11488
Annotations
8 errors and 1 notice
🔣 Print GitHub Report:
showcases/e2e/default.ts#L89
1) [webkit] › default.ts:52:2 › DBHeader › should match screenshot ───────────────────────────────
Error: A snapshot doesn't exist at /__w/mono/mono/__snapshots__/header/showcase/webkit/regular/neutral-bg-lvl-1/DBHeader-should-match-screenshot.png, writing actual.
87 | }
88 |
> 89 | await expect(page).toHaveScreenshot(
| ^
90 | [density, `neutral-bg-lvl-1.png`],
91 | config
92 | );
at /__w/mono/mono/showcases/e2e/default.ts:89:3
|
🔣 Print GitHub Report:
showcases/e2e/default.ts#L116
2) [webkit] › default.ts:96:3 › DBHeader › should not have any A11y issues for color neutral-bg-lvl-1
Error: expect(received).toEqual(expected) // deep equality
- Expected - 1
+ Received + 463
- Array []
+ Array [
+ Object {
+ "description": "Landmarks should have a unique role or role/label/title (i.e. accessible name) combination",
+ "help": "Ensures landmarks are unique",
+ "helpUrl": "https://dequeuniversity.com/rules/axe/4.9/landmark-unique?application=playwright",
+ "id": "landmark-unique",
+ "impact": "moderate",
+ "nodes": Array [
+ Object {
+ "all": Array [],
+ "any": Array [
+ Object {
+ "data": Object {
+ "accessibleText": null,
+ "role": "navigation",
+ },
+ "id": "landmark-is-unique",
+ "impact": "moderate",
+ "message": "The landmark must have a unique aria-label, aria-labelledby, or title to make landmarks distinguishable",
+ "relatedNodes": Array [
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-a5af5db5-27e6-4e79-bf1e-dce7a0b79523\">",
+ "target": Array [
+ "#navigation-a5af5db5-27e6-4e79-bf1e-dce7a0b79523",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-c8aaa33e-31b7-41d1-9bfd-564c45e6e816\">",
+ "target": Array [
+ "#navigation-c8aaa33e-31b7-41d1-9bfd-564c45e6e816",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-b8d87331-163d-48a9-8421-ef604d34f80d\">",
+ "target": Array [
+ "#navigation-b8d87331-163d-48a9-8421-ef604d34f80d",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-cf582ecf-8852-4f20-84c4-df554137c2b0\">",
+ "target": Array [
+ "#navigation-cf582ecf-8852-4f20-84c4-df554137c2b0",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-ab506c2b-8112-4f75-b7c9-99678b252dae\">",
+ "target": Array [
+ "#navigation-ab506c2b-8112-4f75-b7c9-99678b252dae",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-089e8375-a401-429a-8876-d4ee46da1133\">",
+ "target": Array [
+ "#navigation-089e8375-a401-429a-8876-d4ee46da1133",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-dc74ca85-53a0-4587-a46a-fc66beb16b9d\">",
+ "target": Array [
+ "#navigation-dc74ca85-53a0-4587-a46a-fc66beb16b9d",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-853bf1e6-7818-43f3-82ed-7bfd241be3f7\">",
+ "target": Array [
+ "#navigation-853bf1e6-7818-43f3-82ed-7bfd241be3f7",
+ ],
+ },
+ ],
+ },
+ ],
+ "failureSummary": "Fix any of the following:
+ The landmark must have a unique aria-label, aria-labelledby, or title to make landmarks distinguishable",
+ "html": "<nav class=\"db-navigation\" id=\"navigation-d5de12a7-36ae-40dd-b135-38ecb52d80ec\">",
+ "impact": "moderate",
+ "none": Array [],
+ "target": Array [
+ "#navigation
|
🔣 Print GitHub Report:
showcases/e2e/default.ts#L116
2) [webkit] › default.ts:96:3 › DBHeader › should not have any A11y issues for color neutral-bg-lvl-1
Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
Error: expect(received).toEqual(expected) // deep equality
- Expected - 1
+ Received + 463
- Array []
+ Array [
+ Object {
+ "description": "Landmarks should have a unique role or role/label/title (i.e. accessible name) combination",
+ "help": "Ensures landmarks are unique",
+ "helpUrl": "https://dequeuniversity.com/rules/axe/4.9/landmark-unique?application=playwright",
+ "id": "landmark-unique",
+ "impact": "moderate",
+ "nodes": Array [
+ Object {
+ "all": Array [],
+ "any": Array [
+ Object {
+ "data": Object {
+ "accessibleText": null,
+ "role": "navigation",
+ },
+ "id": "landmark-is-unique",
+ "impact": "moderate",
+ "message": "The landmark must have a unique aria-label, aria-labelledby, or title to make landmarks distinguishable",
+ "relatedNodes": Array [
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-05724d9c-474f-47e7-8aba-1f72bb2e967f\">",
+ "target": Array [
+ "#navigation-05724d9c-474f-47e7-8aba-1f72bb2e967f",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-7145eb31-db73-4c31-8646-824dc58ebf8e\">",
+ "target": Array [
+ "#navigation-7145eb31-db73-4c31-8646-824dc58ebf8e",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-36c089aa-d40f-497c-9ce0-c8f1f542b88c\">",
+ "target": Array [
+ "#navigation-36c089aa-d40f-497c-9ce0-c8f1f542b88c",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-7dd0b7d4-b1e8-4007-b34e-1cb0dcab8514\">",
+ "target": Array [
+ "#navigation-7dd0b7d4-b1e8-4007-b34e-1cb0dcab8514",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-4152cf1c-9232-4488-a3d5-8b46dfe404b8\">",
+ "target": Array [
+ "#navigation-4152cf1c-9232-4488-a3d5-8b46dfe404b8",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-8d9fe4d9-f2e2-46f8-9931-6555e6a9b086\">",
+ "target": Array [
+ "#navigation-8d9fe4d9-f2e2-46f8-9931-6555e6a9b086",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-b12dd884-baee-483c-83fd-b832a76b2b2d\">",
+ "target": Array [
+ "#navigation-b12dd884-baee-483c-83fd-b832a76b2b2d",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-0d551744-4fe7-4357-b271-d538755c8068\">",
+ "target": Array [
+ "#navigation-0d551744-4fe7-4357-b271-d538755c8068",
+ ],
+ },
+ ],
+ },
+ ],
+ "failureSummary": "Fix any of the following:
+ The landmark must have a unique aria-label, aria-labelledby, or title to make landmarks distinguishable",
+ "html": "<nav class=\"db-navigation\" id=\"navigation-b7713e00-e0bc-4abe-8ab6-6ed7ac5d29b4\">",
+ "impact": "m
|
🔣 Print GitHub Report:
showcases/e2e/default.ts#L116
3) [webkit] › default.ts:96:3 › DBHeader › should not have any A11y issues for color neutral-bg-lvl-2
Error: expect(received).toEqual(expected) // deep equality
- Expected - 1
+ Received + 463
- Array []
+ Array [
+ Object {
+ "description": "Landmarks should have a unique role or role/label/title (i.e. accessible name) combination",
+ "help": "Ensures landmarks are unique",
+ "helpUrl": "https://dequeuniversity.com/rules/axe/4.9/landmark-unique?application=playwright",
+ "id": "landmark-unique",
+ "impact": "moderate",
+ "nodes": Array [
+ Object {
+ "all": Array [],
+ "any": Array [
+ Object {
+ "data": Object {
+ "accessibleText": null,
+ "role": "navigation",
+ },
+ "id": "landmark-is-unique",
+ "impact": "moderate",
+ "message": "The landmark must have a unique aria-label, aria-labelledby, or title to make landmarks distinguishable",
+ "relatedNodes": Array [
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-d505b2bb-36ce-4ab0-9df8-8d4485e96b09\">",
+ "target": Array [
+ "#navigation-d505b2bb-36ce-4ab0-9df8-8d4485e96b09",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-350ff93f-c18e-4dda-9b42-674ec57801b8\">",
+ "target": Array [
+ "#navigation-350ff93f-c18e-4dda-9b42-674ec57801b8",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-111a65e4-3361-4905-96cc-3b47d2bafcd2\">",
+ "target": Array [
+ "#navigation-111a65e4-3361-4905-96cc-3b47d2bafcd2",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-1da8a73b-863c-4b93-96c6-5ac53ac65836\">",
+ "target": Array [
+ "#navigation-1da8a73b-863c-4b93-96c6-5ac53ac65836",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-1807d611-a90a-438c-9e18-7901ee33fe5e\">",
+ "target": Array [
+ "#navigation-1807d611-a90a-438c-9e18-7901ee33fe5e",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-fcaf6fd7-8728-45bb-9d07-4429bc7d5b3c\">",
+ "target": Array [
+ "#navigation-fcaf6fd7-8728-45bb-9d07-4429bc7d5b3c",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-9bddbd01-2fd5-4ff9-8d5b-2e5a8c5a1a6a\">",
+ "target": Array [
+ "#navigation-9bddbd01-2fd5-4ff9-8d5b-2e5a8c5a1a6a",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-7cc3771e-9e9d-4aba-bf2c-e345e7b9b4c7\">",
+ "target": Array [
+ "#navigation-7cc3771e-9e9d-4aba-bf2c-e345e7b9b4c7",
+ ],
+ },
+ ],
+ },
+ ],
+ "failureSummary": "Fix any of the following:
+ The landmark must have a unique aria-label, aria-labelledby, or title to make landmarks distinguishable",
+ "html": "<nav class=\"db-navigation\" id=\"navigation-18f2f169-58f4-415d-8059-8fae73facfc6\">",
+ "impact": "moderate",
+ "none": Array [],
+ "target": Array [
+ "#navigation
|
🔣 Print GitHub Report:
showcases/e2e/default.ts#L116
3) [webkit] › default.ts:96:3 › DBHeader › should not have any A11y issues for color neutral-bg-lvl-2
Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
Error: expect(received).toEqual(expected) // deep equality
- Expected - 1
+ Received + 463
- Array []
+ Array [
+ Object {
+ "description": "Landmarks should have a unique role or role/label/title (i.e. accessible name) combination",
+ "help": "Ensures landmarks are unique",
+ "helpUrl": "https://dequeuniversity.com/rules/axe/4.9/landmark-unique?application=playwright",
+ "id": "landmark-unique",
+ "impact": "moderate",
+ "nodes": Array [
+ Object {
+ "all": Array [],
+ "any": Array [
+ Object {
+ "data": Object {
+ "accessibleText": null,
+ "role": "navigation",
+ },
+ "id": "landmark-is-unique",
+ "impact": "moderate",
+ "message": "The landmark must have a unique aria-label, aria-labelledby, or title to make landmarks distinguishable",
+ "relatedNodes": Array [
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-10789078-857b-4fb9-854d-a0cb6c549b8d\">",
+ "target": Array [
+ "#navigation-10789078-857b-4fb9-854d-a0cb6c549b8d",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-63675286-88a5-4605-b65a-5f07f2cf45a6\">",
+ "target": Array [
+ "#navigation-63675286-88a5-4605-b65a-5f07f2cf45a6",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-1be4b0e4-3419-4868-89cb-aa468305542e\">",
+ "target": Array [
+ "#navigation-1be4b0e4-3419-4868-89cb-aa468305542e",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-908b1684-07f0-4157-95db-9cd69545a6d0\">",
+ "target": Array [
+ "#navigation-908b1684-07f0-4157-95db-9cd69545a6d0",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-8c6fd84c-3be2-4ea0-a262-fb79ff6e1937\">",
+ "target": Array [
+ "#navigation-8c6fd84c-3be2-4ea0-a262-fb79ff6e1937",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-bc606491-669c-47bd-8273-45cc8be45c56\">",
+ "target": Array [
+ "#navigation-bc606491-669c-47bd-8273-45cc8be45c56",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-a919ffbe-e8fb-4df5-a617-995f259ad2d2\">",
+ "target": Array [
+ "#navigation-a919ffbe-e8fb-4df5-a617-995f259ad2d2",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-e252089b-362a-4f21-8076-bcb1cdfcbd17\">",
+ "target": Array [
+ "#navigation-e252089b-362a-4f21-8076-bcb1cdfcbd17",
+ ],
+ },
+ ],
+ },
+ ],
+ "failureSummary": "Fix any of the following:
+ The landmark must have a unique aria-label, aria-labelledby, or title to make landmarks distinguishable",
+ "html": "<nav class=\"db-navigation\" id=\"navigation-4f2d940f-3741-49ad-a75a-de1eb2a58968\">",
+ "impact": "m
|
🔣 Print GitHub Report:
showcases/e2e/default.ts#L116
4) [webkit] › default.ts:96:3 › DBHeader › should not have any A11y issues for color neutral-bg-lvl-3
Error: expect(received).toEqual(expected) // deep equality
- Expected - 1
+ Received + 463
- Array []
+ Array [
+ Object {
+ "description": "Landmarks should have a unique role or role/label/title (i.e. accessible name) combination",
+ "help": "Ensures landmarks are unique",
+ "helpUrl": "https://dequeuniversity.com/rules/axe/4.9/landmark-unique?application=playwright",
+ "id": "landmark-unique",
+ "impact": "moderate",
+ "nodes": Array [
+ Object {
+ "all": Array [],
+ "any": Array [
+ Object {
+ "data": Object {
+ "accessibleText": null,
+ "role": "navigation",
+ },
+ "id": "landmark-is-unique",
+ "impact": "moderate",
+ "message": "The landmark must have a unique aria-label, aria-labelledby, or title to make landmarks distinguishable",
+ "relatedNodes": Array [
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-ce4a8c3d-7e24-44b7-b924-34b1efc9f2db\">",
+ "target": Array [
+ "#navigation-ce4a8c3d-7e24-44b7-b924-34b1efc9f2db",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-850b4e42-9a8e-4e00-9dc8-69af3570db5f\">",
+ "target": Array [
+ "#navigation-850b4e42-9a8e-4e00-9dc8-69af3570db5f",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-638c0bf9-b7ff-49df-a312-aac59d0668ed\">",
+ "target": Array [
+ "#navigation-638c0bf9-b7ff-49df-a312-aac59d0668ed",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-34e09b18-8441-4b93-85b1-9d01e30a47eb\">",
+ "target": Array [
+ "#navigation-34e09b18-8441-4b93-85b1-9d01e30a47eb",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-00bed60f-6019-4b31-801e-7747fea170db\">",
+ "target": Array [
+ "#navigation-00bed60f-6019-4b31-801e-7747fea170db",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-1a1c9674-c858-416c-82b6-bc850f417c5f\">",
+ "target": Array [
+ "#navigation-1a1c9674-c858-416c-82b6-bc850f417c5f",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-194501e0-2dc4-4c34-99a1-9ed2cd4d4fb4\">",
+ "target": Array [
+ "#navigation-194501e0-2dc4-4c34-99a1-9ed2cd4d4fb4",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-1636f913-9c9f-4a56-9f16-e92021062294\">",
+ "target": Array [
+ "#navigation-1636f913-9c9f-4a56-9f16-e92021062294",
+ ],
+ },
+ ],
+ },
+ ],
+ "failureSummary": "Fix any of the following:
+ The landmark must have a unique aria-label, aria-labelledby, or title to make landmarks distinguishable",
+ "html": "<nav class=\"db-navigation\" id=\"navigation-25b49745-da54-4774-8c18-8edc4c041567\">",
+ "impact": "moderate",
+ "none": Array [],
+ "target": Array [
+ "#navigation
|
🔣 Print GitHub Report:
showcases/e2e/default.ts#L116
4) [webkit] › default.ts:96:3 › DBHeader › should not have any A11y issues for color neutral-bg-lvl-3
Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
Error: expect(received).toEqual(expected) // deep equality
- Expected - 1
+ Received + 463
- Array []
+ Array [
+ Object {
+ "description": "Landmarks should have a unique role or role/label/title (i.e. accessible name) combination",
+ "help": "Ensures landmarks are unique",
+ "helpUrl": "https://dequeuniversity.com/rules/axe/4.9/landmark-unique?application=playwright",
+ "id": "landmark-unique",
+ "impact": "moderate",
+ "nodes": Array [
+ Object {
+ "all": Array [],
+ "any": Array [
+ Object {
+ "data": Object {
+ "accessibleText": null,
+ "role": "navigation",
+ },
+ "id": "landmark-is-unique",
+ "impact": "moderate",
+ "message": "The landmark must have a unique aria-label, aria-labelledby, or title to make landmarks distinguishable",
+ "relatedNodes": Array [
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-4be4cb34-792e-4103-aaf4-1f3fc53d84d5\">",
+ "target": Array [
+ "#navigation-4be4cb34-792e-4103-aaf4-1f3fc53d84d5",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-7f27a4d4-e477-4e0c-acd9-5cf834f907dd\">",
+ "target": Array [
+ "#navigation-7f27a4d4-e477-4e0c-acd9-5cf834f907dd",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-788d74af-aed8-452e-9c55-e9dc244ca824\">",
+ "target": Array [
+ "#navigation-788d74af-aed8-452e-9c55-e9dc244ca824",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-5bb9949f-05d2-4ccb-b34b-5d56a1a8503a\">",
+ "target": Array [
+ "#navigation-5bb9949f-05d2-4ccb-b34b-5d56a1a8503a",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-17f54efa-1bfb-486d-abf1-442f2fba610a\">",
+ "target": Array [
+ "#navigation-17f54efa-1bfb-486d-abf1-442f2fba610a",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-5a631e13-f183-4bb1-ab9c-5a11b203420e\">",
+ "target": Array [
+ "#navigation-5a631e13-f183-4bb1-ab9c-5a11b203420e",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-79230d01-87d8-4863-8c2f-c30787533afd\">",
+ "target": Array [
+ "#navigation-79230d01-87d8-4863-8c2f-c30787533afd",
+ ],
+ },
+ Object {
+ "html": "<nav class=\"db-navigation\" id=\"navigation-7c6c5d5e-a138-4651-b259-2cc7d6038e85\">",
+ "target": Array [
+ "#navigation-7c6c5d5e-a138-4651-b259-2cc7d6038e85",
+ ],
+ },
+ ],
+ },
+ ],
+ "failureSummary": "Fix any of the following:
+ The landmark must have a unique aria-label, aria-labelledby, or title to make landmarks distinguishable",
+ "html": "<nav class=\"db-navigation\" id=\"navigation-3430b83c-3c16-448f-b710-f869abb57dcb\">",
+ "impact": "m
|
👩🔬 Test showcase with Playwright 🎭
Process completed with exit code 1.
|
🔣 Print GitHub Report
4 failed
[webkit] › default.ts:52:2 › DBHeader › should match screenshot ────────────────────────────────
[webkit] › default.ts:96:3 › DBHeader › should not have any A11y issues for color neutral-bg-lvl-1
[webkit] › default.ts:96:3 › DBHeader › should not have any A11y issues for color neutral-bg-lvl-2
[webkit] › default.ts:96:3 › DBHeader › should not have any A11y issues for color neutral-bg-lvl-3
7 skipped
99 passed (3.2m)
|
Loading