/** * CAD 자동색(`theme.ts` paintColor) 검증 — 검정 · 흰색 · 기본색은 바탕 따라 흰/검정, 다른 색은 그대로. * 실행: node --experimental-strip-types resources/tester/cad/theme-auto-color.test.ts */ import assert from 'node:assert/strict'; let theme = 'dark'; // biome-ignore lint: 시험 — 브라우저 전역 흉내 const g = globalThis as any; g.document = { documentElement: { getAttribute: () => theme } }; g.window = { matchMedia: () => ({ matches: true }) }; const { paintColor, isAutoColor } = await import( '../../../B07_DesignDetail/openwebcad/src/theme.ts' ); for (const color of ['#000000', '#000', '#FFFFFF', '#fff', '#f5f7fa', 'black']) { assert.ok(isAutoColor(color), `${color} 자동색`); } for (const color of ['#ff0000', '#111111', '#333333', '#1a237e', '#a55200']) { assert.ok(!isAutoColor(color), `${color} 자동색 아님`); } theme = 'dark'; assert.equal(paintColor('#000000'), '#ffffff', '어두운 바탕: 검정은 흰색'); assert.equal(paintColor('#f5f7fa'), '#ffffff', '어두운 바탕: 기본색은 흰색'); assert.equal(paintColor('#ffffff'), '#ffffff'); assert.equal(paintColor('#ff0000'), '#ff0000', '어두운 바탕: 빨강 그대로'); assert.equal(paintColor('#1a237e'), '#1a237e', '어두운 바탕: 남색 밝히지 않음'); assert.equal(paintColor('#333333'), '#333333', '어두운 바탕: 어두운 회색 밝히지 않음'); theme = 'light'; assert.equal(paintColor('#ffffff'), '#000000', '밝은 바탕: 흰색은 검정'); assert.equal(paintColor('#FFF'), '#000000'); assert.equal(paintColor('#000000'), '#000000'); assert.equal(paintColor('#f5f7fa'), '#000000', '밝은 바탕: 기본색은 검정'); assert.equal(paintColor('#ff0000'), '#ff0000', '밝은 바탕: 빨강 그대로'); assert.notEqual(paintColor('#ffff00'), '#ffff00', '밝은 바탕: 노랑 등 밝은 색은 대비 보정(기존)'); // 커서 입력창 — 칸 · 글 색이 두 테마 모두 달라야(자동색 둘을 쓰면 paintColor 가 같은 색으로 뒤집음) const { inputFieldColors } = await import( '../../../B07_DesignDetail/openwebcad/src/inputController/input-field-draw.ts' ); const TOKENS: Record> = { light: { '--cad-chrome-raised': '#ffffff', '--cad-line': '#e6e2e3', '--cad-text': '#333333', '--cad-text-dim': '#615e6e', }, dark: { '--cad-chrome-raised': '#251f38', '--cad-line': '#322a45', '--cad-text': '#e4e0f0', '--cad-text-dim': '#b3aec6', }, }; for (const name of ['light', 'dark']) { theme = name; const colors = inputFieldColors( (token: string, fallback: string) => TOKENS[name][token] ?? fallback ); assert.equal( colors.background, TOKENS[name]['--cad-chrome-raised'], `${name}: 칸 = 토큰 색 그대로` ); assert.notEqual(colors.background, colors.text, `${name}: 칸 · 글 색 다름`); assert.notEqual(colors.background, colors.dimText, `${name}: 칸 · 안내 글 색 다름`); assert.notEqual(colors.background, colors.border, `${name}: 칸 · 테두리 색 다름`); // 옛 상수 짝(#000000 칸 · #FFF 글)은 paintColor 를 거치면 같은 색 — 입력창은 건너뛰어야 assert.equal( paintColor('#000000'), paintColor('#FFF'), `${name}: 자동색 두 개는 같은 색으로 뒤집힘` ); } // 토큰 못 읽으면 폴백도 칸 · 글 다름 const fallback = inputFieldColors((_token: string, value: string) => value); assert.notEqual(fallback.background, fallback.text, '폴백: 칸 · 글 색 다름'); assert.ok(!isAutoColor(fallback.background) && !isAutoColor(fallback.text), '폴백: 자동색 아님'); console.log('theme 자동색 시험 통과');