refactor: patternhub examples to align with figma props #15582
Annotations
11 errors, 2 warnings, and 1 notice
🔣 Print GitHub Report:
showcases/e2e/default.ts#L111
1) [chromium-highContrast] › default.ts:79:2 › DBRadio › should match screenshot ─────────────────
Error: expect(page).toHaveScreenshot(expected)
Expected an image 1280px by 2639px, received 1280px by 2965px. 431954 pixels (ratio 0.12 of all image pixels) are different.
Expected: /__w/mono/mono/__snapshots__/radio/showcase/chromium-highContrast/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-chromium-highContrast/DBRadio-should-match-screenshot-1-actual.png
Diff: /__w/mono/mono/showcases/stencil-showcase/test-results/radio-radio-snapshot-DBRadio-should-match-screenshot-chromium-highContrast/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 2639px, received 1280px by 2965px. 431954 pixels (ratio 0.12 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 2639px, received 1280px by 2965px. 431954 pixels (ratio 0.12 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) [chromium-highContrast] › default.ts:79:2 › DBRadio › should match screenshot ─────────────────
Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
Error: expect(page).toHaveScreenshot(expected)
Expected an image 1280px by 2639px, received 1280px by 2965px. 431954 pixels (ratio 0.12 of all image pixels) are different.
Expected: /__w/mono/mono/__snapshots__/radio/showcase/chromium-highContrast/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-chromium-highContrast-retry1/DBRadio-should-match-screenshot-1-actual.png
Diff: /__w/mono/mono/showcases/stencil-showcase/test-results/radio-radio-snapshot-DBRadio-should-match-screenshot-chromium-highContrast-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 2639px, received 1280px by 2965px. 431954 pixels (ratio 0.12 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 2639px, received 1280px by 2965px. 431954 pixels (ratio 0.12 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
2) [chromium-highContrast] › default.ts:79:2 › DBSelect › should match screenshot ────────────────
Error: expect(page).toHaveScreenshot(expected)
Expected an image 1280px by 2965px, received 1280px by 3943px. 1274693 pixels (ratio 0.26 of all image pixels) are different.
Expected: /__w/mono/mono/__snapshots__/select/showcase/chromium-highContrast/DBSelect-should-match-screenshot-1/DBSelect-should-match-screenshot.png
Received: /__w/mono/mono/showcases/stencil-showcase/test-results/select-select-snapshot-DBSelect-should-match-screenshot-chromium-highContrast/DBSelect-should-match-screenshot-1-actual.png
Diff: /__w/mono/mono/showcases/stencil-showcase/test-results/select-select-snapshot-DBSelect-should-match-screenshot-chromium-highContrast/DBSelect-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 2965px, received 1280px by 3943px. 1274693 pixels (ratio 0.26 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 2965px, received 1280px by 3943px. 1274693 pixels (ratio 0.26 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
2) [chromium-highContrast] › default.ts:79:2 › DBSelect › should match screenshot ────────────────
Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
Error: expect(page).toHaveScreenshot(expected)
Expected an image 1280px by 2965px, received 1280px by 3943px. 1274693 pixels (ratio 0.26 of all image pixels) are different.
Expected: /__w/mono/mono/__snapshots__/select/showcase/chromium-highContrast/DBSelect-should-match-screenshot-1/DBSelect-should-match-screenshot.png
Received: /__w/mono/mono/showcases/stencil-showcase/test-results/select-select-snapshot-DBSelect-should-match-screenshot-chromium-highContrast-retry1/DBSelect-should-match-screenshot-1-actual.png
Diff: /__w/mono/mono/showcases/stencil-showcase/test-results/select-select-snapshot-DBSelect-should-match-screenshot-chromium-highContrast-retry1/DBSelect-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 2965px, received 1280px by 3943px. 1274693 pixels (ratio 0.26 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 2965px, received 1280px by 3943px. 1274693 pixels (ratio 0.26 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
3) [chromium-highContrast] › default.ts:219:2 › DBSelect › should have same aria-snapshot ────────
Error: expect(string).toMatchSnapshot(expected)
- main:
- heading "DBSelect" [level=1]
- link "Density arrow_up_right\" / \""
- text: Label
- combobox "Label":
- option "Option 1"
- option "Option 2"
- text: Functional
- text: Functional
- status
- text: chevron_down" / " Label
- combobox "Label":
- option "Option 1"
- option "Option 2"
- text: (Default) Regular
- text: (Default) Regular
- status
- text: chevron_down" / " Label
- combobox "Label":
- option "Option 1"
- option "Option 2"
- text: Expressive
- text: Expressive
- status
- text: chevron_down" / "
- link "Variant Label arrow_up_right\" / \""
- text: Label
- combobox "Label":
- option "Option 1"
- option "Option 2"
- text: (Default) Label Above
- text: (Default) Label Above
- status
- text: chevron_down" / " Label
- combobox "Label":
- option "Floating Label" [selected]
- option "Option 2"
- text: Floating Label
- status
- text: chevron_down" / "
- link "Show Label arrow_up_right\" / \""
- text: Label
- combobox "Label":
- option "Option 1"
- option "Option 2"
- text: Hidd(Den Lfabeult) True
- text: Hidd(Den Lfabeult) True
- status
- text: chevron_down" / " Label
- combobox "Label":
- optionk "VarOptiaon 1"
- option H"Option 2"
- text: "Falpse"
- text: "False"
- status
- text: chevron_down" / "
- link "Show Message arrow_up_right\" / \""
- text: Label
- combobox "Label":
- option "Option 1"
- option "Option 2"
- text: (Default) BFalsice
- text: (Default) BFalse information_circle" / " Message
- status
- text: chevron_down" / " Label
- combobox "Label":
- option "Option 1"
- option "Option 2"
- text: Helpe"Tr Muessage"
- text: HelpeTr Muessage information_circle" / " Helper Message
- status
- text: chevron_down" / "
- link "States Label Above arrow_up_right\" / \""
- text: Label
- combobox "Label":
- option "Option 1"
- option "Option 2"
- text: (Default) Empty
- text: (Default) Empty
- status
- text: chevron_down" / " Label
- combobox "Label":
- option "Filled" [selected]
- option "Option 2"
- text: Filled
- status
- text: chevron_down" / "
- link "Validation arrow_up_right\" / \""
- text: Label
- combobox "Label" [disabled]:
- option "Option 1"
- option "Option 2"
- text: (Disefabulet) No validation
- text: (Disefabulet) No validation
- status
- text: chevron_down" / " Label
- combobox "Label":
- optionk "SOptatesion Fl1"
- oaptiong Lab"Option 2"
- telxt: Invarrow_up_rlighd
- t\"ext: /Invalid
\"" - status
- text: chevron_down" / " Label
- combobox "Label":
- option "OptValion 1d"
- option "Option 2"
- text: (DefVault) Emptyid
- text: (DefVault) Emptyid
- status
- text: chevron_down" / "
- link "Disabled arrow_up_right\" / \""
- text: Label
- combobox "Label":
- option "FOptilled"on [selected]1"
- option "Option 2"
- text: (Default) Fialse
- text: (Default) Falsed
- status
- text: chevron_down" / " Label
- combobox "Label" [disabled]:
- option "DOptisabled"on [selected]1"
- option "Option 2"
- text: D
|
🔣 Print GitHub Report:
showcases/e2e/default.ts#L229
3) [chromium-highContrast] › default.ts:219:2 › DBSelect › should have same aria-snapshot ────────
Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
Error: expect(string).toMatchSnapshot(expected)
- main:
- heading "DBSelect" [level=1]
- link "Density arrow_up_right\" / \""
- text: Label
- combobox "Label":
- option "Option 1"
- option "Option 2"
- text: Functional
- text: Functional
- status
- text: chevron_down" / " Label
- combobox "Label":
- option "Option 1"
- option "Option 2"
- text: (Default) Regular
- text: (Default) Regular
- status
- text: chevron_down" / " Label
- combobox "Label":
- option "Option 1"
- option "Option 2"
- text: Expressive
- text: Expressive
- status
- text: chevron_down" / "
- link "Variant Label arrow_up_right\" / \""
- text: Label
- combobox "Label":
- option "Option 1"
- option "Option 2"
- text: (Default) Label Above
- text: (Default) Label Above
- status
- text: chevron_down" / " Label
- combobox "Label":
- option "Floating Label" [selected]
- option "Option 2"
- text: Floating Label
- status
- text: chevron_down" / "
- link "Show Label arrow_up_right\" / \""
- text: Label
- combobox "Label":
- option "Option 1"
- option "Option 2"
- text: Hidd(Den Lfabeult) True
- text: Hidd(Den Lfabeult) True
- status
- text: chevron_down" / " Label
- combobox "Label":
- optionk "VarOptiaon 1"
- option H"Option 2"
- text: "Falpse"
- text: "False"
- status
- text: chevron_down" / "
- link "Show Message arrow_up_right\" / \""
- text: Label
- combobox "Label":
- option "Option 1"
- option "Option 2"
- text: (Default) BFalsice
- text: (Default) BFalse information_circle" / " Message
- status
- text: chevron_down" / " Label
- combobox "Label":
- option "Option 1"
- option "Option 2"
- text: Helpe"Tr Muessage"
- text: HelpeTr Muessage information_circle" / " Helper Message
- status
- text: chevron_down" / "
- link "States Label Above arrow_up_right\" / \""
- text: Label
- combobox "Label":
- option "Option 1"
- option "Option 2"
- text: (Default) Empty
- text: (Default) Empty
- status
- text: chevron_down" / " Label
- combobox "Label":
- option "Filled" [selected]
- option "Option 2"
- text: Filled
- status
- text: chevron_down" / "
- link "Validation arrow_up_right\" / \""
- text: Label
- combobox "Label" [disabled]:
- option "Option 1"
- option "Option 2"
- text: (Disefabulet) No validation
- text: (Disefabulet) No validation
- status
- text: chevron_down" / " Label
- combobox "Label":
- optionk "SOptatesion Fl1"
- oaptiong Lab"Option 2"
- telxt: Invarrow_up_rlighd
- t\"ext: /Invalid
\"" - status
- text: chevron_down" / " Label
- combobox "Label":
- option "OptValion 1d"
- option "Option 2"
- text: (DefVault) Emptyid
- text: (DefVault) Emptyid
- status
- text: chevron_down" / "
- link "Disabled arrow_up_right\" / \""
- text: Label
- combobox "Label":
- option "FOptilled"on [selected]1"
- option "Option 2"
- text: (Default) Fialse
- text: (Default) Falsed
- status
- text: chevron_down" / " Label
- combobox "Label" [disabl
|
🔣 Print GitHub Report:
showcases/e2e/default.ts#L111
4) [chromium-highContrast] › default.ts:79:2 › DBSwitch › should match screenshot ────────────────
Error: expect(page).toHaveScreenshot(expected)
Expected an image 1280px by 2965px, received 1280px by 3617px. 856701 pixels (ratio 0.19 of all image pixels) are different.
Expected: /__w/mono/mono/__snapshots__/switch/showcase/chromium-highContrast/DBSwitch-should-match-screenshot-1/DBSwitch-should-match-screenshot.png
Received: /__w/mono/mono/showcases/stencil-showcase/test-results/switch-switch-snapshot-DBSwitch-should-match-screenshot-chromium-highContrast/DBSwitch-should-match-screenshot-1-actual.png
Diff: /__w/mono/mono/showcases/stencil-showcase/test-results/switch-switch-snapshot-DBSwitch-should-match-screenshot-chromium-highContrast/DBSwitch-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 2965px, received 1280px by 3617px. 856698 pixels (ratio 0.19 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 2965px, received 1280px by 3617px. 856701 pixels (ratio 0.19 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
4) [chromium-highContrast] › default.ts:79:2 › DBSwitch › should match screenshot ────────────────
Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
Error: expect(page).toHaveScreenshot(expected)
Expected an image 1280px by 2965px, received 1280px by 3617px. 856701 pixels (ratio 0.19 of all image pixels) are different.
Expected: /__w/mono/mono/__snapshots__/switch/showcase/chromium-highContrast/DBSwitch-should-match-screenshot-1/DBSwitch-should-match-screenshot.png
Received: /__w/mono/mono/showcases/stencil-showcase/test-results/switch-switch-snapshot-DBSwitch-should-match-screenshot-chromium-highContrast-retry1/DBSwitch-should-match-screenshot-1-actual.png
Diff: /__w/mono/mono/showcases/stencil-showcase/test-results/switch-switch-snapshot-DBSwitch-should-match-screenshot-chromium-highContrast-retry1/DBSwitch-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 2965px, received 1280px by 3617px. 856698 pixels (ratio 0.19 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 2965px, received 1280px by 3617px. 856701 pixels (ratio 0.19 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) [chromium-highContrast] › default.ts:79:2 › DBTextarea › should match screenshot ──────────────
Error: expect(page).toHaveScreenshot(expected)
Expected an image 1280px by 2985px, received 1280px by 4289px. 1683323 pixels (ratio 0.31 of all image pixels) are different.
Expected: /__w/mono/mono/__snapshots__/textarea/showcase/chromium-highContrast/DBTextarea-should-match-screenshot-1/DBTextarea-should-match-screenshot.png
Received: /__w/mono/mono/showcases/stencil-showcase/test-results/textarea-textarea-snapshot-5a791-rea-should-match-screenshot-chromium-highContrast/DBTextarea-should-match-screenshot-1-actual.png
Diff: /__w/mono/mono/showcases/stencil-showcase/test-results/textarea-textarea-snapshot-5a791-rea-should-match-screenshot-chromium-highContrast/DBTextarea-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 2985px, received 1280px by 4289px. 1683323 pixels (ratio 0.31 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 2985px, received 1280px by 4289px. 1683323 pixels (ratio 0.31 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) [chromium-highContrast] › default.ts:79:2 › DBTextarea › should match screenshot ──────────────
Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
Error: expect(page).toHaveScreenshot(expected)
Expected an image 1280px by 2985px, received 1280px by 4289px. 1683323 pixels (ratio 0.31 of all image pixels) are different.
Expected: /__w/mono/mono/__snapshots__/textarea/showcase/chromium-highContrast/DBTextarea-should-match-screenshot-1/DBTextarea-should-match-screenshot.png
Received: /__w/mono/mono/showcases/stencil-showcase/test-results/textarea-textarea-snapshot-5a791-rea-should-match-screenshot-chromium-highContrast-retry1/DBTextarea-should-match-screenshot-1-actual.png
Diff: /__w/mono/mono/showcases/stencil-showcase/test-results/textarea-textarea-snapshot-5a791-rea-should-match-screenshot-chromium-highContrast-retry1/DBTextarea-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 2985px, received 1280px by 4289px. 1683323 pixels (ratio 0.31 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 2985px, received 1280px by 4289px. 1683323 pixels (ratio 0.31 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
|
👩🔬 Test showcase with Playwright 🎭
Process completed with exit code 1.
|
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
[chromium-highContrast] › default.ts:79:2 › DBRadio › should match screenshot ──────────────────
[chromium-highContrast] › default.ts:79:2 › DBSelect › should match screenshot ─────────────────
[chromium-highContrast] › default.ts:219:2 › DBSelect › should have same aria-snapshot ─────────
[chromium-highContrast] › default.ts:79:2 › DBSwitch › should match screenshot ─────────────────
[chromium-highContrast] › default.ts:79:2 › DBTextarea › should match screenshot ───────────────
[firefox] › default.ts:79:2 › DBButton › should match screenshot ───────────────────────────────
[firefox] › default.ts:219:2 › DBButton › should have same aria-snapshot ───────────────────────
[firefox] › default.ts:79:2 › DBCheckbox › should match screenshot ─────────────────────────────
[firefox] › default.ts:79:2 › DBDrawer › should match screenshot ───────────────────────────────
[firefox] › default.ts:219:2 › DBDrawer › should have same aria-snapshot ───────────────────────
[firefox] › default.ts:79:2 › DBInfotext › should match screenshot ─────────────────────────────
[firefox] › default.ts:219:2 › DBInfotext › should have same aria-snapshot ─────────────────────
[firefox] › default.ts:79:2 › DBInput › should match screenshot ────────────────────────────────
[firefox] › default.ts:219:2 › DBInput › should have same aria-snapshot ────────────────────────
40 skipped
87 passed (4.9m)
|
Loading