vhv3y8/unraveling

스벨트 테스트 코드 알아보기 (1) (vitest)

2025.03.19.

svelte@5.23.2, 하지만 연관된 파일의 마지막 수정은 11/10/2023

스벨트는 테스트 라이브러리로 vitest를 사용한다.

packages/svelte/tests/
├── suite.ts
├── css/
│   ├── test.ts
│   └── samples/
│       ├── basic/
│       │   ├── input.svelte
│       │   └── expected.css
│       ├── animations/
│       │   ├── input.svelte
│       │   └── expected.css
│       └── ..
└── ..
  • packages/svelte/tests/ 폴더는 css, store, runtime-browser, parser-modern 등의 테스트 폴더로 분류되어있다.
  • 각 테스트 폴더들은 test.ts 파일과, 필요에 따라 samples 폴더를 갖고 있다.
  • tests/suite.ts 파일에서 suite 관련 함수들을 정의하고 있으며, 각 test.ts 파일에서 그걸 사용한다.

css 폴더의 경우, input.svelte를 컴파일해서 expected.css가 출력되는지 확인하는 식으로 테스트가 구성된다.

tests/css/test.ts

import { suite } from '../suite.js';

const { test, run } = suite<CssTest>(async (config, cwd) => {
  // ...
})

export { test };

await run(__dirname); // packages/svelte/tests/css