diff --git a/frontend/src/v2/__tests__/signalTokens.test.ts b/frontend/src/v2/__tests__/signalTokens.test.ts index 8b61591fe..2e906bab7 100644 --- a/frontend/src/v2/__tests__/signalTokens.test.ts +++ b/frontend/src/v2/__tests__/signalTokens.test.ts @@ -98,6 +98,30 @@ describe('D223 Signal tokens in v2.css', () => { expect(valueIn(light, 'v2-shadow')).toBe('none'); expect(valueIn(light, 'v2-shadow-lg')).toBe('none'); }); + + // CSS comments don't nest: the first `*/` ends one. A comment that quotes a + // glob like `--v2-radius-*/--v2-shadow-*` ends early, and the browser then + // throws away its tail and everything up to the next `;`, which takes the + // declaration after it too. The raw text still reads right, so the pins + // above can't see it: light --v2-ink-2 was empty in Chromium this way. + const asCssReadsIt = (text: string): string => text.replace(/\/\*[\s\S]*?\*\//g, ' '); + + test('no comment in v2.css ends early', () => { + expect(asCssReadsIt(css)).not.toContain('*/'); + }); + + test('each Signal token opens its own declaration in every set', () => { + const swallowed: string[] = []; + for (const [label, block] of [['light', light], ['dark', dark], ['media', media]] as const) { + const read = asCssReadsIt(block); + for (const name of Object.keys(ARTBOARD)) { + const at = read.indexOf(`--${name}:`); + const before = read.slice(0, at).trimEnd().slice(-1); + if (at === -1 || !/[;{]/.test(before)) swallowed.push(`${label} --${name}`); + } + } + expect(swallowed).toEqual([]); + }); }); // TASK-681: three surfaces were hard-coded to light values and vanished in dark. diff --git a/frontend/src/v2/v2.css b/frontend/src/v2/v2.css index 1a18745b8..ed3b6d349 100644 --- a/frontend/src/v2/v2.css +++ b/frontend/src/v2/v2.css @@ -176,7 +176,7 @@ body.modern-ui.v2-canvas { --v2-radius-pill: 999px; /* D223 Signal primitives (TASK-730), from the d215 artboard :root. Additive: - the old --v2-radius-*/--v2-shadow-* values above stay until PR2 moves + the old --v2-radius and --v2-shadow values above stay until PR2 moves consumers onto the scale. Pinned by __tests__/signalTokens.test.ts. */ --v2-ink-2: #1d2433; --v2-fill-a: #333c4e;