Skip to content

CORE-2737: Use the published ui-components CSS colour audit in REX #3137

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
OpenStaxClaude wants to merge 4 commits into from
Draft

CORE-2737: Use the published ui-components CSS colour audit in REX #3137

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
13cc4dd
CORE-2737: import the color audit engine rather than declaring a seco…
OpenStaxClaude Sep 8, 2026
d06f417
CORE-2737: point at test-core-2736-1 and take the migration's snapshots
Sep 8, 2026
00a3865
CORE-2737: point at test-core-2736-2, which carries a complete dist
OpenStaxClaude Sep 9, 2026
b882ad9
Use new ui-components
RoyEJohnson Sep 11, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
"@openstax/highlighter": "https://github.com/openstax/highlighter#1.16.4b",
"@openstax/open-search-client": "0.1.0-build.7",
"@openstax/ts-utils": "1.19.0",
"@openstax/ui-components": "openstax/ui-components#1.21.1",
"@openstax/ui-components": "openstax/ui-components#test-core-2736-3",
"@sentry/integrations": "^7.54.0",
"@sentry/react": "^7.54.0",
"classnames": "2.3.2",
Expand Down Expand Up @@ -185,6 +185,7 @@
"moduleNameMapper": {
"//comment//": "remove this when CRA upgrades jest above 28",
"(.*)@openstax/ts-utils(.*)": "$1@openstax/ts-utils/dist/cjs$2",
"(.*)@openstax/ui-components/(.*)": "$1@openstax/ui-components/dist/cjs/$2",
"\\.css$": "<rootDir>/__mocks__/styleMock.js"
},
"setupFilesAfterEnv": [
Expand Down
34 changes: 4 additions & 30 deletions src/app/content/highlights/components/__snapshots__/EditCard.spec.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,20 +2,7 @@

exports[`EditCard Snapshots and Rendering matches snapshot when editing 1`] = `
Array [
.c0 {
position: fixed;
right: 2rem;
z-index: 40;
display: grid;
justify-items: center;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
gap: 1vh;
}

<div
<div
style={
Object {
"--elevated-toast-z-index": 131,
Expand All @@ -24,7 +11,7 @@ Array [
>
<div
aria-live="polite"
className="c0 elevated-toast-container"
className="toast-container elevated-toast-container"
/>
</div>,
<div
Expand Down Expand Up @@ -162,20 +149,7 @@ exports[`EditCard Snapshots and Rendering matches snapshot when focused 1`] = `

exports[`EditCard Snapshots and Rendering matches snapshot with data for authenticated user 1`] = `
Array [
.c0 {
position: fixed;
right: 2rem;
z-index: 40;
display: grid;
justify-items: center;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
gap: 1vh;
}

<div
<div
style={
Object {
"--elevated-toast-z-index": 131,
Expand All @@ -184,7 +158,7 @@ Array [
>
<div
aria-live="polite"
className="c0 elevated-toast-container"
className="toast-container elevated-toast-container"
/>
</div>,
<div
Expand Down
10 changes: 9 additions & 1 deletion src/app/developer/components/__snapshots__/Home.spec.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -734,7 +734,15 @@ Array [
Privacy Policy
</a>
</li>
<li />
<li>
<style
dangerouslySetInnerHTML={
Object {
"__html": ".cky-btn-revisit-wrapper.cky-btn-revisit-wrapper, .cky-btn-revisit { display: none; }",
}
}
/>
</li>
</menu>
</div>
</div>
Expand Down
20 changes: 18 additions & 2 deletions src/app/errors/components/__snapshots__/ErrorBoundary.spec.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -217,7 +217,15 @@ Array [
Privacy Policy
</a>
</li>
<li />
<li>
<style
dangerouslySetInnerHTML={
Object {
"__html": ".cky-btn-revisit-wrapper.cky-btn-revisit-wrapper, .cky-btn-revisit { display: none; }",
}
}
/>
</li>
</menu>
</div>
</div>
Expand Down Expand Up @@ -598,7 +606,15 @@ Array [
Privacy Policy
</a>
</li>
<li />
<li>
<style
dangerouslySetInnerHTML={
Object {
"__html": ".cky-btn-revisit-wrapper.cky-btn-revisit-wrapper, .cky-btn-revisit { display: none; }",
}
}
/>
</li>
</menu>
</div>
</div>
Expand Down
8 changes: 5 additions & 3 deletions src/app/theme.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,15 @@
* Keeps the theme and the stylesheets honest.
*
* Jest maps `*.css` imports to a style mock, so these read the stylesheets off disk
* with `fs` instead of importing them. The audit itself lives in src/test/cssColors.ts,
* shared with `script/generate-theme-baseline.ts` so the two cannot disagree.
* with `fs` instead of importing them. REX's half of the audit lives in
* src/test/cssColors.ts, shared with `script/generate-theme-baseline.ts` so the two
* cannot disagree; the parsing underneath it comes from @openstax/ui-components.
*/
import { describeColor, stripNoise } from '@openstax/ui-components/theme/cssColors';
import fs from 'fs';
import path from 'path';
import {
colorViolations, describeColor, stripNoise, stylesheetFiles, tokenChoices,
colorViolations, stylesheetFiles, tokenChoices,
} from '../test/cssColors';
import theme from './theme';
import { themeCss, themeTokens } from './themeCss';
Expand Down
Loading