css-component-testing
Guides CSS and layout tests for FigUI3 components. Use when validating component CSS, nested selectors, tokens, interaction states, computed styles, layout boxes, or visual regressions.
소스 정보
- 저장소
- rogie/figui3
- 최근 소스 활동
- 2026년 6월 1일 17:43
- 감지된 SKILL.md 언어
- 영어
- 스타
- 71
- 포크
- 2
설치 방법
기본적으로 소스를 먼저 확인하는 Prompt가 선택됩니다. 직접 명령으로 전환하거나 로컬 사본을 다운로드할 수도 있습니다.
소스 파일 검토
설치 여부를 결정하기 전에 SKILL.md와 SkillsMP에 표시된 보조 파일을 읽어 보세요.
SKILL.md 표시 중
SKILL.md
소스 지침 · 읽기 전용 미리보기- name
- css-component-testing
- description
- Guides CSS and layout tests for FigUI3 components. Use when validating component CSS, nested selectors, tokens, interaction states, computed styles, layout boxes, or visual regressions.
# CSS Component Testing
Test public CSS behavior in a browser. Prefer computed styles and bounding boxes for stable assertions; use screenshots only for targeted visual regressions.
## What To Test
- Token-driven styles resolve through CSS custom properties.
- Public states work: hover, focus, selected, disabled, open, dragging.
- Layout dimensions and positioning stay within expected bounds.
- Light and dark `color-scheme` paths do not throw or hide content.
- Nested selectors compile through the existing build pipeline.
## Test Pattern
1. Mount the smallest fixture that exposes the CSS behavior.
2. Wait for custom elements and fonts/layout to settle.
3. Read `getComputedStyle`, `getBoundingClientRect`, or public attributes/classes.
4. Assert behavior, not implementation details, unless debugging a specific regression.
## Avoid
- Broad screenshot snapshots for every component.
- Assertions tied to browser antialiasing or exact subpixel layout unless necessary.
- Testing private class names when a public attribute/state can be asserted instead.
GitHub에서 보기