refactor(core): use Capacitor safe-area CSS variables on older WebViews #17770
thetaPCbuild.yml
on: pull_request
build-core
1m 35s
Matrix: test-core-screenshot
test-core-clean-build
13s
test-core-lint
54s
test-core-spec
54s
verify-screenshots
3s
Matrix: test-angular-e2e
Matrix: test-react-e2e
Matrix: test-react-router-e2e
Matrix: test-vue-e2e
verify-test-angular-e2e
2s
verify-test-react-e2e
2s
verify-test-react-router-e2e
2s
verify-test-vue-e2e
2s
Annotations
68 errors and 1 notice
|
[Mobile Chrome] › src/components/app/test/safe-area/app.e2e.ts:33:9 › app: safe-area - ionic/md/ltr/light › should not have visual regressions with toast:
src/components/app/test/safe-area/app.e2e.ts#L19
4) [Mobile Chrome] › src/components/app/test/safe-area/app.e2e.ts:33:9 › app: safe-area - ionic/md/ltr/light › should not have visual regressions with toast
Error: expect(page).toHaveScreenshot(expected) failed
77094 pixels (ratio 0.27 of all image pixels) are different.
Snapshot: app-toast-diff-ionic-md-ltr-light.png
Call log:
- Expect "toHaveScreenshot(app-toast-diff-ionic-md-ltr-light.png)" with timeout 5000ms
- verifying given screenshot expectation
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- 77094 pixels (ratio 0.27 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
- 77094 pixels (ratio 0.27 of all image pixels) are different.
17 | await page.waitForChanges();
18 |
> 19 | await expect(page).toHaveScreenshot(screenshot(`app-${screenshotModifier}-diff`));
| ^
20 | };
21 | test.beforeEach(async ({ page }) => {
22 | await page.goto(`/src/components/app/test/safe-area`, config);
at testOverlay (/ionic/src/components/app/test/safe-area/app.e2e.ts:19:26)
at /ionic/src/components/app/test/safe-area/app.e2e.ts:34:7
|
|
[Mobile Chrome] › src/components/app/test/safe-area/app.e2e.ts:30:9 › app: safe-area - ionic/md/ltr/light › should not have visual regressions with picker:
src/components/app/test/safe-area/app.e2e.ts#L19
3) [Mobile Chrome] › src/components/app/test/safe-area/app.e2e.ts:30:9 › app: safe-area - ionic/md/ltr/light › should not have visual regressions with picker
Retry #2 ───────────────────────────────────────────────────────────────────────────────────────
Error: expect(page).toHaveScreenshot(expected) failed
274789 pixels (ratio 0.97 of all image pixels) are different.
Snapshot: app-picker-diff-ionic-md-ltr-light.png
Call log:
- Expect "toHaveScreenshot(app-picker-diff-ionic-md-ltr-light.png)" with timeout 5000ms
- verifying given screenshot expectation
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- 274789 pixels (ratio 0.97 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
- 274789 pixels (ratio 0.97 of all image pixels) are different.
17 | await page.waitForChanges();
18 |
> 19 | await expect(page).toHaveScreenshot(screenshot(`app-${screenshotModifier}-diff`));
| ^
20 | };
21 | test.beforeEach(async ({ page }) => {
22 | await page.goto(`/src/components/app/test/safe-area`, config);
at testOverlay (/ionic/src/components/app/test/safe-area/app.e2e.ts:19:26)
at /ionic/src/components/app/test/safe-area/app.e2e.ts:31:7
|
|
[Mobile Chrome] › src/components/app/test/safe-area/app.e2e.ts:30:9 › app: safe-area - ionic/md/ltr/light › should not have visual regressions with picker:
src/components/app/test/safe-area/app.e2e.ts#L19
3) [Mobile Chrome] › src/components/app/test/safe-area/app.e2e.ts:30:9 › app: safe-area - ionic/md/ltr/light › should not have visual regressions with picker
Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
Error: expect(page).toHaveScreenshot(expected) failed
274789 pixels (ratio 0.97 of all image pixels) are different.
Snapshot: app-picker-diff-ionic-md-ltr-light.png
Call log:
- Expect "toHaveScreenshot(app-picker-diff-ionic-md-ltr-light.png)" with timeout 5000ms
- verifying given screenshot expectation
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- 274789 pixels (ratio 0.97 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
- 274789 pixels (ratio 0.97 of all image pixels) are different.
17 | await page.waitForChanges();
18 |
> 19 | await expect(page).toHaveScreenshot(screenshot(`app-${screenshotModifier}-diff`));
| ^
20 | };
21 | test.beforeEach(async ({ page }) => {
22 | await page.goto(`/src/components/app/test/safe-area`, config);
at testOverlay (/ionic/src/components/app/test/safe-area/app.e2e.ts:19:26)
at /ionic/src/components/app/test/safe-area/app.e2e.ts:31:7
|
|
[Mobile Chrome] › src/components/app/test/safe-area/app.e2e.ts:30:9 › app: safe-area - ionic/md/ltr/light › should not have visual regressions with picker:
src/components/app/test/safe-area/app.e2e.ts#L19
3) [Mobile Chrome] › src/components/app/test/safe-area/app.e2e.ts:30:9 › app: safe-area - ionic/md/ltr/light › should not have visual regressions with picker
Error: expect(page).toHaveScreenshot(expected) failed
274789 pixels (ratio 0.97 of all image pixels) are different.
Snapshot: app-picker-diff-ionic-md-ltr-light.png
Call log:
- Expect "toHaveScreenshot(app-picker-diff-ionic-md-ltr-light.png)" with timeout 5000ms
- verifying given screenshot expectation
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- 274789 pixels (ratio 0.97 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
- 274789 pixels (ratio 0.97 of all image pixels) are different.
17 | await page.waitForChanges();
18 |
> 19 | await expect(page).toHaveScreenshot(screenshot(`app-${screenshotModifier}-diff`));
| ^
20 | };
21 | test.beforeEach(async ({ page }) => {
22 | await page.goto(`/src/components/app/test/safe-area`, config);
at testOverlay (/ionic/src/components/app/test/safe-area/app.e2e.ts:19:26)
at /ionic/src/components/app/test/safe-area/app.e2e.ts:31:7
|
|
[Mobile Chrome] › src/components/app/test/safe-area/app.e2e.ts:27:9 › app: safe-area - ionic/md/ltr/light › should not have visual regressions with menu:
src/components/app/test/safe-area/app.e2e.ts#L19
2) [Mobile Chrome] › src/components/app/test/safe-area/app.e2e.ts:27:9 › app: safe-area - ionic/md/ltr/light › should not have visual regressions with menu
Retry #2 ───────────────────────────────────────────────────────────────────────────────────────
Error: expect(page).toHaveScreenshot(expected) failed
19133 pixels (ratio 0.07 of all image pixels) are different.
Snapshot: app-menu-diff-ionic-md-ltr-light.png
Call log:
- Expect "toHaveScreenshot(app-menu-diff-ionic-md-ltr-light.png)" with timeout 5000ms
- verifying given screenshot expectation
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- 19133 pixels (ratio 0.07 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
- 19133 pixels (ratio 0.07 of all image pixels) are different.
17 | await page.waitForChanges();
18 |
> 19 | await expect(page).toHaveScreenshot(screenshot(`app-${screenshotModifier}-diff`));
| ^
20 | };
21 | test.beforeEach(async ({ page }) => {
22 | await page.goto(`/src/components/app/test/safe-area`, config);
at testOverlay (/ionic/src/components/app/test/safe-area/app.e2e.ts:19:26)
at /ionic/src/components/app/test/safe-area/app.e2e.ts:28:7
|
|
[Mobile Chrome] › src/components/app/test/safe-area/app.e2e.ts:27:9 › app: safe-area - ionic/md/ltr/light › should not have visual regressions with menu:
src/components/app/test/safe-area/app.e2e.ts#L19
2) [Mobile Chrome] › src/components/app/test/safe-area/app.e2e.ts:27:9 › app: safe-area - ionic/md/ltr/light › should not have visual regressions with menu
Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
Error: expect(page).toHaveScreenshot(expected) failed
19133 pixels (ratio 0.07 of all image pixels) are different.
Snapshot: app-menu-diff-ionic-md-ltr-light.png
Call log:
- Expect "toHaveScreenshot(app-menu-diff-ionic-md-ltr-light.png)" with timeout 5000ms
- verifying given screenshot expectation
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- 19133 pixels (ratio 0.07 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
- 19133 pixels (ratio 0.07 of all image pixels) are different.
17 | await page.waitForChanges();
18 |
> 19 | await expect(page).toHaveScreenshot(screenshot(`app-${screenshotModifier}-diff`));
| ^
20 | };
21 | test.beforeEach(async ({ page }) => {
22 | await page.goto(`/src/components/app/test/safe-area`, config);
at testOverlay (/ionic/src/components/app/test/safe-area/app.e2e.ts:19:26)
at /ionic/src/components/app/test/safe-area/app.e2e.ts:28:7
|
|
[Mobile Chrome] › src/components/app/test/safe-area/app.e2e.ts:27:9 › app: safe-area - ionic/md/ltr/light › should not have visual regressions with menu:
src/components/app/test/safe-area/app.e2e.ts#L19
2) [Mobile Chrome] › src/components/app/test/safe-area/app.e2e.ts:27:9 › app: safe-area - ionic/md/ltr/light › should not have visual regressions with menu
Error: expect(page).toHaveScreenshot(expected) failed
19133 pixels (ratio 0.07 of all image pixels) are different.
Snapshot: app-menu-diff-ionic-md-ltr-light.png
Call log:
- Expect "toHaveScreenshot(app-menu-diff-ionic-md-ltr-light.png)" with timeout 5000ms
- verifying given screenshot expectation
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- 19133 pixels (ratio 0.07 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
- 19133 pixels (ratio 0.07 of all image pixels) are different.
17 | await page.waitForChanges();
18 |
> 19 | await expect(page).toHaveScreenshot(screenshot(`app-${screenshotModifier}-diff`));
| ^
20 | };
21 | test.beforeEach(async ({ page }) => {
22 | await page.goto(`/src/components/app/test/safe-area`, config);
at testOverlay (/ionic/src/components/app/test/safe-area/app.e2e.ts:19:26)
at /ionic/src/components/app/test/safe-area/app.e2e.ts:28:7
|
|
[Mobile Chrome] › src/components/app/test/safe-area/app.e2e.ts:24:9 › app: safe-area - ionic/md/ltr/light › should not have visual regressions with action sheet:
src/components/app/test/safe-area/app.e2e.ts#L19
1) [Mobile Chrome] › src/components/app/test/safe-area/app.e2e.ts:24:9 › app: safe-area - ionic/md/ltr/light › should not have visual regressions with action sheet
Retry #2 ───────────────────────────────────────────────────────────────────────────────────────
Error: expect(page).toHaveScreenshot(expected) failed
149942 pixels (ratio 0.53 of all image pixels) are different.
Snapshot: app-action-sheet-diff-ionic-md-ltr-light.png
Call log:
- Expect "toHaveScreenshot(app-action-sheet-diff-ionic-md-ltr-light.png)" with timeout 5000ms
- verifying given screenshot expectation
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- 149942 pixels (ratio 0.53 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
- 149942 pixels (ratio 0.53 of all image pixels) are different.
17 | await page.waitForChanges();
18 |
> 19 | await expect(page).toHaveScreenshot(screenshot(`app-${screenshotModifier}-diff`));
| ^
20 | };
21 | test.beforeEach(async ({ page }) => {
22 | await page.goto(`/src/components/app/test/safe-area`, config);
at testOverlay (/ionic/src/components/app/test/safe-area/app.e2e.ts:19:26)
at /ionic/src/components/app/test/safe-area/app.e2e.ts:25:7
|
|
[Mobile Chrome] › src/components/app/test/safe-area/app.e2e.ts:24:9 › app: safe-area - ionic/md/ltr/light › should not have visual regressions with action sheet:
src/components/app/test/safe-area/app.e2e.ts#L19
1) [Mobile Chrome] › src/components/app/test/safe-area/app.e2e.ts:24:9 › app: safe-area - ionic/md/ltr/light › should not have visual regressions with action sheet
Retry #1 ───────────────────────────────────────────────────────────────────────────────────────
Error: expect(page).toHaveScreenshot(expected) failed
149942 pixels (ratio 0.53 of all image pixels) are different.
Snapshot: app-action-sheet-diff-ionic-md-ltr-light.png
Call log:
- Expect "toHaveScreenshot(app-action-sheet-diff-ionic-md-ltr-light.png)" with timeout 5000ms
- verifying given screenshot expectation
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- 149942 pixels (ratio 0.53 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
- 149942 pixels (ratio 0.53 of all image pixels) are different.
17 | await page.waitForChanges();
18 |
> 19 | await expect(page).toHaveScreenshot(screenshot(`app-${screenshotModifier}-diff`));
| ^
20 | };
21 | test.beforeEach(async ({ page }) => {
22 | await page.goto(`/src/components/app/test/safe-area`, config);
at testOverlay (/ionic/src/components/app/test/safe-area/app.e2e.ts:19:26)
at /ionic/src/components/app/test/safe-area/app.e2e.ts:25:7
|
|
[Mobile Chrome] › src/components/app/test/safe-area/app.e2e.ts:24:9 › app: safe-area - ionic/md/ltr/light › should not have visual regressions with action sheet:
src/components/app/test/safe-area/app.e2e.ts#L19
1) [Mobile Chrome] › src/components/app/test/safe-area/app.e2e.ts:24:9 › app: safe-area - ionic/md/ltr/light › should not have visual regressions with action sheet
Error: expect(page).toHaveScreenshot(expected) failed
149942 pixels (ratio 0.53 of all image pixels) are different.
Snapshot: app-action-sheet-diff-ionic-md-ltr-light.png
Call log:
- Expect "toHaveScreenshot(app-action-sheet-diff-ionic-md-ltr-light.png)" with timeout 5000ms
- verifying given screenshot expectation
- taking page screenshot
- disabled all CSS animations
- waiting for fonts to load...
- fonts loaded
- 149942 pixels (ratio 0.53 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
- 149942 pixels (ratio 0.53 of all image pixels) are different.
17 | await page.waitForChanges();
18 |
> 19 | await expect(page).toHaveScreenshot(screenshot(`app-${screenshotModifier}-diff`));
| ^
20 | };
21 | test.beforeEach(async ({ page }) => {
22 | await page.goto(`/src/components/app/test/safe-area`, config);
at testOverlay (/ionic/src/components/app/test/safe-area/app.e2e.ts:19:26)
at /ionic/src/components/app/test/safe-area/app.e2e.ts:25:7
|
|
test-core-screenshot (20, 20)
The strategy configuration was canceled because "test-core-screenshot._7_20" failed
|
|
test-core-screenshot (20, 20)
Process completed with exit code 12.
|
|
test-core-screenshot (20, 20)
The operation was canceled.
|
|
test-core-screenshot (18, 20)
The strategy configuration was canceled because "test-core-screenshot._7_20" failed
|
|
test-core-screenshot (18, 20)
Process completed with exit code 12.
|
|
test-core-screenshot (18, 20)
The operation was canceled.
|
|
test-core-screenshot (16, 20)
The strategy configuration was canceled because "test-core-screenshot._7_20" failed
|
|
test-core-screenshot (16, 20)
Process completed with exit code 12.
|
|
test-core-screenshot (16, 20)
The operation was canceled.
|
|
test-core-screenshot (4, 20)
The strategy configuration was canceled because "test-core-screenshot._7_20" failed
|
|
test-core-screenshot (4, 20)
Process completed with exit code 12.
|
|
test-core-screenshot (4, 20)
The operation was canceled.
|
|
test-core-screenshot (2, 20)
The strategy configuration was canceled because "test-core-screenshot._7_20" failed
|
|
test-core-screenshot (2, 20)
Process completed with exit code 12.
|
|
test-core-screenshot (2, 20)
The operation was canceled.
|
|
test-core-screenshot (5, 20)
The strategy configuration was canceled because "test-core-screenshot._7_20" failed
|
|
test-core-screenshot (5, 20)
Process completed with exit code 12.
|
|
test-core-screenshot (5, 20)
The operation was canceled.
|
|
test-core-screenshot (19, 20)
The strategy configuration was canceled because "test-core-screenshot._7_20" failed
|
|
test-core-screenshot (19, 20)
Process completed with exit code 12.
|
|
test-core-screenshot (19, 20)
The operation was canceled.
|
|
test-core-screenshot (15, 20)
The strategy configuration was canceled because "test-core-screenshot._7_20" failed
|
|
test-core-screenshot (15, 20)
Process completed with exit code 12.
|
|
test-core-screenshot (15, 20)
The operation was canceled.
|
|
test-core-screenshot (6, 20)
The strategy configuration was canceled because "test-core-screenshot._7_20" failed
|
|
test-core-screenshot (1, 20)
The strategy configuration was canceled because "test-core-screenshot._7_20" failed
|
|
test-core-screenshot (6, 20)
Process completed with exit code 12.
|
|
test-core-screenshot (1, 20)
Process completed with exit code 12.
|
|
test-core-screenshot (6, 20)
The operation was canceled.
|
|
test-core-screenshot (1, 20)
The operation was canceled.
|
|
test-core-screenshot (8, 20)
The strategy configuration was canceled because "test-core-screenshot._7_20" failed
|
|
test-core-screenshot (8, 20)
Process completed with exit code 12.
|
|
test-core-screenshot (8, 20)
The operation was canceled.
|
|
test-core-screenshot (13, 20)
The strategy configuration was canceled because "test-core-screenshot._7_20" failed
|
|
test-core-screenshot (13, 20)
Process completed with exit code 12.
|
|
test-core-screenshot (13, 20)
The operation was canceled.
|
|
test-core-screenshot (12, 20)
The strategy configuration was canceled because "test-core-screenshot._7_20" failed
|
|
test-core-screenshot (12, 20)
Process completed with exit code 12.
|
|
test-core-screenshot (12, 20)
The operation was canceled.
|
|
test-core-screenshot (11, 20)
The strategy configuration was canceled because "test-core-screenshot._7_20" failed
|
|
test-core-screenshot (11, 20)
Process completed with exit code 12.
|
|
test-core-screenshot (11, 20)
The operation was canceled.
|
|
test-core-screenshot (3, 20)
The strategy configuration was canceled because "test-core-screenshot._7_20" failed
|
|
test-core-screenshot (3, 20)
Process completed with exit code 12.
|
|
test-core-screenshot (3, 20)
The operation was canceled.
|
|
test-core-screenshot (9, 20)
The strategy configuration was canceled because "test-core-screenshot._7_20" failed
|
|
test-core-screenshot (9, 20)
Process completed with exit code 12.
|
|
test-core-screenshot (9, 20)
The operation was canceled.
|
|
test-core-screenshot (17, 20)
The strategy configuration was canceled because "test-core-screenshot._7_20" failed
|
|
test-core-screenshot (10, 20)
The strategy configuration was canceled because "test-core-screenshot._7_20" failed
|
|
test-core-screenshot (10, 20)
Process completed with exit code 12.
|
|
test-core-screenshot (10, 20)
The operation was canceled.
|
|
test-core-screenshot (17, 20)
Process completed with exit code 12.
|
|
test-core-screenshot (17, 20)
The operation was canceled.
|
|
test-core-screenshot (14, 20)
The strategy configuration was canceled because "test-core-screenshot._7_20" failed
|
|
test-core-screenshot (14, 20)
Process completed with exit code 12.
|
|
test-core-screenshot (14, 20)
The operation was canceled.
|
|
verify-screenshots
Process completed with exit code 1.
|
|
🎭 Playwright Run Summary
4 failed
[Mobile Chrome] › src/components/app/test/safe-area/app.e2e.ts:24:9 › app: safe-area - ionic/md/ltr/light › should not have visual regressions with action sheet
[Mobile Chrome] › src/components/app/test/safe-area/app.e2e.ts:27:9 › app: safe-area - ionic/md/ltr/light › should not have visual regressions with menu
[Mobile Chrome] › src/components/app/test/safe-area/app.e2e.ts:30:9 › app: safe-area - ionic/md/ltr/light › should not have visual regressions with picker
[Mobile Chrome] › src/components/app/test/safe-area/app.e2e.ts:33:9 › app: safe-area - ionic/md/ltr/light › should not have visual regressions with toast
360 skipped
273 passed (2.5m)
|
Artifacts
Produced during runtime
| Name | Size | Digest | |
|---|---|---|---|
|
ionic-angular
|
805 KB |
sha256:b07974baac0fc043b5d802a9e5e24a5328bd1395adaf24ee15bbb095a6e25f9a
|
|
|
ionic-angular-server
|
8.55 KB |
sha256:0c5d031398cf3cdf65a396a57d1b4ea757222f131fa085b6fd6686ba56b2dcf9
|
|
|
ionic-core
|
5.15 MB |
sha256:eb045885698abc5ed24469d737642441351ef2676f4a69792a65270482dc06f5
|
|
|
ionic-react
|
343 KB |
sha256:ac1776d56108ecb48021de38d5825222186a265556884e16bd4382fa47e716c9
|
|
|
ionic-react-router
|
27.9 KB |
sha256:948ab86be989cb69fe91c2858e6b7e3882306c7be2e245c6c8b6f141ba35e532
|
|
|
ionic-vue
|
374 KB |
sha256:0e6df9843df488e6d8538036820801425e4336aa707b3f263b70326a741590d4
|
|
|
ionic-vue-router
|
17.1 KB |
sha256:629fde9bf5c2fd6db783dbc62352d16d85e7d910ae5c9f5ef32cc181ee2b2cc5
|
|
|
test-results-7-20
|
6.35 MB |
sha256:c80ccaf3e60bb71ad619e512d337d0a35a6c19f06cdac44cc573c4ffaa9df8c2
|
|