useAsyncData handler의 DTO 변환을 순수 함수로 검증합니다.
API 원본을 화면 DTO로 바꾸는 함수를 분리하면 Nuxt runtime 없이 경계값을 테스트할 수 있습니다. 실제 프로젝트에서는 Vitest에서 자동화합니다.
누락 필드, 빈 배열, 범위 밖 숫자와 정상값을 검사합니다.
서버와 클라이언트가 같은 schema를 공유하더라도 외부 입력은 런타임 검증합니다.
snapshot 하나만 크게 저장하면 중요한 업무 규칙 회귀 원인을 찾기 어렵습니다.
로컬 프로젝트에서 확인해보세요done이 total보다 크면 오류가 나는 테스트를 추가하세요.
<script setup>
function toProgress(value) {
if (!Number.isInteger(value.done) || value.total < 1)
throw new RangeError("invalid progress");
return Math.round((value.done / value.total) * 100);
}
const tests = [
{ name: "절반", passed: toProgress({ done: 5, total: 10 }) === 50 },
{
name: "0 거절",
passed: (() => {
try {
toProgress({ done: 0, total: 0 });
return false;
} catch {
return true;
}
})(),
},
];
</script>
<template>
<main>
<h1>DTO 변환 테스트</h1>
<ul>
<li v-for="t in tests" :key="t.name">
{{ t.passed ? "PASS" : "FAIL" }} {{ t.name }}
</li>
</ul>
</main>
</template>