MSW(Mock Service Worker)

원래 목적은 vitest(Jest) 와 같은 unit test에서 필요한 경우에 사용하려 했었다.

 

지난 인터널 테스트를 진행하면서 경우의 수가 16가지 정도로 복잡했는데 초기에 7일만 작업하고 버릴 코드라고 생각해서 테스트 코드 없이 진행했다가 QA에서 버그도 많이 발견되고 한 경우를 고치면 다른 곳에서 버그가 발생해서 무조건 꼼꼼하게 짜리라 다짐했었다.

 

하지만 이번 scope에 신규로 공부해야할 내용이 많아 MSW를 vitest에 포함시키지 않고, storybook에 경우 별로 정의하는데 사용했다.

처음엔 vitest에 넣어보려다 어디서부터 어디까지 테스트 코드를 작성할지 정해지지 않은 상태였지만 도입하고 싶었던 이유였던 16가지 경우에 어떤 component가 rendering 됐는지와 그 경우 별로 원하는 action을 작성하기 위해서였다.

 

근데 인터널 테스팅의 복잡한 경우를 UX 디자이너가 잘 풀어줌과 동시에 적어진 Scope으로 크게 복잡함이 없어 Storybook에만 포함시키고 PO분께 검토를 요청드리는걸로 변경했다.

 

다음 Scope에서 Vitest에서 사용하는걸 공부하고 작성해보려한다.

 

https://www.daleseo.com/mock-service-worker/

MSW로 백앤드 API 모킹하기

FE / BE 나눠서 개발할때도 FE 개발자가 API를 기다리지 않고 개발하는 컨셉도 좋아보인다.