Sign in

jest

it dev nextjs jest

Next.js with Typescript 프로젝트 테스트 코드 작성하기(jest, testing-library/react)

1. 현재 프로젝트 구성Next.js App router 사용TypescriptEslint  2. 테스트 툴 선택Jest 와 Testing Library 를 사용하기로 결정 3. 세팅1) Testing Libray React 패키지 설치(참고 : Installation - With Typescript)npm install --save-dev @testing-library/react @testing-library/dom @types/react @types/react-dom 2) Jest (React) 패키지 설치(참고: Testing React Apps - Setup With Create React App)npm install --save-dev jest react-test-renderer (참고: Nex..
wono | discuss |
it dev jest mock

[JEST] 📚 모킹 Mocking 정리 - jest.fn / jest.mock /jest.spyOn

Mocking 원리 mocking이란 (mock = 모조품) 뜻 그대로 받아드리면 된다. 즉 테스트하고자 하는 코드가 의존하는 function이나 class에 대해 모조품을 만들어 '일단' 돌아가게 하는 것이다. 한마디로, 단위 테스트를 작성할 때, 해당 코드가 의존하는 부분을 가짜(mock)로 대체하는 기법을 말한다. 왜 가짜로 대체하는가? 테스트 하고싶은 기능이 다른 기능들과 엮여있을 경우(의존) 정확한 테스트를 하기 힘들기 때문이다. 예를들어 request body에 사용자의 id와 password를 넣어서 post요청을 보내면 컨트롤러에서 정보를 추출한 후 데이터베이스에 넣어주는 단위테스트를 하고 싶다고 하자. 컨트롤러는 라우터에서 응답을 보내는 미들웨어를 특별히 부르는 말이다. 그냥 함수다. 데..
wono | discuss |
it dev nextjs jest

NextJS 테스트 코드 작성하기 - 리액트 테스트에 대하여

해당 글은 John Ahn 님의 따라하는 리액트테스트 강의를 참고하여 작성했습니다. 왜 애플리케이션을 TEST 해야 할까요? 간단하게 더 안정적인 애플리케이션을 위해서는 여러 방법으로 테스트를 해줘야 더 안정적인 애플리케이션이 될 수 있습니다. 테스팅으로 얻는 이점은 무엇일까요? 디버깅 시간을 단축! 만약 데이터가 잘못 나왔다면 그것이 UI의 문제인지 DB의 문제인지등 전부 테스트를 해봐서 찾아야 하는데 테스팅 환경이 구축된 어있다면 자동화된 유닛 테스팅으로 특정 버그를 쉽게 찾아낼 수 있습니다. 더욱 안정적인 애플리케이션! 많은 테스트 코드와 함께 작성된 코드의 애플리케이션이 되기 때문에 훨씬 안정적인 애플리케이션이 됩니다. 이밖에도 재설계 시간의 단축과 추가로 무언가를 더 구현해야 할 때 더 용이하게..
wono | discuss |