eomsangdonandClaude Opus 5.5
9f0ab53c53
- 칸 = --cad-chrome-raised(밝음 흰 칸 + --cad-line 테두리 · 어두움 #251f38) · 글 = --cad-text · 안내 = --cad-text-dim - fillRectScreen · drawTextScreen 에 paintColor 건너뛰는 rawColor 선택 인자 - 입력창 그리기를 inputController/input-field-draw.ts 로 · 전체 맞춤 계산을 drawControllers/fit-view.ts 로(700줄) - App.consts 입력창 색 상수 = 토큰 폴백 · 틀린 주석 고침 - 시험 theme-auto-color: 칸 · 글 색이 두 테마 모두 다름 Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_015KYZ2HWWdUwZWYnn3tQz7X
84 lines
3.6 KiB
TypeScript
84 lines
3.6 KiB
TypeScript
/**
|
|
* 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<string, Record<string, string>> = {
|
|
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 자동색 시험 통과');
|