Test (6) 썸네일형 리스트형 [vitest] 테스트 코드 작성 시 검증(Assertion) 전략 비교 - 엄격한 비교 vs 유연한 비교 1. 들어가며테스트 코드 작성 시 검증(Assertion)은 코드의 예상대로 작동하는지 확인하는 핵심 과정입니다. 효과적인 테스트는 꼼꼼한 검증에서 비롯되며, 다양한 상황에 맞춰 적절한 검증 방식을 선택하는 것이 중요합니다. 때로는 엄격한 비교가 필요하고, 때로는 유연한 비교가 더 적합할 수 있습니다. 이 글에서는 Vitest를 사용하여 테스트 코드를 작성할 때, 엄격한 비교와 유연한 비교라는 두 가지 주요 검증 전략을 비교 분석하고, 각각의 장단점과 사용 시점을 제시하여 상황에 맞는 최적의 검증 전략을 선택하는 방법에 대해 알아보겠습니다.2. 두 가지 검증 전략 비교2.1 엄격한 비교 (Strict Comparison)엄격한 비교는 예상 결과와 실제 결과가 정확히 일치하는지 확인하는 방법입니다. Vit.. JavaScript 개발자를 위한 TPP(Transformation Priority Premise) 가이드 테스트 주도 개발(TDD)을 하면서 "어디서부터 시작해야 할까?", "어떤 테스트를 먼저 작성해야 할까?"와 같은 고민을 해본 적 있으신가요? TDD의 개념은 좋지만 막상 적용하려니 어려움을 느끼는 프론트 개발자분들을 위해, Robert C. Martin, 이 제시한 변환 우선순위 전제(Transformation Priority Premise, TPP)를 간단히 소개하고자 합니다. TPP란 무엇일까요?TPP는 TDD 주기 동안 코드를 변경하는 작업을 단순하고 점진적으로 수행하는 것을 목표로 합니다. TDD 과정에서 막히거나 오랜 시간이 걸리는 상황을 방지하고, 코드의 복잡성을 최소화하는 데 초점을 맞춥니다. 쉽게 말해, 가장 간단한 변화부터 시작해서 점진적으로 복잡도를 높여가는 방식입니다. TPP의 핵.. [vitest] Framer Motion 컴포넌트 테스트 구현하기 - Vitest와 Proxy 패턴 활용 ( feat. react ) Framer motion ( 요즘은 motion 이란 이름으로 더 알려져 있는) 라이브러리를 사용해서 화면 애니메이션을 구현하다보니...테스트 시에 어찌해야할 지 감이 오지 않았습니다. 하지만 생각해보니 단위 테스트는 비즈니스 로직과 핵심 기능을 검증하는 것이 목적 이므로 할 필요가 없다는 결론에 도달했습니다😅😅😅 그렇지만 proxy 패턴을 써보았다는 거에 의의를 두고... 아래 내용은 남겨두도록 하겠습니다 다른 분께서 포스팅해놓은 글에서 힌트를 얻어 다행히 Framer motion 테스트를 할 수 있게 되었습니다😂https://dev.to/tmikeschu/mocking-framer-motion-v4-19go Mocking framer-motion v4Testing Library has ch.. [번역] Next.js를 위한 테스트 도구 https://www.codewalnut.com/learn/5-best-testing-tools-for-next-js 5 Best Testing Tools for Next.jsJest, coupled with React Testing Library, is a powerful combination for testing Next.js applications. Jest is a JavaScript testing framework that offers a zero-config setup, making it easy to get started. React Testing Library provides utilities for testinwww.codewalnut.com위의 번역글이지만 본문에서 따로 언급한 AI 테.. [RTL] 디버깅 팁 1. screen.debug() 사용 2. logRoles 메서드 사용import { logRoles } from '@testing-library/react' const { container } = render() logRoles(container) html 태그가 테스트 로그창에 나온다 3. 서버 호출이나 async 을 사용하면서 getBy* 로 테스트를 해서 원하는 요소를 못찾았다면await findBy* 로 수정 4. userEvent 메서드를 사용하면 await 사용하기 test('예시 테스트', async () => { const user = userEvent.setup() render( ) // 생략 const chkBox = await scre.. [Vitest] 1. 테스트란 무엇인가? 테스트란 무엇인가? 테스트는 광범위한 용어이며, 결국에는 일반적으로 무언가가 의도한 대로 작동하는지 확인하는 것을 의미합니다. 그리고 소프트웨어를 작성하거나 웹사이트를 구축할 때, 결국에는 소프트웨어를 작성하는 것이므로 일반적으로 소프트웨어나 구축 중인 웹사이트가 예상대로 작동하는지 테스트하고 싶습니다. 물론 이를 검증할 수 있습니다. 수동 테스트를 통해 소프트웨어나 웹사이트를 테스트할 수 있지만 수동 테스트에는 몇 가지 단점이 있으므로 수동 테스트 외에도 자동 테스트를 수행할 수 있습니다. 수동 테스트는 예를 들어 데모 웹사이트를 구축하는 동안 시스템에서 로컬로 방문한다는 의미입니다. 따라서 개발 서버를 가동하고 작업하는 동안 웹사이트를 테스트하고 사이트에서 작업하는 동안 다양한 기능을 테스트할 수 .. 이전 1 다음
