Skip to content

feat(themes): add base tokens and update colors to use new token system #17143

feat(themes): add base tokens and update colors to use new token system

feat(themes): add base tokens and update colors to use new token system #17143

Triggered via pull request October 1, 2025 15:39
Status Success
Total duration 12m 37s
Artifacts 27

build.yml

on: pull_request
build-react
51s
build-react
build-vue
43s
build-vue
Matrix: test-core-screenshot
build-angular
57s
build-angular
build-angular-server
32s
build-angular-server
test-core-clean-build
14s
test-core-clean-build
test-core-lint
1m 0s
test-core-lint
test-core-spec
44s
test-core-spec
build-react-router
25s
build-react-router
build-vue-router
47s
build-vue-router
verify-screenshots
3s
verify-screenshots
Matrix: test-angular-e2e
Matrix: test-react-e2e
Matrix: test-react-router-e2e
Matrix: test-vue-e2e
verify-test-angular-e2e
2s
verify-test-angular-e2e
verify-test-react-e2e
3s
verify-test-react-e2e
verify-test-react-router-e2e
2s
verify-test-react-router-e2e
verify-test-vue-e2e
3s
verify-test-vue-e2e
Fit to window
Zoom out
Zoom in

Annotations

8 errors and 20 notices
[Mobile Chrome] › src/components/title/test/basic/title.e2e.ts:6:9 › title: basic - ionic/md/ltr/light › should not have visual regressions: src/components/title/test/basic/title.e2e.ts#L11
1) [Mobile Chrome] › src/components/title/test/basic/title.e2e.ts:6:9 › title: basic - ionic/md/ltr/light › should not have visual regressions Retry #1 ─────────────────────────────────────────────────────────────────────────────────────── Error: expect(locator).toHaveScreenshot(expected) failed 194 pixels (ratio 0.01 of all image pixels) are different. Snapshot: title-basic-ionic-md-ltr-light.png Call log: - Expect "toHaveScreenshot(title-basic-ionic-md-ltr-light.png)" with timeout 5000ms - verifying given screenshot expectation - waiting for locator('#header-wrapper') - locator resolved to <div id="header-wrapper">…</div> - 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 - 194 pixels (ratio 0.01 of all image pixels) are different. - waiting 100ms before taking screenshot - waiting for locator('#header-wrapper') - locator resolved to <div id="header-wrapper">…</div> - 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 - 194 pixels (ratio 0.01 of all image pixels) are different. 9 | 10 | // only screenshot the headers to avoid unnecessary blank space from ion-content > 11 | await expect(wrapper).toHaveScreenshot(screenshot(`title-basic`)); | ^ 12 | }); 13 | }); 14 | }); at /ionic/src/components/title/test/basic/title.e2e.ts:11:29
[Mobile Chrome] › src/components/title/test/basic/title.e2e.ts:6:9 › title: basic - ionic/md/ltr/light › should not have visual regressions: src/components/title/test/basic/title.e2e.ts#L11
1) [Mobile Chrome] › src/components/title/test/basic/title.e2e.ts:6:9 › title: basic - ionic/md/ltr/light › should not have visual regressions Error: expect(locator).toHaveScreenshot(expected) failed 194 pixels (ratio 0.01 of all image pixels) are different. Snapshot: title-basic-ionic-md-ltr-light.png Call log: - Expect "toHaveScreenshot(title-basic-ionic-md-ltr-light.png)" with timeout 5000ms - verifying given screenshot expectation - waiting for locator('#header-wrapper') - locator resolved to <div id="header-wrapper">…</div> - 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 - 194 pixels (ratio 0.01 of all image pixels) are different. - waiting 100ms before taking screenshot - waiting for locator('#header-wrapper') - locator resolved to <div id="header-wrapper">…</div> - 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 - 194 pixels (ratio 0.01 of all image pixels) are different. 9 | 10 | // only screenshot the headers to avoid unnecessary blank space from ion-content > 11 | await expect(wrapper).toHaveScreenshot(screenshot(`title-basic`)); | ^ 12 | }); 13 | }); 14 | }); at /ionic/src/components/title/test/basic/title.e2e.ts:11:29
[Mobile Chrome] › src/components/radio/test/a11y/radio.e2e.ts:130:11 › radio: a11y - md/ltr/dark › radio: keyboard navigation - md/ltr/dark › using arrow keys should move between enabled radios within group: src/components/radio/test/a11y/radio.e2e.ts#L134
4) [Mobile Chrome] › src/components/radio/test/a11y/radio.e2e.ts:130:11 › radio: a11y - md/ltr/dark › radio: keyboard navigation - md/ltr/dark › using arrow keys should move between enabled radios within group Error: expect(locator).toBeFocused() failed Locator: locator('#first-group ion-radio').first() Expected: focused Received: inactive Timeout: 5000ms Call log: - Expect "toBeFocused" with timeout 5000ms - waiting for locator('#first-group ion-radio').first() 9 × locator resolved to <ion-radio value="huey" role="radio" tabindex="0" aria-checked="true" class="md in-item radio-checked radio-label-placement-start hydrated">Huey</ion-radio> - unexpected value "inactive" 132 | 133 | await pageUtils.pressKeys('Tab'); > 134 | await expect(firstGroupRadios.nth(0)).toBeFocused(); | ^ 135 | 136 | await page.keyboard.press('ArrowDown'); 137 | await expect(firstGroupRadios.nth(1)).toBeFocused(); at /ionic/src/components/radio/test/a11y/radio.e2e.ts:134:47
[Mobile Chrome] › src/components/radio/test/a11y/radio.e2e.ts:117:11 › radio: a11y - md/ltr/dark › radio: keyboard navigation - md/ltr/dark › tabbing should switch between radio groups: src/components/radio/test/a11y/radio.e2e.ts#L122
3) [Mobile Chrome] › src/components/radio/test/a11y/radio.e2e.ts:117:11 › radio: a11y - md/ltr/dark › radio: keyboard navigation - md/ltr/dark › tabbing should switch between radio groups Error: expect(locator).toBeFocused() failed Locator: locator('#first-group ion-radio').first() Expected: focused Received: inactive Timeout: 5000ms Call log: - Expect "toBeFocused" with timeout 5000ms - waiting for locator('#first-group ion-radio').first() 9 × locator resolved to <ion-radio value="huey" role="radio" tabindex="0" aria-checked="true" class="md in-item radio-checked radio-label-placement-start hydrated">Huey</ion-radio> - unexpected value "inactive" 120 | 121 | await pageUtils.pressKeys('Tab'); > 122 | await expect(firstGroupRadios.nth(0)).toBeFocused(); | ^ 123 | 124 | await pageUtils.pressKeys('Tab'); 125 | await expect(secondGroupRadios.nth(0)).toBeFocused(); at /ionic/src/components/radio/test/a11y/radio.e2e.ts:122:47
[Mobile Chrome] › src/components/radio/test/a11y/radio.e2e.ts:130:11 › radio: a11y - md/ltr › radio: keyboard navigation - md/ltr › using arrow keys should move between enabled radios within group: src/components/radio/test/a11y/radio.e2e.ts#L134
2) [Mobile Chrome] › src/components/radio/test/a11y/radio.e2e.ts:130:11 › radio: a11y - md/ltr › radio: keyboard navigation - md/ltr › using arrow keys should move between enabled radios within group Error: expect(locator).toBeFocused() failed Locator: locator('#first-group ion-radio').first() Expected: focused Received: inactive Timeout: 5000ms Call log: - Expect "toBeFocused" with timeout 5000ms - waiting for locator('#first-group ion-radio').first() 9 × locator resolved to <ion-radio value="huey" role="radio" tabindex="0" aria-checked="true" class="md in-item radio-checked radio-label-placement-start hydrated">Huey</ion-radio> - unexpected value "inactive" 132 | 133 | await pageUtils.pressKeys('Tab'); > 134 | await expect(firstGroupRadios.nth(0)).toBeFocused(); | ^ 135 | 136 | await page.keyboard.press('ArrowDown'); 137 | await expect(firstGroupRadios.nth(1)).toBeFocused(); at /ionic/src/components/radio/test/a11y/radio.e2e.ts:134:47
[Mobile Chrome] › src/components/radio/test/a11y/radio.e2e.ts:117:11 › radio: a11y - md/ltr › radio: keyboard navigation - md/ltr › tabbing should switch between radio groups: src/components/radio/test/a11y/radio.e2e.ts#L122
1) [Mobile Chrome] › src/components/radio/test/a11y/radio.e2e.ts:117:11 › radio: a11y - md/ltr › radio: keyboard navigation - md/ltr › tabbing should switch between radio groups Error: expect(locator).toBeFocused() failed Locator: locator('#first-group ion-radio').first() Expected: focused Received: inactive Timeout: 5000ms Call log: - Expect "toBeFocused" with timeout 5000ms - waiting for locator('#first-group ion-radio').first() 9 × locator resolved to <ion-radio value="huey" role="radio" tabindex="0" aria-checked="true" class="md in-item radio-checked radio-label-placement-start hydrated">Huey</ion-radio> - unexpected value "inactive" 120 | 121 | await pageUtils.pressKeys('Tab'); > 122 | await expect(firstGroupRadios.nth(0)).toBeFocused(); | ^ 123 | 124 | await pageUtils.pressKeys('Tab'); 125 | await expect(secondGroupRadios.nth(0)).toBeFocused(); at /ionic/src/components/radio/test/a11y/radio.e2e.ts:122:47
[Mobile Firefox] › src/components/tab-bar/test/basic/tab-bar.e2e.ts:9:9 › tab-bar: basic - ionic/md/rtl/light › should not have visual regressions: src/components/tab-bar/test/basic/tab-bar.e2e.ts#L45
1) [Mobile Firefox] › src/components/tab-bar/test/basic/tab-bar.e2e.ts:9:9 › tab-bar: basic - ionic/md/rtl/light › should not have visual regressions Retry #1 ─────────────────────────────────────────────────────────────────────────────────────── Error: expect(locator).toHaveScreenshot(expected) failed 541 pixels (ratio 0.03 of all image pixels) are different. Snapshot: tab-bar-default-ionic-md-rtl-light.png Call log: - Expect "toHaveScreenshot(tab-bar-default-ionic-md-rtl-light.png)" with timeout 5000ms - verifying given screenshot expectation - waiting for locator('ion-tab-bar') - locator resolved to <ion-tab-bar role="tablist" selected-tab="2" class="ionic tab-bar-full tab-bar-round hydrated">…</ion-tab-bar> - 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 - 541 pixels (ratio 0.03 of all image pixels) are different. - waiting 100ms before taking screenshot - waiting for locator('ion-tab-bar') - locator resolved to <ion-tab-bar role="tablist" selected-tab="2" class="ionic tab-bar-full tab-bar-round hydrated">…</ion-tab-bar> - 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 - 541 pixels (ratio 0.03 of all image pixels) are different. 43 | const tabBar = page.locator('ion-tab-bar'); 44 | > 45 | await expect(tabBar).toHaveScreenshot(screenshot(`tab-bar-default`)); | ^ 46 | }); 47 | }); 48 | }); at /ionic/src/components/tab-bar/test/basic/tab-bar.e2e.ts:45:28
[Mobile Firefox] › src/components/tab-bar/test/basic/tab-bar.e2e.ts:9:9 › tab-bar: basic - ionic/md/rtl/light › should not have visual regressions: src/components/tab-bar/test/basic/tab-bar.e2e.ts#L45
1) [Mobile Firefox] › src/components/tab-bar/test/basic/tab-bar.e2e.ts:9:9 › tab-bar: basic - ionic/md/rtl/light › should not have visual regressions Error: expect(locator).toHaveScreenshot(expected) failed 541 pixels (ratio 0.03 of all image pixels) are different. Snapshot: tab-bar-default-ionic-md-rtl-light.png Call log: - Expect "toHaveScreenshot(tab-bar-default-ionic-md-rtl-light.png)" with timeout 5000ms - verifying given screenshot expectation - waiting for locator('ion-tab-bar') - locator resolved to <ion-tab-bar role="tablist" selected-tab="2" class="ionic tab-bar-full tab-bar-round hydrated">…</ion-tab-bar> - 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 - 541 pixels (ratio 0.03 of all image pixels) are different. - waiting 100ms before taking screenshot - waiting for locator('ion-tab-bar') - locator resolved to <ion-tab-bar role="tablist" selected-tab="2" class="ionic tab-bar-full tab-bar-round hydrated">…</ion-tab-bar> - 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 - 541 pixels (ratio 0.03 of all image pixels) are different. 43 | const tabBar = page.locator('ion-tab-bar'); 44 | > 45 | await expect(tabBar).toHaveScreenshot(screenshot(`tab-bar-default`)); | ^ 46 | }); 47 | }); 48 | }); at /ionic/src/components/tab-bar/test/basic/tab-bar.e2e.ts:45:28
🎭 Playwright Run Summary
360 skipped 275 passed (2.2m)
🎭 Playwright Run Summary
368 skipped 302 passed (3.4m)
🎭 Playwright Run Summary
2 skipped 669 passed (3.6m)
🎭 Playwright Run Summary
1 skipped 676 passed (3.8m)
🎭 Playwright Run Summary
8 skipped 680 passed (3.8m)
🎭 Playwright Run Summary
8 skipped 660 passed (4.3m)
🎭 Playwright Run Summary
1 flaky [Mobile Chrome] › src/components/title/test/basic/title.e2e.ts:6:9 › title: basic - ionic/md/ltr/light › should not have visual regressions 144 skipped 709 passed (4.7m)
🎭 Playwright Run Summary
4 flaky [Mobile Chrome] › src/components/radio/test/a11y/radio.e2e.ts:117:11 › radio: a11y - md/ltr › radio: keyboard navigation - md/ltr › tabbing should switch between radio groups [Mobile Chrome] › src/components/radio/test/a11y/radio.e2e.ts:130:11 › radio: a11y - md/ltr › radio: keyboard navigation - md/ltr › using arrow keys should move between enabled radios within group [Mobile Chrome] › src/components/radio/test/a11y/radio.e2e.ts:117:11 › radio: a11y - md/ltr/dark › radio: keyboard navigation - md/ltr/dark › tabbing should switch between radio groups [Mobile Chrome] › src/components/radio/test/a11y/radio.e2e.ts:130:11 › radio: a11y - md/ltr/dark › radio: keyboard navigation - md/ltr/dark › using arrow keys should move between enabled radios within group 4 skipped 672 passed (5.2m)
🎭 Playwright Run Summary
14 skipped 489 passed (6.1m)
🎭 Playwright Run Summary
10 skipped 648 passed (6.8m)
🎭 Playwright Run Summary
5 skipped 676 passed (7.0m)
🎭 Playwright Run Summary
3 skipped 664 passed (7.8m)
🎭 Playwright Run Summary
12 skipped 685 passed (7.9m)
🎭 Playwright Run Summary
13 skipped 653 passed (8.2m)
🎭 Playwright Run Summary
1 skipped 656 passed (8.2m)
🎭 Playwright Run Summary
1 flaky [Mobile Firefox] › src/components/tab-bar/test/basic/tab-bar.e2e.ts:9:9 › tab-bar: basic - ionic/md/rtl/light › should not have visual regressions 5 skipped 709 passed (8.8m)
🎭 Playwright Run Summary
18 skipped 613 passed (9.1m)
🎭 Playwright Run Summary
4 skipped 729 passed (9.1m)
🎭 Playwright Run Summary
14 skipped 681 passed (9.7m)
🎭 Playwright Run Summary
5 skipped 667 passed (9.7m)

Artifacts

Produced during runtime
Name Size Digest
ionic-angular Expired
848 KB
sha256:404a2fee83b3998e8485dc392c6c99500aaf0d516c0095e7b4e5b4427e1b1b4c
ionic-angular-server Expired
8.55 KB
sha256:203ef6c7de6dfa51466a987eeb938a5c7b404c197a69fb383acb2b89cb131357
ionic-core Expired
5.18 MB
sha256:4bad332621ea25dfb83013a8a2c1e1aca9be6ca2b8bf16e1529babac5ed22318
ionic-react Expired
387 KB
sha256:3e4272325612b08dd82c57ad9ff3e734e86b08f33b0ce3307ba13aef4bcb003a
ionic-react-router Expired
27.9 KB
sha256:9aef2a8237aafb093b7584ca205204c85a27a721fb1489a5f57972e00ea5c72c
ionic-vue Expired
417 KB
sha256:1f166433e9ad50471620312fa21f682780baed5fa7ee98361ca26800efb9ac92
ionic-vue-router Expired
17 KB
sha256:bb6b80e2c43c1f644885cec4c7782e42eb2b2e7b0271024a289ee4fe7a1dceb1
test-results-1-20 Expired
493 KB
sha256:218df816eb82cc4e01cece507fe7a1dcaad78430ee6b71eb5e4b4eb16b69b4a1
test-results-10-20 Expired
444 KB
sha256:7f63862ce857a2ba773084be64395c806bf33f0caa720dd689655533a49216bf
test-results-11-20 Expired
2.43 MB
sha256:1f13ff230a249607b271f42c19aed5c91e904d7ea2f999712745249a81cd2d3b
test-results-12-20 Expired
481 KB
sha256:50109a608a30565d7ca3802688096c38fe9ac3678192e41b07871287bbbcdf91
test-results-13-20 Expired
1.78 MB
sha256:87444cc42407a78e15c6d03f7165d7e328e5d2bd045b7d4b9c8c5202db8f34e5
test-results-14-20 Expired
426 KB
sha256:825d77742669efda26ce70b453765342421b355b1bbd6e8d1a8851d0702479c9
test-results-15-20 Expired
458 KB
sha256:16088d3dd26c9279aa162ce86468d537bb40a972248499634fe93c929c64aee8
test-results-16-20 Expired
474 KB
sha256:0b0d0ea6ab1ee55c473907c5a50e8d1c2df37a5542b4a1a5fce07c5f04745ba3
test-results-17-20 Expired
562 KB
sha256:88de36bc60ef534e2c558a7fd4750b26387bf78d4f37c0eaa5458bff3f7593e5
test-results-18-20 Expired
553 KB
sha256:a37d2bf992eb6180814df8ae140fc29085775cb901d9990b31d3880717d402d8
test-results-19-20 Expired
447 KB
sha256:1a35132cfc8512475254278f578f5f23e597cc05dc587344ccd8cf7f0dede185
test-results-2-20 Expired
502 KB
sha256:ee090fac3cebf5ae05800bc2cdf609d66cc3d6bfbcaaa057db2cc582c9a58a8f
test-results-20-20 Expired
338 KB
sha256:c16e74899b033190b696d1142a2e38b4732ec793d97bab4758194a8c96969fa2
test-results-3-20 Expired
440 KB
sha256:11277e668d94c5218f3039ca6a38ed89f3188ca3be4ce9505aff7a4ba01edbd5
test-results-4-20 Expired
584 KB
sha256:45988120f14dd7c93133d85579cd00f63bc660117443a8790a8035c30ea52b09
test-results-5-20 Expired
488 KB
sha256:ec1acb5b6d09f1ca81c3c5e92726dc0908f633fe697410741b3e95d8474f4e54
test-results-6-20 Expired
1.67 MB
sha256:b62394e230e2c6240c2a3db5597b7fc7483b23ce92290817de300beedf2ebce6
test-results-7-20 Expired
357 KB
sha256:41aca40a9ea21e2ae798b0111fce5d494bab5f2e50e138a2ed31367e607b017b
test-results-8-20 Expired
448 KB
sha256:f89aa63280d09c11397ad4d5befceb850e7cb5fc52b61551ab9008b67a0df235
test-results-9-20 Expired
485 KB
sha256:229e798c242f52cc98614ed8e3ed962b27852572f427472a923400d07c58c11b