Skip to content

feat(themes): add support for modular themes and custom themes #16922

feat(themes): add support for modular themes and custom themes

feat(themes): add support for modular themes and custom themes #16922

Triggered via pull request August 25, 2025 18:55
Status Success
Total duration 13m 18s
Artifacts 27

build.yml

on: pull_request
build-react
54s
build-react
build-vue
40s
build-vue
Matrix: test-core-screenshot
build-angular
1m 1s
build-angular
build-angular-server
31s
build-angular-server
test-core-clean-build
12s
test-core-clean-build
test-core-lint
55s
test-core-lint
test-core-spec
42s
test-core-spec
build-react-router
32s
build-react-router
build-vue-router
37s
build-vue-router
verify-screenshots
2s
verify-screenshots
Matrix: test-angular-e2e
Matrix: test-react-e2e
Matrix: test-react-router-e2e
Matrix: test-vue-e2e
verify-test-angular-e2e
3s
verify-test-angular-e2e
verify-test-react-e2e
4s
verify-test-react-e2e
verify-test-react-router-e2e
2s
verify-test-react-router-e2e
verify-test-vue-e2e
2s
verify-test-vue-e2e
Fit to window
Zoom out
Zoom in

Annotations

8 errors and 20 notices
[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
1) [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: Timed out 5000ms waiting for expect(locator).toBeFocused() Locator: locator('#first-group ion-radio').first() Expected: focused Received: inactive 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/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) 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 Safari] › src/components/item/test/inputs/item.e2e.ts:32:9 › disabled state rendering - md/ltr › disabled controls should not have visual regressions: src/components/item/test/inputs/item.e2e.ts#L44
2) [Mobile Safari] › src/components/item/test/inputs/item.e2e.ts:32:9 › disabled state rendering - md/ltr › disabled controls should not have visual regressions Error: expect(page).toHaveScreenshot(expected) 1670 pixels (ratio 0.01 of all image pixels) are different. Snapshot: item-inputs-disabled-md-ltr.png Call log: - Expect "toHaveScreenshot(item-inputs-disabled-md-ltr.png)" with timeout 5000ms - verifying given screenshot expectation - taking page screenshot - disabled all CSS animations - waiting for fonts to load... - fonts loaded - 1670 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 - 1670 pixels (ratio 0.01 of all image pixels) are different. 42 | 43 | await page.setIonViewport(); > 44 | await expect(page).toHaveScreenshot(screenshot(`item-inputs-disabled`)); | ^ 45 | }); 46 | }); 47 | }); at /ionic/src/components/item/test/inputs/item.e2e.ts:44:26
[Mobile Safari] › src/components/item/test/inputs/item.e2e.ts:32:9 › disabled state rendering - ios/ltr › disabled controls should not have visual regressions: src/components/item/test/inputs/item.e2e.ts#L44
1) [Mobile Safari] › src/components/item/test/inputs/item.e2e.ts:32:9 › disabled state rendering - ios/ltr › disabled controls should not have visual regressions Retry #1 ─────────────────────────────────────────────────────────────────────────────────────── Error: expect(page).toHaveScreenshot(expected) 1141 pixels (ratio 0.01 of all image pixels) are different. Snapshot: item-inputs-disabled-ios-ltr.png Call log: - Expect "toHaveScreenshot(item-inputs-disabled-ios-ltr.png)" with timeout 5000ms - verifying given screenshot expectation - taking page screenshot - disabled all CSS animations - waiting for fonts to load... - fonts loaded - 1141 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 - 1141 pixels (ratio 0.01 of all image pixels) are different. 42 | 43 | await page.setIonViewport(); > 44 | await expect(page).toHaveScreenshot(screenshot(`item-inputs-disabled`)); | ^ 45 | }); 46 | }); 47 | }); at /ionic/src/components/item/test/inputs/item.e2e.ts:44:26
[Mobile Safari] › src/components/item/test/inputs/item.e2e.ts:32:9 › disabled state rendering - ios/ltr › disabled controls should not have visual regressions: src/components/item/test/inputs/item.e2e.ts#L44
1) [Mobile Safari] › src/components/item/test/inputs/item.e2e.ts:32:9 › disabled state rendering - ios/ltr › disabled controls should not have visual regressions Error: expect(page).toHaveScreenshot(expected) 1141 pixels (ratio 0.01 of all image pixels) are different. Snapshot: item-inputs-disabled-ios-ltr.png Call log: - Expect "toHaveScreenshot(item-inputs-disabled-ios-ltr.png)" with timeout 5000ms - verifying given screenshot expectation - taking page screenshot - disabled all CSS animations - waiting for fonts to load... - fonts loaded - 1141 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 - 1141 pixels (ratio 0.01 of all image pixels) are different. 42 | 43 | await page.setIonViewport(); > 44 | await expect(page).toHaveScreenshot(screenshot(`item-inputs-disabled`)); | ^ 45 | }); 46 | }); 47 | }); at /ionic/src/components/item/test/inputs/item.e2e.ts:44:26
[Mobile Safari] › src/components/datetime/test/position/datetime.e2e.ts:6:9 › datetime: position - md/rtl › should position the time picker relative to the click target: src/components/datetime/test/position/datetime.e2e.ts#L14
2) [Mobile Safari] › src/components/datetime/test/position/datetime.e2e.ts:6:9 › datetime: position - md/rtl › should position the time picker relative to the click target Error: locator.waitFor: Test timeout of 30000ms exceeded. Call log: - waiting for locator('.datetime-ready') to be visible 12 | 13 | await ionPopoverDidPresent.next(); > 14 | await page.locator('.datetime-ready').waitFor(); | ^ 15 | 16 | await expect(page).toHaveScreenshot(screenshot(`datetime-position-base`)); 17 | at /ionic/src/components/datetime/test/position/datetime.e2e.ts:14:45
[Mobile Safari] › src/components/datetime/test/position/datetime.e2e.ts:6:9 › datetime: position - md/rtl › should position the time picker relative to the click target: src/components/datetime/test/position/datetime.e2e.ts#L0
2) [Mobile Safari] › src/components/datetime/test/position/datetime.e2e.ts:6:9 › datetime: position - md/rtl › should position the time picker relative to the click target Test timeout of 30000ms exceeded.
[Mobile Safari] › src/components/datetime/test/custom/datetime.e2e.ts:32:9 › datetime: custom - md/ltr › should allow styling calendar days in grid style datetimes: src/components/datetime/test/custom/datetime.e2e.ts#L42
1) [Mobile Safari] › src/components/datetime/test/custom/datetime.e2e.ts:32:9 › datetime: custom - md/ltr › should allow styling calendar days in grid style datetimes Error: expect(locator).toHaveScreenshot(expected) 5526 pixels (ratio 0.05 of all image pixels) are different. Snapshot: datetime-custom-calendar-days-md-ltr.png Call log: - Expect "toHaveScreenshot(datetime-custom-calendar-days-md-ltr.png)" with timeout 5000ms - verifying given screenshot expectation - waiting for locator('#custom-calendar-days') - locator resolved to <ion-datetime value="2023-06-15" presentation="date" id="custom-calendar-days" class="ion-color ion-color-primary md datetime-presentation-date datetime-size-fixed datetime-grid hydrated">…</ion-datetime> - 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 - 5526 pixels (ratio 0.05 of all image pixels) are different. - waiting 100ms before taking screenshot - waiting for locator('#custom-calendar-days') - locator resolved to <ion-datetime value="2023-06-15" presentation="date" id="custom-calendar-days" class="ion-color ion-color-primary md datetime-presentation-date datetime-size-fixed datetime-grid hydrated">…</ion-datetime> - 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 - 5526 pixels (ratio 0.05 of all image pixels) are different. 40 | }); 41 | > 42 | await expect(datetime).toHaveScreenshot(screenshot(`datetime-custom-calendar-days`)); | ^ 43 | }); 44 | }); 45 | }); at /ionic/src/components/datetime/test/custom/datetime.e2e.ts:42:30
🎭 Playwright Run Summary
360 skipped 276 passed (2.2m)
🎭 Playwright Run Summary
368 skipped 303 passed (3.3m)
🎭 Playwright Run Summary
671 passed (3.5m)
🎭 Playwright Run Summary
1 skipped 671 passed (3.7m)
🎭 Playwright Run Summary
688 passed (3.7m)
🎭 Playwright Run Summary
5 skipped 661 passed (4.2m)
🎭 Playwright Run Summary
1 flaky [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 675 passed (4.8m)
🎭 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 36 skipped 817 passed (5.8m)
🎭 Playwright Run Summary
14 skipped 489 passed (5.8m)
🎭 Playwright Run Summary
10 skipped 647 passed (6.4m)
🎭 Playwright Run Summary
5 skipped 674 passed (6.6m)
🎭 Playwright Run Summary
12 skipped 680 passed (7.8m)
🎭 Playwright Run Summary
1 skipped 666 passed (8.2m)
🎭 Playwright Run Summary
2 flaky [Mobile Safari] › src/components/item/test/inputs/item.e2e.ts:32:9 › disabled state rendering - ios/ltr › disabled controls should not have visual regressions [Mobile Safari] › src/components/item/test/inputs/item.e2e.ts:32:9 › disabled state rendering - md/ltr › disabled controls should not have visual regressions 3 skipped 667 passed (8.8m)
🎭 Playwright Run Summary
1 skipped 651 passed (9.0m)
🎭 Playwright Run Summary
5 skipped 709 passed (9.2m)
🎭 Playwright Run Summary
2 flaky [Mobile Safari] › src/components/datetime/test/custom/datetime.e2e.ts:32:9 › datetime: custom - md/ltr › should allow styling calendar days in grid style datetimes [Mobile Safari] › src/components/datetime/test/position/datetime.e2e.ts:6:9 › datetime: position - md/rtl › should position the time picker relative to the click target 2 skipped 662 passed (8.9m)
🎭 Playwright Run Summary
4 skipped 729 passed (9.4m)
🎭 Playwright Run Summary
7 skipped 622 passed (9.8m)
🎭 Playwright Run Summary
14 skipped 681 passed (10.6m)

Artifacts

Produced during runtime
Name Size Digest
ionic-angular Expired
864 KB
sha256:dcd2ca63f28f1116e34bfa63a4ecb5b34caced8953bfeb2fb261a65740f1508d
ionic-angular-server Expired
8.55 KB
sha256:bf79ac20e21a3208d1a9ba7817bfec04feb8f4a0388a3196956309a6ea16622d
ionic-core Expired
5.14 MB
sha256:cd66949ab4cd6b01ff8e89029211bf4a84942fd55f829fee169e89c27530767c
ionic-react Expired
403 KB
sha256:dd9d82671b77c8203b40d58575e5796eed60522d0ca515a99a9257ab0249caa9
ionic-react-router Expired
27.9 KB
sha256:482801b2f4c71ebe78969b6412ee7b58a945244b0074ff8b7decc5d53894b3eb
ionic-vue Expired
433 KB
sha256:de3ffaec1ff75aec7bdffcc356dabacc690d5c81c684ae29c6f60e6b1fbd3700
ionic-vue-router Expired
17.1 KB
sha256:42fdae76bf95e984bc3f2382f0e7e6dfe5692f68100bb4eb4d546dcd25ffbe03
test-results-1-20 Expired
504 KB
sha256:b4319cf491e4b6e6e191a46bbd7ffe252fdc6bdeee6a00891933855e29bd310a
test-results-10-20 Expired
454 KB
sha256:5e9404564978dd2374554f64171d223ff937465896c28da66cb74df7c99a51ce
test-results-11-20 Expired
1.32 MB
sha256:4184762fa6d573a28927ca0d1a541634dfc75b4986e21968cddfbf85a34c50a4
test-results-12-20 Expired
491 KB
sha256:d75b139fdb73d8afcc7e02d737562c3fbc0201e25a6ec2cecee1cc4358e47c19
test-results-13-20 Expired
1.38 MB
sha256:e8f042926a5d409efce4d505e9b9b6e74de77577005cd990330b2550d1e65c44
test-results-14-20 Expired
435 KB
sha256:cd52f112dc80e58953a9b9ffcc351b9ed584b9ce254069ee61ef1ef0c3f5edb4
test-results-15-20 Expired
1.7 MB
sha256:a39cf619db4a9e5c14029ae35fd09f82aaa9e9127ab95abb4e553c04a32c93f9
test-results-16-20 Expired
482 KB
sha256:c81296e8eac1cbd544dffaa75434f7439ae9c3cd4ad23fc8316844d050896451
test-results-17-20 Expired
2.69 MB
sha256:6f7c0bc15fcf84f7caf5a397c25c5d45bedb92eb205f898caa18af54617b735e
test-results-18-20 Expired
567 KB
sha256:f0056ec74bac6e0c1c6e84196deb0c2c38271bb82abe17c41f94bbe5406d8822
test-results-19-20 Expired
457 KB
sha256:32fd148a3c63b081ef4c8219d5867da1db2dc29909ac7a9c92219149395f60e2
test-results-2-20 Expired
516 KB
sha256:036620b6e0cfac45b2c797b46d1ab1242d2e7b751bb368e6697b39bbc174dce3
test-results-20-20 Expired
347 KB
sha256:5f1f90e7ca30fd8b1d6d2d2a45821c44314e7f7f8db26cb8a5d39835ba6830fc
test-results-3-20 Expired
450 KB
sha256:c23d5363c3b1053508ff506f65844e2435a01c393217a511611168422826fd2b
test-results-4-20 Expired
598 KB
sha256:088fe9b2bb27145032573e12d35341415d6db6df92120705368ce93ebb74dfdb
test-results-5-20 Expired
500 KB
sha256:c87ef5790fb478be12fe04898f5b3acc255bb61d1298f0cf02b03620e0493492
test-results-6-20 Expired
488 KB
sha256:a7ab3b33ffeed6aec12bfff73d32b68a1d76cce893b543d64934cf70dd95ba2b
test-results-7-20 Expired
368 KB
sha256:ce9f3074df712543f9bb568850828a67e8423a47a06e9669e7b50474c3e53ec9
test-results-8-20 Expired
458 KB
sha256:47038b2e69ceef209af89ff6c0d53e0310adbbab3812b1d227d2fa6291890466
test-results-9-20 Expired
493 KB
sha256:54d14f6121a1f54d96f56b1094d19bd3c9e935a2985ef0c3d7d8ded18027f69e