Skip to content

feat(checkbox): display as block when justify or alignment properties are defined #14341

feat(checkbox): display as block when justify or alignment properties are defined

feat(checkbox): display as block when justify or alignment properties are defined #14341

Triggered via pull request August 22, 2024 19:52
Status Failure
Total duration 7m 44s
Artifacts 13

build.yml

on: pull_request
build-react
56s
build-react
build-vue
41s
build-vue
Matrix: test-core-screenshot
build-angular
1m 4s
build-angular
build-angular-server
41s
build-angular-server
test-core-clean-build
8s
test-core-clean-build
test-core-lint
57s
test-core-lint
test-core-spec
56s
test-core-spec
build-react-router
28s
build-react-router
build-vue-router
53s
build-vue-router
verify-screenshots
0s
verify-screenshots
Matrix: test-angular-e2e
Matrix: test-react-e2e
Matrix: test-react-router-e2e
Matrix: test-vue-e2e
verify-test-angular-e2e
0s
verify-test-angular-e2e
verify-test-react-e2e
0s
verify-test-react-e2e
verify-test-react-router-e2e
0s
verify-test-react-router-e2e
verify-test-vue-e2e
0s
verify-test-vue-e2e
Fit to window
Zoom out
Zoom in

Annotations

23 errors and 6 notices
[Mobile Chrome] › src/components/alert/test/basic/alert.e2e.ts:105:9 › should not have visual regressions - ios/rtl › more than two buttons: src/components/alert/test/basic/alert.e2e.ts#L133
1) [Mobile Chrome] › src/components/alert/test/basic/alert.e2e.ts:105:9 › should not have visual regressions - ios/rtl › more than two buttons Error: Screenshot comparison failed: 132 pixels (ratio 0.01 of all image pixels) are different. Expected: /ionic/src/components/alert/test/basic/alert.e2e.ts-snapshots/alert-multipleButtons-ios-rtl-Mobile-Chrome-linux.png Received: /ionic/test-results/src-components-alert-test--e2f6b-s-rtl-more-than-two-buttons-Mobile-Chrome/alert-multipleButtons-ios-rtl-actual.png Diff: /ionic/test-results/src-components-alert-test--e2f6b-s-rtl-more-than-two-buttons-Mobile-Chrome/alert-multipleButtons-ios-rtl-diff.png Call log: - expect.toHaveScreenshot(alert-multipleButtons-ios-rtl.png) with timeout 5000ms - verifying given screenshot expectation - waiting for locator('ion-alert') - locator resolved to <ion-alert tabindex="-1" header="Alert" is-open="true" aria-modal="true" id="ion-overlay-1" role="alertdialog" sub-header="Subtitle" aria-labelledby="alert-1-hdr" aria-describedby="alert-1-msg" message="This is an alert message." class="sc-ion-alert-ios-h sc-ion-alert-ios-s ios overlay-hidden hydrated">…</ion-alert> - taking element screenshot - disabled all CSS animations - waiting for fonts to load... - fonts loaded - attempting scroll into view action - waiting for element to be stable - 229584 pixels (ratio 0.81 of all image pixels) are different. - waiting 100ms before taking screenshot - waiting for locator('ion-alert') - locator resolved to <ion-alert tabindex="-1" header="Alert" is-open="true" aria-modal="true" id="ion-overlay-1" role="alertdialog" sub-header="Subtitle" aria-labelledby="alert-2-hdr" aria-describedby="alert-2-msg" message="This is an alert message." class="sc-ion-alert-ios-h sc-ion-alert-ios-s ios hydrated">…</ion-alert> - taking element screenshot - disabled all CSS animations - waiting for fonts to load... - fonts loaded - attempting scroll into view action - waiting for element to be stable - 229548 pixels (ratio 0.81 of all image pixels) are different. - waiting 250ms before taking screenshot - waiting for locator('ion-alert') - locator resolved to <ion-alert tabindex="-1" header="Alert" is-open="true" aria-modal="true" id="ion-overlay-1" role="alertdialog" sub-header="Subtitle" aria-labelledby="alert-2-hdr" aria-describedby="alert-2-msg" message="This is an alert message." class="sc-ion-alert-ios-h sc-ion-alert-ios-s ios hydrated">…</ion-alert> - taking element screenshot - disabled all CSS animations - waiting for fonts to load... - fonts loaded - attempting scroll into view action - waiting for element to be stable - captured a stable screenshot - 132 pixels (ratio 0.01 of all image pixels) are different. 131 | const alert = page.locator('ion-alert'); 132 | > 133 | await expect(alert).toHaveScreenshot(screenshot(`alert-multipleButtons`)); | ^ 134 | }); 135 | }); 136 | }); at /ionic/src/components/alert/test/basic/alert.e2e.ts:133:27
[Mobile Chrome] › src/components/checkbox/test/a11y/checkbox.e2e.ts:31:11 › checkbox: a11y - ios/ltr › checkbox: font scaling - ios/ltr › should scale text on larger font sizes: src/components/checkbox/test/a11y/checkbox.e2e.ts#L45
1) [Mobile Chrome] › src/components/checkbox/test/a11y/checkbox.e2e.ts:31:11 › checkbox: a11y - ios/ltr › checkbox: font scaling - ios/ltr › should scale text on larger font sizes Error: Screenshot comparison failed: Expected an image 277px by 59px, received 393px by 59px. Expected: /ionic/src/components/checkbox/test/a11y/checkbox.e2e.ts-snapshots/checkbox-scale-ios-ltr-Mobile-Chrome-linux.png Received: /ionic/test-results/src-components-checkbox-te-23868-e-text-on-larger-font-sizes-Mobile-Chrome/checkbox-scale-ios-ltr-actual.png Diff: /ionic/test-results/src-components-checkbox-te-23868-e-text-on-larger-font-sizes-Mobile-Chrome/checkbox-scale-ios-ltr-diff.png Call log: - expect.toHaveScreenshot(checkbox-scale-ios-ltr.png) with timeout 5000ms - verifying given screenshot expectation - waiting for locator('ion-checkbox') - locator resolved to <ion-checkbox checked justify="start" aria-checked="true" class="ios checkbox-checked interactive checkbox-justify-start checkbox-alignment-center checkbox-label-placement-start hydrated">…</ion-checkbox> - taking element screenshot - disabled all CSS animations - waiting for fonts to load... - fonts loaded - attempting scroll into view action - waiting for element to be stable - Expected an image 277px by 59px, received 393px by 59px. - waiting 100ms before taking screenshot - waiting for locator('ion-checkbox') - locator resolved to <ion-checkbox checked justify="start" aria-checked="true" class="ios checkbox-checked interactive checkbox-justify-start checkbox-alignment-center checkbox-label-placement-start hydrated">…</ion-checkbox> - taking element screenshot - disabled all CSS animations - waiting for fonts to load... - fonts loaded - attempting scroll into view action - waiting for element to be stable - captured a stable screenshot - Expected an image 277px by 59px, received 393px by 59px. 43 | 44 | const checkbox = page.locator('ion-checkbox'); > 45 | await expect(checkbox).toHaveScreenshot(screenshot('checkbox-scale')); | ^ 46 | }); 47 | }); 48 | }); at /ionic/src/components/checkbox/test/a11y/checkbox.e2e.ts:45:32
[Mobile Chrome] › src/components/checkbox/test/a11y/checkbox.e2e.ts:31:11 › checkbox: a11y - ios/ltr › checkbox: font scaling - ios/ltr › should scale text on larger font sizes: src/components/checkbox/test/a11y/checkbox.e2e.ts#L45
1) [Mobile Chrome] › src/components/checkbox/test/a11y/checkbox.e2e.ts:31:11 › checkbox: a11y - ios/ltr › checkbox: font scaling - ios/ltr › should scale text on larger font sizes Retry #1 ─────────────────────────────────────────────────────────────────────────────────────── Error: Screenshot comparison failed: Expected an image 277px by 59px, received 393px by 59px. Expected: /ionic/src/components/checkbox/test/a11y/checkbox.e2e.ts-snapshots/checkbox-scale-ios-ltr-Mobile-Chrome-linux.png Received: /ionic/test-results/src-components-checkbox-te-23868-e-text-on-larger-font-sizes-Mobile-Chrome-retry1/checkbox-scale-ios-ltr-actual.png Diff: /ionic/test-results/src-components-checkbox-te-23868-e-text-on-larger-font-sizes-Mobile-Chrome-retry1/checkbox-scale-ios-ltr-diff.png Call log: - expect.toHaveScreenshot(checkbox-scale-ios-ltr.png) with timeout 5000ms - verifying given screenshot expectation - waiting for locator('ion-checkbox') - locator resolved to <ion-checkbox checked justify="start" aria-checked="true" class="ios checkbox-checked interactive checkbox-justify-start checkbox-alignment-center checkbox-label-placement-start hydrated">…</ion-checkbox> - taking element screenshot - disabled all CSS animations - waiting for fonts to load... - fonts loaded - attempting scroll into view action - waiting for element to be stable - Expected an image 277px by 59px, received 393px by 59px. - waiting 100ms before taking screenshot - waiting for locator('ion-checkbox') - locator resolved to <ion-checkbox checked justify="start" aria-checked="true" class="ios checkbox-checked interactive checkbox-justify-start checkbox-alignment-center checkbox-label-placement-start hydrated">…</ion-checkbox> - taking element screenshot - disabled all CSS animations - waiting for fonts to load... - fonts loaded - attempting scroll into view action - waiting for element to be stable - captured a stable screenshot - Expected an image 277px by 59px, received 393px by 59px. 43 | 44 | const checkbox = page.locator('ion-checkbox'); > 45 | await expect(checkbox).toHaveScreenshot(screenshot('checkbox-scale')); | ^ 46 | }); 47 | }); 48 | }); at /ionic/src/components/checkbox/test/a11y/checkbox.e2e.ts:45:32
[Mobile Chrome] › src/components/checkbox/test/a11y/checkbox.e2e.ts:31:11 › checkbox: a11y - ios/ltr › checkbox: font scaling - ios/ltr › should scale text on larger font sizes: src/components/checkbox/test/a11y/checkbox.e2e.ts#L45
1) [Mobile Chrome] › src/components/checkbox/test/a11y/checkbox.e2e.ts:31:11 › checkbox: a11y - ios/ltr › checkbox: font scaling - ios/ltr › should scale text on larger font sizes Retry #2 ─────────────────────────────────────────────────────────────────────────────────────── Error: Screenshot comparison failed: Expected an image 277px by 59px, received 393px by 59px. Expected: /ionic/src/components/checkbox/test/a11y/checkbox.e2e.ts-snapshots/checkbox-scale-ios-ltr-Mobile-Chrome-linux.png Received: /ionic/test-results/src-components-checkbox-te-23868-e-text-on-larger-font-sizes-Mobile-Chrome-retry2/checkbox-scale-ios-ltr-actual.png Diff: /ionic/test-results/src-components-checkbox-te-23868-e-text-on-larger-font-sizes-Mobile-Chrome-retry2/checkbox-scale-ios-ltr-diff.png Call log: - expect.toHaveScreenshot(checkbox-scale-ios-ltr.png) with timeout 5000ms - verifying given screenshot expectation - waiting for locator('ion-checkbox') - locator resolved to <ion-checkbox checked justify="start" aria-checked="true" class="ios checkbox-checked interactive checkbox-justify-start checkbox-alignment-center checkbox-label-placement-start hydrated">…</ion-checkbox> - taking element screenshot - disabled all CSS animations - waiting for fonts to load... - fonts loaded - attempting scroll into view action - waiting for element to be stable - Expected an image 277px by 59px, received 393px by 59px. - waiting 100ms before taking screenshot - waiting for locator('ion-checkbox') - locator resolved to <ion-checkbox checked justify="start" aria-checked="true" class="ios checkbox-checked interactive checkbox-justify-start checkbox-alignment-center checkbox-label-placement-start hydrated">…</ion-checkbox> - taking element screenshot - disabled all CSS animations - waiting for fonts to load... - fonts loaded - attempting scroll into view action - waiting for element to be stable - captured a stable screenshot - Expected an image 277px by 59px, received 393px by 59px. 43 | 44 | const checkbox = page.locator('ion-checkbox'); > 45 | await expect(checkbox).toHaveScreenshot(screenshot('checkbox-scale')); | ^ 46 | }); 47 | }); 48 | }); at /ionic/src/components/checkbox/test/a11y/checkbox.e2e.ts:45:32
[Mobile Chrome] › src/components/checkbox/test/a11y/checkbox.e2e.ts:31:11 › checkbox: a11y - md/ltr › checkbox: font scaling - md/ltr › should scale text on larger font sizes: src/components/checkbox/test/a11y/checkbox.e2e.ts#L45
2) [Mobile Chrome] › src/components/checkbox/test/a11y/checkbox.e2e.ts:31:11 › checkbox: a11y - md/ltr › checkbox: font scaling - md/ltr › should scale text on larger font sizes Error: Screenshot comparison failed: Expected an image 226px by 58px, received 393px by 58px. Expected: /ionic/src/components/checkbox/test/a11y/checkbox.e2e.ts-snapshots/checkbox-scale-md-ltr-Mobile-Chrome-linux.png Received: /ionic/test-results/src-components-checkbox-te-73959-e-text-on-larger-font-sizes-Mobile-Chrome/checkbox-scale-md-ltr-actual.png Diff: /ionic/test-results/src-components-checkbox-te-73959-e-text-on-larger-font-sizes-Mobile-Chrome/checkbox-scale-md-ltr-diff.png Call log: - expect.toHaveScreenshot(checkbox-scale-md-ltr.png) with timeout 5000ms - verifying given screenshot expectation - waiting for locator('ion-checkbox') - locator resolved to <ion-checkbox checked justify="start" aria-checked="true" class="md checkbox-checked interactive checkbox-justify-start checkbox-alignment-center checkbox-label-placement-start hydrated">…</ion-checkbox> - taking element screenshot - disabled all CSS animations - waiting for fonts to load... - fonts loaded - attempting scroll into view action - waiting for element to be stable - Expected an image 226px by 58px, received 393px by 58px. - waiting 100ms before taking screenshot - waiting for locator('ion-checkbox') - locator resolved to <ion-checkbox checked justify="start" aria-checked="true" class="md checkbox-checked interactive checkbox-justify-start checkbox-alignment-center checkbox-label-placement-start hydrated">…</ion-checkbox> - taking element screenshot - disabled all CSS animations - waiting for fonts to load... - fonts loaded - attempting scroll into view action - waiting for element to be stable - captured a stable screenshot - Expected an image 226px by 58px, received 393px by 58px. 43 | 44 | const checkbox = page.locator('ion-checkbox'); > 45 | await expect(checkbox).toHaveScreenshot(screenshot('checkbox-scale')); | ^ 46 | }); 47 | }); 48 | }); at /ionic/src/components/checkbox/test/a11y/checkbox.e2e.ts:45:32
[Mobile Chrome] › src/components/checkbox/test/a11y/checkbox.e2e.ts:31:11 › checkbox: a11y - md/ltr › checkbox: font scaling - md/ltr › should scale text on larger font sizes: src/components/checkbox/test/a11y/checkbox.e2e.ts#L45
2) [Mobile Chrome] › src/components/checkbox/test/a11y/checkbox.e2e.ts:31:11 › checkbox: a11y - md/ltr › checkbox: font scaling - md/ltr › should scale text on larger font sizes Retry #1 ─────────────────────────────────────────────────────────────────────────────────────── Error: Screenshot comparison failed: Expected an image 226px by 58px, received 393px by 58px. Expected: /ionic/src/components/checkbox/test/a11y/checkbox.e2e.ts-snapshots/checkbox-scale-md-ltr-Mobile-Chrome-linux.png Received: /ionic/test-results/src-components-checkbox-te-73959-e-text-on-larger-font-sizes-Mobile-Chrome-retry1/checkbox-scale-md-ltr-actual.png Diff: /ionic/test-results/src-components-checkbox-te-73959-e-text-on-larger-font-sizes-Mobile-Chrome-retry1/checkbox-scale-md-ltr-diff.png Call log: - expect.toHaveScreenshot(checkbox-scale-md-ltr.png) with timeout 5000ms - verifying given screenshot expectation - waiting for locator('ion-checkbox') - locator resolved to <ion-checkbox checked justify="start" aria-checked="true" class="md checkbox-checked interactive checkbox-justify-start checkbox-alignment-center checkbox-label-placement-start hydrated">…</ion-checkbox> - taking element screenshot - disabled all CSS animations - waiting for fonts to load... - fonts loaded - attempting scroll into view action - waiting for element to be stable - Expected an image 226px by 58px, received 393px by 58px. - waiting 100ms before taking screenshot - waiting for locator('ion-checkbox') - locator resolved to <ion-checkbox checked justify="start" aria-checked="true" class="md checkbox-checked interactive checkbox-justify-start checkbox-alignment-center checkbox-label-placement-start hydrated">…</ion-checkbox> - taking element screenshot - disabled all CSS animations - waiting for fonts to load... - fonts loaded - attempting scroll into view action - waiting for element to be stable - captured a stable screenshot - Expected an image 226px by 58px, received 393px by 58px. 43 | 44 | const checkbox = page.locator('ion-checkbox'); > 45 | await expect(checkbox).toHaveScreenshot(screenshot('checkbox-scale')); | ^ 46 | }); 47 | }); 48 | }); at /ionic/src/components/checkbox/test/a11y/checkbox.e2e.ts:45:32
[Mobile Chrome] › src/components/checkbox/test/a11y/checkbox.e2e.ts:31:11 › checkbox: a11y - md/ltr › checkbox: font scaling - md/ltr › should scale text on larger font sizes: src/components/checkbox/test/a11y/checkbox.e2e.ts#L45
2) [Mobile Chrome] › src/components/checkbox/test/a11y/checkbox.e2e.ts:31:11 › checkbox: a11y - md/ltr › checkbox: font scaling - md/ltr › should scale text on larger font sizes Retry #2 ─────────────────────────────────────────────────────────────────────────────────────── Error: Screenshot comparison failed: Expected an image 226px by 58px, received 393px by 58px. Expected: /ionic/src/components/checkbox/test/a11y/checkbox.e2e.ts-snapshots/checkbox-scale-md-ltr-Mobile-Chrome-linux.png Received: /ionic/test-results/src-components-checkbox-te-73959-e-text-on-larger-font-sizes-Mobile-Chrome-retry2/checkbox-scale-md-ltr-actual.png Diff: /ionic/test-results/src-components-checkbox-te-73959-e-text-on-larger-font-sizes-Mobile-Chrome-retry2/checkbox-scale-md-ltr-diff.png Call log: - expect.toHaveScreenshot(checkbox-scale-md-ltr.png) with timeout 5000ms - verifying given screenshot expectation - waiting for locator('ion-checkbox') - locator resolved to <ion-checkbox checked justify="start" aria-checked="true" class="md checkbox-checked interactive checkbox-justify-start checkbox-alignment-center checkbox-label-placement-start hydrated">…</ion-checkbox> - taking element screenshot - disabled all CSS animations - waiting for fonts to load... - fonts loaded - attempting scroll into view action - waiting for element to be stable - Expected an image 226px by 58px, received 393px by 58px. - waiting 100ms before taking screenshot - waiting for locator('ion-checkbox') - locator resolved to <ion-checkbox checked justify="start" aria-checked="true" class="md checkbox-checked interactive checkbox-justify-start checkbox-alignment-center checkbox-label-placement-start hydrated">…</ion-checkbox> - taking element screenshot - disabled all CSS animations - waiting for fonts to load... - fonts loaded - attempting scroll into view action - waiting for element to be stable - captured a stable screenshot - Expected an image 226px by 58px, received 393px by 58px. 43 | 44 | const checkbox = page.locator('ion-checkbox'); > 45 | await expect(checkbox).toHaveScreenshot(screenshot('checkbox-scale')); | ^ 46 | }); 47 | }); 48 | }); at /ionic/src/components/checkbox/test/a11y/checkbox.e2e.ts:45:32
test-core-screenshot (8, 20)
Process completed with exit code 1.
test-core-screenshot (10, 20)
The job was canceled because "_8_20" failed.
test-core-screenshot (13, 20)
The job was canceled because "_8_20" failed.
test-core-screenshot (4, 20)
The job was canceled because "_8_20" failed.
test-core-screenshot (17, 20)
The job was canceled because "_8_20" failed.
test-core-screenshot (3, 20)
The job was canceled because "_8_20" failed.
test-core-screenshot (14, 20)
The job was canceled because "_8_20" failed.
test-core-screenshot (18, 20)
The job was canceled because "_8_20" failed.
test-core-screenshot (16, 20)
The job was canceled because "_8_20" failed.
test-core-screenshot (1, 20)
The job was canceled because "_8_20" failed.
test-core-screenshot (6, 20)
The job was canceled because "_8_20" failed.
test-core-screenshot (15, 20)
The job was canceled because "_8_20" failed.
test-core-screenshot (19, 20)
The job was canceled because "_8_20" failed.
test-core-screenshot (2, 20)
The job was canceled because "_8_20" failed.
test-core-screenshot (5, 20)
The job was canceled because "_8_20" failed.
verify-screenshots
Process completed with exit code 1.
🎭 Playwright Run Summary
1 flaky [Mobile Chrome] › src/components/alert/test/basic/alert.e2e.ts:105:9 › should not have visual regressions - ios/rtl › more than two buttons 214 skipped 226 passed (2.4m)
🎭 Playwright Run Summary
212 skipped 198 passed (2.6m)
🎭 Playwright Run Summary
2 skipped 422 passed (2.8m)
🎭 Playwright Run Summary
7 skipped 440 passed (3.3m)
🎭 Playwright Run Summary
3 skipped 446 passed (3.4m)
🎭 Playwright Run Summary
2 failed [Mobile Chrome] › src/components/checkbox/test/a11y/checkbox.e2e.ts:31:11 › checkbox: a11y - ios/ltr › checkbox: font scaling - ios/ltr › should scale text on larger font sizes [Mobile Chrome] › src/components/checkbox/test/a11y/checkbox.e2e.ts:31:11 › checkbox: a11y - md/ltr › checkbox: font scaling - md/ltr › should scale text on larger font sizes 436 passed (3.5m)

Artifacts

Produced during runtime
Name Size
ionic-angular Expired
629 KB
ionic-angular-server Expired
8.55 KB
ionic-core Expired
4.79 MB
ionic-react Expired
199 KB
ionic-react-router Expired
27.9 KB
ionic-vue Expired
214 KB
ionic-vue-router Expired
17.1 KB
test-results-11-20 Expired
453 KB
test-results-12-20 Expired
401 KB
test-results-20-20 Expired
305 KB
test-results-7-20 Expired
1.05 MB
test-results-8-20 Expired
2.96 MB
test-results-9-20 Expired
422 KB