bklit/bklit-ui

unit-tests

Guardrails for adding unit tests in bklit-ui without over-testing.

소스 보기

사용 방법

  1. 설치 명령을 복사하고 자신의 에이전트 환경에 설치하기 전에 소스 패키지를 확인하세요.
  2. 필요한 도구, 인증 정보, 지원 환경은 원본 문서에서 확인하세요.
  3. 입력과 원하는 산출물을 설명하고 출처와 결과를 대조하세요.
npx skills add https://github.com/bklit/bklit-ui --skill unit-tests

시작 전 확인

  • 설치에는 모델 구독, API 한도, 파일 접근 권한이 포함되지 않습니다.
  • 별점 수와 설치 수는 활동 지표이며 독립적인 품질·보안 검증이 아닙니다.
원본 Skill 문서

원본 저장소의 제목, 예시, 코드, 표, 링크, 이미지를 유지해 표시합니다.

Unit Tests (bklit-ui)

Read this skill before proposing or writing tests. Default stance: fewer, higher-signal tests.


When to add tests

Add tests when they lock in behavior that is easy to break silently:

Worth testingWhy
Pure functions / modulesStable inputs → outputs; fast; no DOM
Formatters, parsers, scale math, boundsRegression on string/number output is user-visible
Codegen / export / registry helpersOutput shape is the contract
Non-obvious edge casesEmpty data, reversed ranges, clamping

Examples in this repo: chart-formatters.test.ts, highlight-segment-bounds.test.ts, animation.test.ts, apps/web/lib/studio/__tests__/*.


When NOT to add tests (unless explicitly requested)

Do not add tests just to increase coverage or “be thorough”:

SkipWhy
React component render smoke testsvisx, motion, portals → brittle; manual/docs check is cheaper
memo() / guard extractions (#65-style)Structural perf refactors; output unchanged; RTL mount assertions are heavy
Default prop passthroughformatValue = intFmt — types + formatter tests cover it
Third-party library behaviorDon’t re-test d3, visx, or React
Trivial getters / one-line wrappersNo regression signal
Snapshot entire chart SVG/JSXHigh churn, low signal

If the user asks “should we test X?” — say no when X falls in this table, and suggest a lighter alternative (pure helper test, manual check, CI build).


Repo conventions

Runner: Node built-in test runner + tsx (not Jest/Vitest unless the repo adopts them later).

bash
pnpm test              # root — turbo runs packages with a test script
pnpm --filter @bklitui/ui test
cd apps/web && pnpm test

Place tests: **/__tests__/**/*.test.ts next to the code under test.

Pattern:

ts
import assert from "node:assert/strict";
import { describe, it } from "node:test";
import { myFn } from "../my-module";

describe("myFn", () => {
  it("handles empty input", () => {
    assert.equal(myFn([]), expected);
  });
});

Equivalence tests (preferred for formatters): assert shared module output matches the previous inline call (e.g. toLocaleDateString with same locale/options) so tests stay timezone-safe and prove no visual regression.

New package test script: add to package.json:

json
"test": "node scripts/run-tests.mjs"

Use a small scripts/run-tests.mjs that collects *.test.ts from __tests__ and invokes node --import tsx --test — shell globs break on Linux CI. Add tsx as a devDependency if missing. Wire into root turbo.json test task; CI runs pnpm test.


Decision checklist (run before writing)

  1. Is the logic pure or extractable to pure functions? → Test that. Consider extracting first.
  2. Would a test fail on a real user-visible bug? → Good candidate.
  3. Does it need jsdom / RTL / Playwright? → Stop; justify to user or defer to manual/visual check.
  4. Did the user ask for tests? → Still apply this skill; don’t over-deliver.
  5. How many cases? → 3–10 focused cases, not exhaustive matrices.

What to tell the user

When recommending tests, be explicit:

  • Add: “Test chart-formatters.ts — pure, high regression value.”
  • Skip: “Skip component tests for the memo split — no output change; build + manual chart docs are enough.”
  • CI: Mention pnpm test in PR test plan when adding or changing tests.

Anti-patterns

  • Adding Jest/Vitest/Testing Library for a one-off without team buy-in
  • Mocking entire chart context to assert useMemo call counts
  • Testing implementation details (hook order, internal component names)
  • Duplicating type-checker work (expect(typeof x).toBe('function'))
  • Committing tests that only pass locally due to hard-coded timezone/locale strings

관련 작업

같은 저장소의 Skills

더 많은 Skills

모든 Skills