Skip to content

fix(demo): separate Material You and dark mode toggles - #73

Merged
rdlabo merged 6 commits into
mainfrom
fix/demo-theme-toggles
Nov 11, 2026
Merged

rdlabo merged 6 commits into
mainfrom
fix/demo-theme-toggles

Conversation

@rdlabo

@rdlabo rdlabo commented Nov 11, 2026 •

Copy link
Copy Markdown
Contributor

Replace the demo's System/Light/Dark buttons with independent Material You and Dark Mode toggles, following the original dark-mode toggle UI. Dark Mode defaults to light; Material You keeps its current enabled default. Turning Material You off restores standard colors while preserving the selected appearance, and turning it back on applies that appearance's device palette.

The toggles bind to a shared settings signal through Signal Forms (form() and [formField]). A component effect applies settings to the imperative theme API; only Material You changes refresh the device palette.

Read the native palette availability rather than assuming every Android device supports Material You. Unsupported devices, Web/iOS, and native builds missing the API show Material You as off and disabled with an explanation. Dark Mode remains available. Signal Forms owns the disabled state.

Validation:

  • Dynamic-color tests: 39 passed, including palette restoration and re-enabling in dark mode.
  • Playwright: supported-device independent toggle/palette restoration and unsupported-device behavior passed. Related device tests passed (32 cases), and adjusted dark/light component tests passed after waiting for color transitions.
  • Device screenshot setup now selects appearance through the Settings UI before SPA navigation; screenshot preparation targets visible content. Five representative dark screenshot flows passed locally with image comparison disabled; Linux image comparisons are verified in CI.
  • Demo lint, TypeScript check, and formatting passed.
  • Production build passed (existing browser-support, unused IonText and bundle-budget warnings).

Visual regression baselines were not regenerated locally.

Supervisor and independent third-party acceptance reviews completed; all requested corrections were re-reviewed and approved.

@github-actions

github-actions Bot commented Nov 11, 2026 •

Copy link
Copy Markdown
Contributor

Playwright test results

passed  266 passed

Details

stats  266 tests across 18 suites
duration  3 minutes, 40 seconds
commit  14fc05b
info  This detailed result covers Ionic 9 only. Ionic 8 runs against the same screenshots in a separate matrix job; check the workflow run for both results. To update the screenshots, comment with /update-screenshots.

github-actions Bot added a commit that referenced this pull request Nov 11, 2026
@github-actions

github-actions Bot commented Nov 11, 2026 •

Copy link
Copy Markdown
Contributor

📊 Ionic 9 Playwright Test Report

View the detailed Ionic 9 report: https://webview-native-ui.github.io/ionic-theme-md3/pr-73/

Ionic 8 runs against the same screenshots in a separate matrix job. View both results in the workflow run.

github-actions Bot added a commit that referenced this pull request Nov 11, 2026
github-actions Bot added a commit that referenced this pull request Nov 11, 2026
github-actions Bot added a commit that referenced this pull request Nov 11, 2026
github-actions Bot added a commit that referenced this pull request Nov 11, 2026
@rdlabo
rdlabo merged commit bdf7479 into main Nov 11, 2026
11 checks passed
@github-actions

Copy link
Copy Markdown
Contributor

npm beta published

CI passed for the merge commit bdf74792a442. Install the immutable version with:

npm install @rdlabo/ionic-theme-md3@9.2.0-beta.pr73.shabdf74792a442

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant