Skip to content

chore: refactor alert and flashbar contexts and tokens - #4866

Draft
mxschll wants to merge 7 commits into
mainfrom
dev-v3-schomax-contexts
Draft

chore: refactor alert and flashbar contexts and tokens#4866
mxschll wants to merge 7 commits into
mainfrom
dev-v3-schomax-contexts

Conversation

@mxschll

@mxschll mxschll commented Aug 4, 2026

Copy link
Copy Markdown
Member

Description

One Theme introduces alerts and flashbars that look different in dark and light mode. Additionally, flashbars in certain contexts should always appear dark.

This refactoring removes alert and flashbar contexts in One Theme and decouples color tokens for alert and flashbar background and icon colors.

Related links, issue #, if available: n/a

How has this been tested?

Review checklist

The following items are to be evaluated by the author(s) and the reviewer(s).

Correctness

  • Changes include appropriate documentation updates.
  • Changes are backward-compatible if not indicated, see CONTRIBUTING.md.
  • Changes do not include unsupported browser features, see CONTRIBUTING.md.
  • Changes were manually tested for accessibility, see accessibility guidelines.

Security

Testing

  • Changes are covered with new/existing unit tests?
  • Changes are covered with new/existing integration tests?

By submitting this pull request, I confirm that you can use, modify, copy, and redistribute this contribution, under the terms of your choice.

@codecov

codecov Bot commented Aug 4, 2026

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 97.63%. Comparing base (c87f9f7) to head (fd6ce26).

Additional details and impacted files
@@           Coverage Diff           @@
##             main    #4866   +/-   ##
=======================================
  Coverage   97.63%   97.63%           
=======================================
  Files         957      957           
  Lines       31154    31155    +1     
  Branches    11471    11472    +1     
=======================================
+ Hits        30418    30419    +1     
  Misses        689      689           
  Partials       47       47           

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@mxschll
mxschll requested a review from YueyingLu August 4, 2026 21:54
@mxschll
mxschll marked this pull request as ready for review August 4, 2026 21:54
@mxschll
mxschll requested a review from a team as a code owner August 4, 2026 21:54
@mxschll
mxschll marked this pull request as draft August 5, 2026 09:21
@mxschll
mxschll force-pushed the dev-v3-schomax-contexts branch from c258650 to 700a66e Compare August 6, 2026 09:50
@mxschll
mxschll changed the base branch from main to dev-v3-schomax-notification-tokens August 6, 2026 09:51
@mxschll
mxschll changed the base branch from dev-v3-schomax-notification-tokens to main August 6, 2026 11:37
@mxschll
mxschll force-pushed the dev-v3-schomax-contexts branch from 8dec9ed to 0ae9a51 Compare August 6, 2026 11:37
@mxschll
mxschll had a problem deploying to dev-pages-react18 August 6, 2026 15:37 — with GitHub Actions Failure
@mxschll
mxschll had a problem deploying to dev-pages-react16 August 6, 2026 15:37 — with GitHub Actions Failure
mxschll added 7 commits August 6, 2026 20:05
Content embedded in One Theme alerts and flash messages did not follow the
notification treatment: body text, links and dividers kept their page-surface
values. Dividers were effectively invisible (1.14:1 against the notification
background) and embedded text did not match the notification's own text colour.

Embedded content is rendered by other components, which read the shared body
text, link and divider tokens directly, so it cannot be reached from the alert
or flashbar stylesheets. The notification-controls context redirects those
shared tokens to new component-scoped base tokens instead:

  colorTextNotificationLinkDefault
  colorTextNotificationLinkHover
  colorBorderDividerNotification

In Visual Refresh and Classic the new tokens are pure references to
colorTextLinkDefault, colorTextLinkHover and colorBorderDividerDefault, so
those themes render unchanged. In One Theme they carry the mode-aware values
the notification contexts used before they were removed.

The context entries are references only, so a single mode-agnostic declaration
is emitted. It therefore cannot be dropped for one mode by the theming build's
parent diff, and it follows the dark pin applied by the header and top
navigation surfaces. This is what the earlier attempt got wrong: it defined the
divider token in One Theme only, leaving Visual Refresh and Classic with
metadata for a token no theme provided.

Verified: the Classic + Visual Refresh artefact is byte-identical (228 CSS
files, 8 design-token files). In a build that also bundles One Theme, all 1003
custom properties resolved across 13 context chains in both modes show zero
changed values for Classic and Visual Refresh; all 378 changes are in the One
Theme notification contexts.
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