fix(design): derive control semantics and preserve inspection coverage

Author: Bill Leoutsakos

scripts/check-design-conformance-colour-assignments.test.ts

@@ -339,12 +339,16 @@ test('local overrides of global tokens are checked too', () => {
   expect(result.findings).toHaveLength(1)
 })
 
-test('a missing token cannot evade checking when its external CSS use is outside the source snapshot', () => {
+test('a missing token remains unchecked when its consumer is outside the source snapshot', () => {
   for (const body of [
     `<span className='[--rest:var(--missing)]'/>`,
     `<span style={{'--rest':'var(--missing)'}}/>`,
   ])
-    expect(flagged({ [ui]: `export const View=()=>${body}` })).toHaveLength(1)
+    expect(
+      inspect({ [ui]: `export const View=()=>${body}` }).unchecked.some((note) =>
+        note.reason.includes('--rest')
+      )
+    ).toBe(true)
   expect(
     issues({ [css]: '.label { --a: var(--b); --b: var(--a); }' }).length
   ).toBeGreaterThanOrEqual(2)
@@ -527,3 +531,10 @@ test('a global shadow must contain a complete shadow recipe, not just a named va
     }).assignments.some((a) => a.name === 'box-shadow' && a.status === 'verified')
   ).toBe(true)
 })
+
+test('unresolved layout-only aliases are not colour findings', () => {
+  const report = inspect({ [css]: '.label{--layout:var(--missing);width:var(--layout)}' })
+  expect(report.findings).toEqual([])
+  expect(report.unchecked.some((n) => n.file === css && n.reason.includes('--layout'))).toBe(true)
+  expect(flagged({ [css]: '.label{--ink:var(--missing);color:var(--ink)}' })).toHaveLength(1)
+})

scripts/check-design-conformance-control-comparison.test.ts

@@ -412,8 +412,7 @@ test('editing an imported style helper revokes an unchanged consumer approval',
     const report = await checkComparison({ repo, base, head, policy: 'conformance' })
     expect(report.status).toBe('completed')
     expect((report.colourAssignments?.introduced ?? 0) + report.unchecked.length).toBeGreaterThan(0)
-    if (body.includes('hotpink') || body.includes('var(--missing)'))
-      expect(report.flagged).toBe(true)
+    if (body.includes('hotpink')) expect(report.flagged).toBe(true)
   }
 })
 
@@ -458,3 +457,19 @@ test('the public diff includes local custom-property writes despite legacy token
     report.findings.some((f) => f.rule === 'central-colour-assignment' && f.value.includes('red'))
   ).toBe(true)
 })
+
+test.each([
+  ['apps/sim/components/large.css', `/*${'x'.repeat(2 * 1024 * 1024)}*/`],
+  ['packages/emcn/src/icons/broken.tsx', 'export const Mark=()=> <svg'],
+])('skipped CSS and malformed central artwork fail inspection: %s', async (file, code) => {
+  const repo = mkdtempSync(path.join(temp, 'inspection-'))
+  git(repo, ['init', '-q'])
+  put(repo, 'apps/sim/app/_styles/globals.css', ':root{--text-body:#444}')
+  const base = commit(repo)
+  put(repo, file, code)
+  const report = await checkComparison({ repo, base, head: commit(repo), policy: 'conformance' })
+  expect(report.status).toBe('failed')
+  expect(report.error).toMatch(/failure|parse|exceeds/i)
+  if (file.endsWith('.css'))
+    expect(report.coverageFailures?.some((note) => note.file === file)).toBe(true)
+})

scripts/check-design-conformance-controls.test.ts

@@ -229,3 +229,11 @@ test('a CSS-hidden programmatic trigger is not an unnamed visible button', () =>
     )
   ).toHaveLength(1)
 })
+
+test('statically resolved ARIA buttons require a name', () => {
+  expect(matching(run('<div role="button"/>'), 'control-accessible-name')).toHaveLength(1)
+  expect(
+    matching(run('<div role="button" aria-label="Run"/>'), 'control-accessible-name')
+  ).toHaveLength(0)
+  expect(matching(run('<div role={role}/>'), 'control-accessible-name')).toHaveLength(0)
+})

scripts/check-design-conformance-coverage.test.ts

@@ -1,13 +1,15 @@
 /** biome-ignore-all lint/suspicious/noTemplateCurlyInString: Fixtures contain proposed source text. */
 import { readFileSync } from 'node:fs'
 import { expect, test } from 'vitest'
-import type { ControlSource } from '#control-analysis/model'
+import { associateFindings } from '#control-analysis/associations'
+import type { ControlSource, InventoryFinding } from '#control-analysis/model'
 import { ReviewCollector } from '#control-analysis/review'
 import { findingFingerprint, matchReviews } from '#control-analysis/review-ledger'
 import { productScope } from '#control-analysis/scope'
 import { inspectSimplifications } from '#control-analysis/simplifications'
 import { extract } from '#design-conformance/extract'
 import type { GeneratedContracts } from '#design-conformance/generated-contracts'
+import { inspectionFailure } from '#design-conformance/model'
 
 const globals = 'apps/sim/app/_styles/globals.css'
 const ui = 'apps/sim/components/example.tsx'
@@ -431,3 +433,55 @@ test('hidden false and runtime visibility cannot hide local control styling', ()
     }).review.findings.some((f) => f.rule === 'local-control')
   ).toBe(false)
 })
+
+test.each([
+  'export const View=()=> <style>{".label {color: #abc}"}</style>',
+  'export const View=()=> <style>.label &#123;color: #abc&#125;</style>',
+])('literal JSX styles remain visible: %s', (code) => {
+  const report = inspect({ [ui]: code })
+  expect(report.review.findings.some((f) => f.rule === 'runtime-style')).toBe(true)
+  expect(report.review.unchecked.some((n) => n.file === ui && n.reason.includes('style'))).toBe(
+    true
+  )
+})
+
+test('conditional input branches remain directly associated with their control', () => {
+  const finding: InventoryFinding = {
+    id: 'branch',
+    rule: 'component-chrome',
+    category: 'colours',
+    property: 'color',
+    file: ui,
+    line: 1,
+    column: 10,
+    context: 'View / @sim/emcn#Button / className/then',
+    value: 'text-white',
+    reason: 'owned chrome',
+    observedFrom: [ui],
+  }
+  const uses = [
+    {
+      id: 'control',
+      file: ui,
+      line: 1,
+      column: 1,
+      endLine: 1,
+      endColumn: 40,
+      owner: 'View',
+      tag: 'Button',
+      slots: [{ name: 'className', line: 1, column: 5, endLine: 1, endColumn: 30 }],
+    },
+  ]
+  expect(associateFindings(uses, [finding], () => ['@sim/emcn#Button']).get('control')).toEqual({
+    direct: ['branch'],
+    potential: [],
+  })
+})
+test.each([
+  'CSS assignment source is nonregular or exceeds the parsing limit',
+  'Artwork parser failure; only blob change is known',
+  'Artwork source exceeds the 2 MiB parsing limit',
+  'Artwork symlink/submodule is not followed',
+])('inspection failures are not unresolved styling: %s', (reason) => {
+  expect(inspectionFailure(reason)).toBe(true)
+})

scripts/check-design-conformance-io.test.ts

@@ -227,3 +227,30 @@ test('unwritable CLI output remains an operational exit, not an uncaught retry',
   expect(result.status).toBe(2)
   expect(result.stderr.toString()).toContain('failed')
 })
+
+test.each(['missing', 'invalid'])(
+  'invalid review ledger still writes a failed CLI artifact: %s',
+  (kind) => {
+    const ledger = path.join(repo, `ledger-${kind}.json`)
+    if (kind === 'invalid') writeFileSync(ledger, '{')
+    const output = path.join(repo, `ledger-report-${kind}.json`)
+    const result = spawnSync('bun', [
+      '--no-env-file',
+      cli,
+      '--policy',
+      'appearance',
+      '--repo',
+      repo,
+      '--base',
+      base,
+      '--head',
+      head,
+      '--reviews',
+      ledger,
+      '--output',
+      output,
+    ])
+    expect(result.status).toBe(2)
+    expect(JSON.parse(readFileSync(output, 'utf8')).status).toBe('failed')
+  }
+)

scripts/check-design-conformance-recipes.test.ts

@@ -171,3 +171,9 @@ test('block-local recipe aliases cannot shadow the following outer return', () =
   expect(values(first)).not.toEqual(values(first.replace('tier=7', 'tier=8')))
   expect(values(first)).toEqual(values(first.replace('tier=12', 'tier=13')))
 })
+
+test('returned closures retain captured lexical recipe values', () => {
+  const code = 'export function choose(){const local=7;return ()=>local}'
+  expect(values(code)).not.toEqual(values(code.replace('local=7', 'local=8')))
+  expect(extract(code).unchecked).toEqual([])
+})

scripts/check-design-conformance-tokens.test.ts

@@ -264,3 +264,32 @@ describe('only introduced violations', () => {
     expect(existsSync(marker)).toBe(false)
   })
 })
+
+test('checked-to-unsupported renames preserve coverage diagnostics', () => {
+  const report = diff(
+    element('text-[#123456]'),
+    element('text-[#123456]'),
+    'apps/sim/components/view.md',
+    ui
+  )
+  expect(report.coverage.unsupportedFiles).toBe(1)
+  expect(
+    report.unchecked.some(
+      (n) =>
+        n.file === 'apps/sim/components/view.md' &&
+        n.side === 'after' &&
+        n.reason.includes('Unsupported file format')
+    )
+  ).toBe(true)
+})
+test.each(['currentcolor', 'CURRENTCOLOR', 'currentColor'])(
+  'CSS current color is case insensitive: %s',
+  (value) => {
+    expect(diff('', `.label{color:${value}}`, 'apps/sim/components/a.css').findings).toEqual([])
+  }
+)
+test('literal ring offset colours are inspected', () => {
+  expect(
+    diff('', element('ring-offset-[#123456]')).findings.some((f) => f.category === 'colours')
+  ).toBe(true)
+})

scripts/check-design-conformance-typography.test.ts

@@ -174,3 +174,12 @@ test('font-size tokens cannot approve a font-weight declaration', () => {
     review({ 'apps/sim/components/a.css': '.a {font-weight:var(--text-sm)}' }).classifications
   ).toEqual([])
 })
+
+test('uninspected CSS cannot establish global weight token ownership', () => {
+  const result = review({
+    'apps/sim/components/gap.css': '.gap{',
+    'apps/sim/components/a.css': '.a{font-weight:var(--font-weight-semibold)}',
+  })
+  expect(result.classifications).toEqual([])
+  expect(result.unchecked.some((n) => n.file === 'apps/sim/components/gap.css')).toBe(true)
+})

scripts/design-conformance/central-recipes.ts

@@ -164,7 +164,7 @@ export function extractCentralRecipes(
             t.isArrowFunctionExpression(node)
           ) {
             if (node.async || node.generator) return fail()
-            const inner = new Map(bindings)
+            const inner = new Map(scope)
             const defaults: Value[] = []
             node.params.forEach((p, i) => {
               const id = t.isAssignmentPattern(p) ? p.left : p

scripts/design-conformance/cli.ts

@@ -56,12 +56,19 @@ try {
   } catch (error) {
     report = linter.report(null, error instanceof Error ? error.message : 'Operational failure')
   }
-  if (args.reviews && report.status === 'completed')
-    report.reviewDecisions = matchReviews(
-      readReviewLedger(args.reviews as string, args.repo as string),
-      report.findings,
-      []
-    )
+  if (args.reviews && report.status === 'completed') {
+    try {
+      report.reviewDecisions = matchReviews(
+        readReviewLedger(args.reviews as string, args.repo as string),
+        report.findings,
+        []
+      )
+    } catch (error) {
+      report.status = 'failed'
+      report.flagged = null
+      report.error = error instanceof Error ? error.message : 'Review ledger inspection failed'
+    }
+  }
   if (output) writeJson(output, report)
   else process.stdout.write(`${JSON.stringify(report, null, 2)}\n`)
   process.exitCode = report.status === 'failed' ? 2 : report.flagged ? 1 : 0