refactor: patternhub examples to align with figma props #15582
Annotations
11 errors, 2 warnings, and 1 notice
👩🔬 Test showcase with Playwright 🎭
Process completed with exit code 1.
|
🔣 Print GitHub Report:
showcases/e2e/default.ts#L111
1) [firefox] › default.ts:79:2 › DBLink › should match screenshot ────────────────────────────────
Error: expect(page).toHaveScreenshot(expected)
Expected an image 1280px by 2305px, received 1280px by 2630px. 8059 pixels (ratio 0.01 of all image pixels) are different.
Expected: /__w/mono/mono/__snapshots__/link/showcase/firefox/DBLink-should-match-screenshot-1/DBLink-should-match-screenshot.png
Received: /__w/mono/mono/showcases/stencil-showcase/test-results/link-link-snapshot-DBLink-should-match-screenshot-firefox/DBLink-should-match-screenshot-1-actual.png
Diff: /__w/mono/mono/showcases/stencil-showcase/test-results/link-link-snapshot-DBLink-should-match-screenshot-firefox/DBLink-should-match-screenshot-1-diff.png
Call log:
- expect.toHaveScreenshot with timeout 30000ms
- verifying given screenshot expectation
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- Expected an image 1280px by 2305px, received 1280px by 2630px. 8059 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
- Expected an image 1280px by 2305px, received 1280px by 2630px. 8059 pixels (ratio 0.01 of all image pixels) are different.
109 | }
110 |
> 111 | await expect(page).toHaveScreenshot(config);
| ^
112 | });
113 | };
114 |
at /__w/mono/mono/showcases/e2e/default.ts:111:22
|
🔣 Print GitHub Report:
showcases/e2e/default.ts#L111
1) [firefox] › default.ts:79:2 › DBLink › should match screenshot ────────────────────────────────
Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
Error: expect(page).toHaveScreenshot(expected)
Expected an image 1280px by 2305px, received 1280px by 2630px. 8059 pixels (ratio 0.01 of all image pixels) are different.
Expected: /__w/mono/mono/__snapshots__/link/showcase/firefox/DBLink-should-match-screenshot-1/DBLink-should-match-screenshot.png
Received: /__w/mono/mono/showcases/stencil-showcase/test-results/link-link-snapshot-DBLink-should-match-screenshot-firefox-retry1/DBLink-should-match-screenshot-1-actual.png
Diff: /__w/mono/mono/showcases/stencil-showcase/test-results/link-link-snapshot-DBLink-should-match-screenshot-firefox-retry1/DBLink-should-match-screenshot-1-diff.png
Call log:
- expect.toHaveScreenshot with timeout 30000ms
- verifying given screenshot expectation
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- Expected an image 1280px by 2305px, received 1280px by 2630px. 8059 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
- Expected an image 1280px by 2305px, received 1280px by 2630px. 8059 pixels (ratio 0.01 of all image pixels) are different.
109 | }
110 |
> 111 | await expect(page).toHaveScreenshot(config);
| ^
112 | });
113 | };
114 |
at /__w/mono/mono/showcases/e2e/default.ts:111:22
|
🔣 Print GitHub Report:
showcases/e2e/default.ts#L229
2) [firefox] › default.ts:219:2 › DBLink › should have same aria-snapshot ────────────────────────
Error: expect(string).toMatchSnapshot(expected)
- main:
- heading "DBLink" [level=1]
- link "Density arrow_up_right\" / \""
- link "Functional arrow_right\" / \""
- link "(Default) Regular arrow_right\" / \""
- link "Expressive arrow_right\" / \""
- link "Semantic arrow_up_right\" / \""
- link "(Default) Adaptive arrow_right\" / \""
- link "Brand arrow_right\" / \""
- link "InteractDion-Stsatblesd arrow_up_right\" / \""
- link "Enabled (Default)/Hover/Pre Falssed arrow_right\" / \""
- link "DisablTrued arrow_right\" / \"" [disabled]
- link "Size arrow_up_right\" / \""
- link "(Default) Medium arrow_right\" / \""
- link "Small arrow_right\" / \""
- link "Content arrow_up_right\" / \""
- link "(Default) Internal arrow_right\" / \""
- link "External arrow_up_right\" / \""
- link "Show Icon arrow_up_right\" / \""
- link "(Default) True arrow_right\" / \""
- link "False"
Expected: /__w/mono/mono/__snapshots__/link/showcase/firefox/should-have-same-aria-snapshot/DBLink-should-have-same-aria-snapshot.yaml
Received: /__w/mono/mono/showcases/stencil-showcase/test-results/link-link-snapshot-DBLink-should-have-same-aria-snapshot-firefox/should-have-same-aria-snapshot-actual.yaml
227 |
228 | const snapshot = await page.locator('main').ariaSnapshot();
> 229 | expect(snapshot).toMatchSnapshot(`${title}.yaml`);
| ^
230 | });
231 | };
232 |
at /__w/mono/mono/showcases/e2e/default.ts:229:20
|
🔣 Print GitHub Report:
showcases/e2e/default.ts#L229
2) [firefox] › default.ts:219:2 › DBLink › should have same aria-snapshot ────────────────────────
Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
Error: expect(string).toMatchSnapshot(expected)
- main:
- heading "DBLink" [level=1]
- link "Density arrow_up_right\" / \""
- link "Functional arrow_right\" / \""
- link "(Default) Regular arrow_right\" / \""
- link "Expressive arrow_right\" / \""
- link "Semantic arrow_up_right\" / \""
- link "(Default) Adaptive arrow_right\" / \""
- link "Brand arrow_right\" / \""
- link "InteractDion-Stsatblesd arrow_up_right\" / \""
- link "Enabled (Default)/Hover/Pre Falssed arrow_right\" / \""
- link "DisablTrued arrow_right\" / \"" [disabled]
- link "Size arrow_up_right\" / \""
- link "(Default) Medium arrow_right\" / \""
- link "Small arrow_right\" / \""
- link "Content arrow_up_right\" / \""
- link "(Default) Internal arrow_right\" / \""
- link "External arrow_up_right\" / \""
- link "Show Icon arrow_up_right\" / \""
- link "(Default) True arrow_right\" / \""
- link "False"
Expected: /__w/mono/mono/__snapshots__/link/showcase/firefox/should-have-same-aria-snapshot/DBLink-should-have-same-aria-snapshot.yaml
Received: /__w/mono/mono/showcases/stencil-showcase/test-results/link-link-snapshot-DBLink-should-have-same-aria-snapshot-firefox-retry1/should-have-same-aria-snapshot-actual.yaml
227 |
228 | const snapshot = await page.locator('main').ariaSnapshot();
> 229 | expect(snapshot).toMatchSnapshot(`${title}.yaml`);
| ^
230 | });
231 | };
232 |
at /__w/mono/mono/showcases/e2e/default.ts:229:20
|
🔣 Print GitHub Report:
showcases/e2e/default.ts#L111
3) [firefox] › default.ts:79:2 › DBNotification › should match screenshot ────────────────────────
Error: expect(page).toHaveScreenshot(expected)
Expected an image 1280px by 3393px, received 1280px by 4693px. 114029 pixels (ratio 0.02 of all image pixels) are different.
Expected: /__w/mono/mono/__snapshots__/notification/showcase/firefox/DBNotification-should-match-screenshot-1/DBNotification-should-match-screenshot.png
Received: /__w/mono/mono/showcases/stencil-showcase/test-results/notification-notification--533fc-ion-should-match-screenshot-firefox/DBNotification-should-match-screenshot-1-actual.png
Diff: /__w/mono/mono/showcases/stencil-showcase/test-results/notification-notification--533fc-ion-should-match-screenshot-firefox/DBNotification-should-match-screenshot-1-diff.png
Call log:
- expect.toHaveScreenshot with timeout 30000ms
- verifying given screenshot expectation
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- Expected an image 1280px by 3393px, received 1280px by 4693px. 114029 pixels (ratio 0.02 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
- Expected an image 1280px by 3393px, received 1280px by 4693px. 114029 pixels (ratio 0.02 of all image pixels) are different.
109 | }
110 |
> 111 | await expect(page).toHaveScreenshot(config);
| ^
112 | });
113 | };
114 |
at /__w/mono/mono/showcases/e2e/default.ts:111:22
|
🔣 Print GitHub Report:
showcases/e2e/default.ts#L111
3) [firefox] › default.ts:79:2 › DBNotification › should match screenshot ────────────────────────
Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
Error: expect(page).toHaveScreenshot(expected)
Expected an image 1280px by 3393px, received 1280px by 4693px. 114029 pixels (ratio 0.02 of all image pixels) are different.
Expected: /__w/mono/mono/__snapshots__/notification/showcase/firefox/DBNotification-should-match-screenshot-1/DBNotification-should-match-screenshot.png
Received: /__w/mono/mono/showcases/stencil-showcase/test-results/notification-notification--533fc-ion-should-match-screenshot-firefox-retry1/DBNotification-should-match-screenshot-1-actual.png
Diff: /__w/mono/mono/showcases/stencil-showcase/test-results/notification-notification--533fc-ion-should-match-screenshot-firefox-retry1/DBNotification-should-match-screenshot-1-diff.png
Call log:
- expect.toHaveScreenshot with timeout 30000ms
- verifying given screenshot expectation
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- Expected an image 1280px by 3393px, received 1280px by 4693px. 114029 pixels (ratio 0.02 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
- Expected an image 1280px by 3393px, received 1280px by 4693px. 114029 pixels (ratio 0.02 of all image pixels) are different.
109 | }
110 |
> 111 | await expect(page).toHaveScreenshot(config);
| ^
112 | });
113 | };
114 |
at /__w/mono/mono/showcases/e2e/default.ts:111:22
|
🔣 Print GitHub Report:
showcases/e2e/default.ts#L229
4) [firefox] › default.ts:219:2 › DBNotification › should have same aria-snapshot ────────────────
Error: expect(string).toMatchSnapshot(expected)
- main:
- heading "DBNotification" [level=1]
- link "Density arrow_up_right\" / \""
- article:
- text: Headline
- paragraph: functional
- button "Close Button"
- article:
- text: Headline
- paragraph: regular (Default)
- button "Close Button"
- article:
- text: Headline
- paragraph: expressive
- button "Close Button"
- link "Variant arrow_up_right\" / \""
- article:
- text: Headline
- paragraph: (Default) Docked
- button "Close Button"
- article:
- text: Headline
- paragraph: Standalone
- button "Close Button"
- article:
- text: Headline
- paragraph: Overlay
- text: 10 min ago
- button "Close Button"
- link "Semantic arrow_up_right\" / \""
- article:
- text: Headline
- paragraph: (Default) Adaptive
- button "Close Button"
- article:
- text: information_circle" / " Headline
- paragraph: Neutral
- button "Close Button"
- article:
- text: exclamation_mark_circle" / " Headline
- paragraph: Critical
- button "Close Button"
- article:
- text: information_circle" / " Headline
- paragraph: Informational
- button "Close Button"
- article:
- text: check_circle" / " Headline
- paragraph: Successful
- button "Close Button"
- article:
- text: exclamation_mark_triangle" / " Headline
- paragraph: Warning
- button "Close Button"
- link "BClosehaviourble arrow_up_right\" / \""
- article:
- paragraph: (Default) PFalse
- armticle:
- paragraph: "True"
- button "Close Button"
- link "Visual arrow_up_right\" / \""
- article:
- paragraph: C(Default) Icon
- article:
- img "this is a fancy placeholder"
- pabragraph: Image
- link "Show Icon arrow_up_right\" / \""
- article:
- bparagraph: (Default) True
- artonicle:
- paragraph: "CFalose"
B - link "Link Variant arrow_up_right\" / \""
- article:
- paragraph: (Default) Block
- link "Textlink"
- article:
- paragraph: Inline
- link "CTextlink"
- link "Show Headline arrow_up_right\" / \""
- article:
- text: Headline
- paragraph: (Default) True
- article:
- text: Headline
- paragraph: "False"
- link "Examples - Variant:Docked arrow_up_right\" / \""
- article:
- paragraph: Text
- article:
- paragraph: Text & Icon
- article:
- img "this is a fancy placeholder"
- paragraph: Text & Preview Image
- article:
- text: Headline
- paragraph: Text & Headline
- article:
- paragraph: Text & Textlink Block
- link "Textlink"
- article:
- paragraph: Text & Textlink Inline
- link "Textlink"
- article:
- text: Headline
- paragraph: Text & Headline & Textlink Inline & Cloaseable
- link "Textlink"
- article:
- text: Headline
- paragraph: Text & Icon & Headline & Textlink Inline & Cloaseable
- link "Textlink"
- link "ContExamplents - Variant:Standalone arrow_up_right\" / \""
- article:
- paragraph: Text
- article:
- paragraph: Text & Icon
- article:
- img "this is a fancy placeholder"
- paragraph: Text & Preview Image
- article:
- text: Headline
- paragraph: Text & Headline
|
🔣 Print GitHub Report:
showcases/e2e/default.ts#L229
4) [firefox] › default.ts:219:2 › DBNotification › should have same aria-snapshot ────────────────
Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
Error: expect(string).toMatchSnapshot(expected)
- main:
- heading "DBNotification" [level=1]
- link "Density arrow_up_right\" / \""
- article:
- text: Headline
- paragraph: functional
- button "Close Button"
- article:
- text: Headline
- paragraph: regular (Default)
- button "Close Button"
- article:
- text: Headline
- paragraph: expressive
- button "Close Button"
- link "Variant arrow_up_right\" / \""
- article:
- text: Headline
- paragraph: (Default) Docked
- button "Close Button"
- article:
- text: Headline
- paragraph: Standalone
- button "Close Button"
- article:
- text: Headline
- paragraph: Overlay
- text: 10 min ago
- button "Close Button"
- link "Semantic arrow_up_right\" / \""
- article:
- text: Headline
- paragraph: (Default) Adaptive
- button "Close Button"
- article:
- text: information_circle" / " Headline
- paragraph: Neutral
- button "Close Button"
- article:
- text: exclamation_mark_circle" / " Headline
- paragraph: Critical
- button "Close Button"
- article:
- text: information_circle" / " Headline
- paragraph: Informational
- button "Close Button"
- article:
- text: check_circle" / " Headline
- paragraph: Successful
- button "Close Button"
- article:
- text: exclamation_mark_triangle" / " Headline
- paragraph: Warning
- button "Close Button"
- link "BClosehaviourble arrow_up_right\" / \""
- article:
- paragraph: (Default) PFalse
- armticle:
- paragraph: "True"
- button "Close Button"
- link "Visual arrow_up_right\" / \""
- article:
- paragraph: C(Default) Icon
- article:
- img "this is a fancy placeholder"
- pabragraph: Image
- link "Show Icon arrow_up_right\" / \""
- article:
- bparagraph: (Default) True
- artonicle:
- paragraph: "CFalose"
B - link "Link Variant arrow_up_right\" / \""
- article:
- paragraph: (Default) Block
- link "Textlink"
- article:
- paragraph: Inline
- link "CTextlink"
- link "Show Headline arrow_up_right\" / \""
- article:
- text: Headline
- paragraph: (Default) True
- article:
- text: Headline
- paragraph: "False"
- link "Examples - Variant:Docked arrow_up_right\" / \""
- article:
- paragraph: Text
- article:
- paragraph: Text & Icon
- article:
- img "this is a fancy placeholder"
- paragraph: Text & Preview Image
- article:
- text: Headline
- paragraph: Text & Headline
- article:
- paragraph: Text & Textlink Block
- link "Textlink"
- article:
- paragraph: Text & Textlink Inline
- link "Textlink"
- article:
- text: Headline
- paragraph: Text & Headline & Textlink Inline & Cloaseable
- link "Textlink"
- article:
- text: Headline
- paragraph: Text & Icon & Headline & Textlink Inline & Cloaseable
- link "Textlink"
- link "ContExamplents - Variant:Standalone arrow_up_right\" / \""
- article:
- paragraph: Text
- article:
- paragraph: Text & Icon
- article:
- img "this is a fancy placeholder"
- paragraph: Text & Pr
|
🔣 Print GitHub Report:
showcases/e2e/default.ts#L111
5) [firefox] › default.ts:79:2 › DBRadio › should match screenshot ───────────────────────────────
Error: expect(page).toHaveScreenshot(expected)
Expected an image 1280px by 2630px, received 1280px by 2955px. 12896 pixels (ratio 0.01 of all image pixels) are different.
Expected: /__w/mono/mono/__snapshots__/radio/showcase/firefox/DBRadio-should-match-screenshot-1/DBRadio-should-match-screenshot.png
Received: /__w/mono/mono/showcases/stencil-showcase/test-results/radio-radio-snapshot-DBRadio-should-match-screenshot-firefox/DBRadio-should-match-screenshot-1-actual.png
Diff: /__w/mono/mono/showcases/stencil-showcase/test-results/radio-radio-snapshot-DBRadio-should-match-screenshot-firefox/DBRadio-should-match-screenshot-1-diff.png
Call log:
- expect.toHaveScreenshot with timeout 30000ms
- verifying given screenshot expectation
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- Expected an image 1280px by 2630px, received 1280px by 2955px. 12896 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
- Expected an image 1280px by 2630px, received 1280px by 2955px. 12896 pixels (ratio 0.01 of all image pixels) are different.
109 | }
110 |
> 111 | await expect(page).toHaveScreenshot(config);
| ^
112 | });
113 | };
114 |
at /__w/mono/mono/showcases/e2e/default.ts:111:22
|
🔣 Print GitHub Report:
showcases/e2e/default.ts#L111
5) [firefox] › default.ts:79:2 › DBRadio › should match screenshot ───────────────────────────────
Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
Error: expect(page).toHaveScreenshot(expected)
Expected an image 1280px by 2630px, received 1280px by 2955px. 12896 pixels (ratio 0.01 of all image pixels) are different.
Expected: /__w/mono/mono/__snapshots__/radio/showcase/firefox/DBRadio-should-match-screenshot-1/DBRadio-should-match-screenshot.png
Received: /__w/mono/mono/showcases/stencil-showcase/test-results/radio-radio-snapshot-DBRadio-should-match-screenshot-firefox-retry1/DBRadio-should-match-screenshot-1-actual.png
Diff: /__w/mono/mono/showcases/stencil-showcase/test-results/radio-radio-snapshot-DBRadio-should-match-screenshot-firefox-retry1/DBRadio-should-match-screenshot-1-diff.png
Call log:
- expect.toHaveScreenshot with timeout 30000ms
- verifying given screenshot expectation
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- Expected an image 1280px by 2630px, received 1280px by 2955px. 12896 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
- Expected an image 1280px by 2630px, received 1280px by 2955px. 12896 pixels (ratio 0.01 of all image pixels) are different.
109 | }
110 |
> 111 | await expect(page).toHaveScreenshot(config);
| ^
112 | });
113 | };
114 |
at /__w/mono/mono/showcases/e2e/default.ts:111:22
|
ubuntu-latest pipelines will use ubuntu-24.04 soon. For more details, see https://github.com/actions/runner-images/issues/10636
|
🆙 Upload aChecker results
No files were found with the provided path: ./showcases/stencil-showcase-showcase/results. No artifacts will be uploaded.
|
🔣 Print GitHub Report
14 failed
[firefox] › default.ts:79:2 › DBLink › should match screenshot ─────────────────────────────────
[firefox] › default.ts:219:2 › DBLink › should have same aria-snapshot ─────────────────────────
[firefox] › default.ts:79:2 › DBNotification › should match screenshot ─────────────────────────
[firefox] › default.ts:219:2 › DBNotification › should have same aria-snapshot ─────────────────
[firefox] › default.ts:79:2 › DBRadio › should match screenshot ────────────────────────────────
[firefox] › default.ts:79:2 › DBSelect › should match screenshot ───────────────────────────────
[firefox] › default.ts:219:2 › DBSelect › should have same aria-snapshot ───────────────────────
[firefox] › default.ts:79:2 › DBSwitch › should match screenshot ───────────────────────────────
[firefox] › default.ts:79:2 › DBTextarea › should match screenshot ─────────────────────────────
[webkit] › default.ts:79:2 › DBButton › should match screenshot ────────────────────────────────
[webkit] › default.ts:219:2 › DBButton › should have same aria-snapshot ────────────────────────
[webkit] › default.ts:79:2 › DBCheckbox › should match screenshot ──────────────────────────────
[webkit] › default.ts:79:2 › DBDrawer › should match screenshot ────────────────────────────────
[webkit] › default.ts:219:2 › DBDrawer › should have same aria-snapshot ────────────────────────
2 flaky
[webkit] › default.ts:79:2 › DBBrand › should match screenshot ─────────────────────────────────
[webkit] › default.ts:79:2 › DBCard › should match screenshot ──────────────────────────────────
57 skipped
68 passed (4.8m)
|
Loading