1) [chromium] › default.ts:52:2 › DBHeader › should match screenshot ───────────────────────────── Error: Screenshot comparison failed: 2276 pixels (ratio 0.01 of all image pixels) are different. Expected: /__w/mono/mono/__snapshots__/header/showcase/chromium/regular/neutral-bg-lvl-1/DBHeader-should-match-screenshot.png Received: /__w/mono/mono/showcases/angular-showcase/test-results/header-showcase-header-DBHeader-should-match-screenshot-chromium/regular-neutral-bg-lvl-1-actual.png Diff: /__w/mono/mono/showcases/angular-showcase/test-results/header-showcase-header-DBHeader-should-match-screenshot-chromium/regular-neutral-bg-lvl-1-diff.png Call log: - expect.toHaveScreenshot(regular/neutral-bg-lvl-1.png) with timeout 10000ms - verifying given screenshot expectation - taking page screenshot - disabled all CSS animations - waiting for fonts to load... - fonts loaded - 2276 pixels (ratio 0.01 of all image pixels) are different. - waiting 100ms before taking screenshot - taking page screenshot - disabled all CSS animations - waiting for fonts to load... - fonts loaded - captured a stable screenshot - 2276 pixels (ratio 0.01 of all image pixels) are different. 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:22

1) [chromium] › default.ts:52:2 › DBHeader › should match screenshot ───────────────────────────── Retry #1 ─────────────────────────────────────────────────────────────────────────────────────── Error: Screenshot comparison failed: 2276 pixels (ratio 0.01 of all image pixels) are different. Expected: /__w/mono/mono/__snapshots__/header/showcase/chromium/regular/neutral-bg-lvl-1/DBHeader-should-match-screenshot.png Received: /__w/mono/mono/showcases/angular-showcase/test-results/header-showcase-header-DBHeader-should-match-screenshot-chromium-retry1/regular-neutral-bg-lvl-1-actual.png Diff: /__w/mono/mono/showcases/angular-showcase/test-results/header-showcase-header-DBHeader-should-match-screenshot-chromium-retry1/regular-neutral-bg-lvl-1-diff.png Call log: - expect.toHaveScreenshot(regular/neutral-bg-lvl-1.png) with timeout 10000ms - verifying given screenshot expectation - taking page screenshot - disabled all CSS animations - waiting for fonts to load... - fonts loaded - 2276 pixels (ratio 0.01 of all image pixels) are different. - waiting 100ms before taking screenshot - taking page screenshot - disabled all CSS animations - waiting for fonts to load... - fonts loaded - captured a stable screenshot - 2276 pixels (ratio 0.01 of all image pixels) are different. 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:22

2) [chromium] › 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-28bf0e4b-4b55-4b8f-86e1-e8c310a29024\">", + "target": Array [ + "#navigation-28bf0e4b-4b55-4b8f-86e1-e8c310a29024", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-0e7ba8f1-656b-42f2-af8a-7f7fea42ece2\">", + "target": Array [ + "#navigation-0e7ba8f1-656b-42f2-af8a-7f7fea42ece2", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-5ef16e32-2c6e-4229-a28d-903dc3137e01\">", + "target": Array [ + "#navigation-5ef16e32-2c6e-4229-a28d-903dc3137e01", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-1c30a982-e922-4432-952e-5f20b8425236\">", + "target": Array [ + "#navigation-1c30a982-e922-4432-952e-5f20b8425236", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-22b6e9f1-6f57-4069-9817-5be68597eeed\">", + "target": Array [ + "#navigation-22b6e9f1-6f57-4069-9817-5be68597eeed", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-061c86c9-6ab3-4f8f-8de5-fc32b151d8e4\">", + "target": Array [ + "#navigation-061c86c9-6ab3-4f8f-8de5-fc32b151d8e4", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-074c3649-b4ea-4741-bb2f-b9d79f4c3a52\">", + "target": Array [ + "#navigation-074c3649-b4ea-4741-bb2f-b9d79f4c3a52", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-5da78670-7c55-427b-b0bd-22967cb5b8a1\">", + "target": Array [ + "#navigation-5da78670-7c55-427b-b0bd-22967cb5b8a1", + ], + }, + ], + }, + ], + "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-253b8ae5-cb94-43a0-982c-f59e7443fe05\">", + "impact": "moderate", + "none": Array [], + "target": Array [ + "#navigati

2) [chromium] › 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-70196ec7-d069-4a68-b073-482c71201367\">", + "target": Array [ + "#navigation-70196ec7-d069-4a68-b073-482c71201367", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-f7671b65-a0da-463a-b630-d0126c1230dd\">", + "target": Array [ + "#navigation-f7671b65-a0da-463a-b630-d0126c1230dd", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-3e4f484f-5ed4-4bb8-be9e-ba2e69b06dad\">", + "target": Array [ + "#navigation-3e4f484f-5ed4-4bb8-be9e-ba2e69b06dad", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-b0814f7d-f00a-4bdb-94e5-815648fb99ff\">", + "target": Array [ + "#navigation-b0814f7d-f00a-4bdb-94e5-815648fb99ff", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-032322cd-1e49-43f9-a8a0-40572e972374\">", + "target": Array [ + "#navigation-032322cd-1e49-43f9-a8a0-40572e972374", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-45999a2a-fd32-4170-9297-82fad2747c7f\">", + "target": Array [ + "#navigation-45999a2a-fd32-4170-9297-82fad2747c7f", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-743b897f-6ff3-4602-baed-a88a2f1fcfd4\">", + "target": Array [ + "#navigation-743b897f-6ff3-4602-baed-a88a2f1fcfd4", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-3054f3d4-bc04-466f-b338-ec82f551052a\">", + "target": Array [ + "#navigation-3054f3d4-bc04-466f-b338-ec82f551052a", + ], + }, + ], + }, + ], + "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-d91c4efd-c1ea-4496-9b37-7742a9298670\">", + "impact":

3) [chromium] › 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-3aebc61c-f0e0-480a-9003-982e58336535\">", + "target": Array [ + "#navigation-3aebc61c-f0e0-480a-9003-982e58336535", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-262df73a-b0c6-41d2-8e5a-e4bb556ceb21\">", + "target": Array [ + "#navigation-262df73a-b0c6-41d2-8e5a-e4bb556ceb21", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-c38359b8-43aa-4996-aa63-49aa6a37e8f1\">", + "target": Array [ + "#navigation-c38359b8-43aa-4996-aa63-49aa6a37e8f1", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-1caa0069-4521-4b13-8e13-bd0eecafe94c\">", + "target": Array [ + "#navigation-1caa0069-4521-4b13-8e13-bd0eecafe94c", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-f4dce914-9cc6-4e55-9b4e-4471bcf7f2c3\">", + "target": Array [ + "#navigation-f4dce914-9cc6-4e55-9b4e-4471bcf7f2c3", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-d3b9afa9-7066-4eb7-b0f8-148965a1c27d\">", + "target": Array [ + "#navigation-d3b9afa9-7066-4eb7-b0f8-148965a1c27d", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-60f2b8e0-47d3-414a-9e25-4b2b0db39627\">", + "target": Array [ + "#navigation-60f2b8e0-47d3-414a-9e25-4b2b0db39627", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-7dbaecdc-9ce0-4d4a-99cb-e810f4f19ac3\">", + "target": Array [ + "#navigation-7dbaecdc-9ce0-4d4a-99cb-e810f4f19ac3", + ], + }, + ], + }, + ], + "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-c9edf59c-1287-4beb-932c-44558e3a2e91\">", + "impact": "moderate", + "none": Array [], + "target": Array [ + "#navigati

3) [chromium] › 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-92359298-cdc9-41d2-afd3-ee35d9fd0096\">", + "target": Array [ + "#navigation-92359298-cdc9-41d2-afd3-ee35d9fd0096", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-21215d97-280c-413c-8619-e1f6def0fce8\">", + "target": Array [ + "#navigation-21215d97-280c-413c-8619-e1f6def0fce8", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-23223fcc-8201-461a-8c8d-005e4b02fab4\">", + "target": Array [ + "#navigation-23223fcc-8201-461a-8c8d-005e4b02fab4", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-4f9526ec-63e4-44f1-a313-7c5443f856bb\">", + "target": Array [ + "#navigation-4f9526ec-63e4-44f1-a313-7c5443f856bb", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-35394364-361b-47b5-9716-c3a7261c19e1\">", + "target": Array [ + "#navigation-35394364-361b-47b5-9716-c3a7261c19e1", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-b27b3246-a1d4-43f0-a7a2-92e3451518ec\">", + "target": Array [ + "#navigation-b27b3246-a1d4-43f0-a7a2-92e3451518ec", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-aa3a6c5c-13d3-4f7d-bb60-c5904f0c45da\">", + "target": Array [ + "#navigation-aa3a6c5c-13d3-4f7d-bb60-c5904f0c45da", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-7f36efbd-aeb8-4034-9101-6c1536cc90f3\">", + "target": Array [ + "#navigation-7f36efbd-aeb8-4034-9101-6c1536cc90f3", + ], + }, + ], + }, + ], + "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-989fcf4c-84e9-449b-a56d-6352cc976102\">", + "impact":

4) [chromium] › 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-956c9815-7ff6-49d6-aede-b7f56eec2bc9\">", + "target": Array [ + "#navigation-956c9815-7ff6-49d6-aede-b7f56eec2bc9", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-e6cef91c-103a-4e2a-b0fc-a6a59e904996\">", + "target": Array [ + "#navigation-e6cef91c-103a-4e2a-b0fc-a6a59e904996", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-1ae10532-8bf5-49d2-838a-03d85d83d67d\">", + "target": Array [ + "#navigation-1ae10532-8bf5-49d2-838a-03d85d83d67d", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-5ad8f23a-ab55-4fc0-a3cf-3e8889a312be\">", + "target": Array [ + "#navigation-5ad8f23a-ab55-4fc0-a3cf-3e8889a312be", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-bdf98d41-5e02-4683-8034-2a1240aec276\">", + "target": Array [ + "#navigation-bdf98d41-5e02-4683-8034-2a1240aec276", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-edb46197-0cdc-4047-8672-349aca0045a9\">", + "target": Array [ + "#navigation-edb46197-0cdc-4047-8672-349aca0045a9", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-262f36d2-68ce-4d18-8a7e-e10768a4eaca\">", + "target": Array [ + "#navigation-262f36d2-68ce-4d18-8a7e-e10768a4eaca", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-34db739e-3421-473a-aa16-681324cc5a9e\">", + "target": Array [ + "#navigation-34db739e-3421-473a-aa16-681324cc5a9e", + ], + }, + ], + }, + ], + "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-6424fb8a-1b38-4517-809c-9510e876af39\">", + "impact": "moderate", + "none": Array [], + "target": Array [ + "#navigati

4) [chromium] › 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-aea7ad49-7953-41a2-bea8-d4c131cd7ed6\">", + "target": Array [ + "#navigation-aea7ad49-7953-41a2-bea8-d4c131cd7ed6", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-faf7cb6d-25d2-4f97-b693-cbb248ebcb4a\">", + "target": Array [ + "#navigation-faf7cb6d-25d2-4f97-b693-cbb248ebcb4a", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-0d8b3d16-b357-4796-94bd-4e9ba3f17ea4\">", + "target": Array [ + "#navigation-0d8b3d16-b357-4796-94bd-4e9ba3f17ea4", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-c69ab1c2-284c-49c6-88df-cb062b53799f\">", + "target": Array [ + "#navigation-c69ab1c2-284c-49c6-88df-cb062b53799f", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-b3594885-7cec-4f82-be3f-be243f2859f2\">", + "target": Array [ + "#navigation-b3594885-7cec-4f82-be3f-be243f2859f2", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-2865976e-59b9-44b5-a115-0727a8e58d43\">", + "target": Array [ + "#navigation-2865976e-59b9-44b5-a115-0727a8e58d43", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-21401224-a5e4-4798-aa05-f5bbe72ed3f4\">", + "target": Array [ + "#navigation-21401224-a5e4-4798-aa05-f5bbe72ed3f4", + ], + }, + Object { + "html": "<nav class=\"db-navigation\" id=\"navigation-882a9063-34be-43ca-9f95-d69ae5e8ef8c\">", + "target": Array [ + "#navigation-882a9063-34be-43ca-9f95-d69ae5e8ef8c", + ], + }, + ], + }, + ], + "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-e2542f10-054b-4c26-8bdd-dbbc5c03a28c\">", + "impact":

Process completed with exit code 1.