테스트코드 2

MSW(Mock Service Worker)를 사용한 네트워크 단 API Mocking 테스트

MSW(Mock Service Worker) MSW는 서비스 워커(Service Worker)를 사용하여 실제 요청(Requests)을 중간에서 가로채 API를 Mocking 해주는 라이브러리이다. 기존의 라이브러리들과는 다르게 네트워크 단에서 실제로 요청을 주고받으며 테스트를 진행할 수 있는 장점이 있으며, REST API 및 GraphQL 모두 지원하고 있다. 프런트엔드 개발에서 Mock API는 떼려야 뗄 수 없는 부분인 것 같다. 개발을 위한 목업 데이터 만들고 관련 로직과 컴포넌트를 만든다. API 개발을 기다리며 타입을 작성하고, 여러 가지 테스트를 진행한다. 여러 이슈들은 대부분이 잘못된 API를 호출하거나 에러 처리를 잘못하였을 때 발생하기 때문에 Mock API를 사용하여 디버깅을 해보는..

개발/아티클 2022.08.23

cypress e2e 테스트 - Failed to connect to Chrome, retrying in 1 second 문제 해결

E2E 테스트를 위해 Cypress를 설치 및 스크립트 추가 { "scripts": { "cypress:open": "cypress open" } } 아래와 같은 문제가 발생 cypress 창에서는 다음과 같은 경고창을 보여준다. 간단히 메시지를 해석하자면, 50초 동안 재시도했지만 크롬 브라우저를 여는 과정에서 어떤 문제가 있는 것 같다고 말해준다. CDP 포트는 61664 에 요청되었음 1. 첫번째 해결책 이 문제를 해결하기 위해 구글링, 스택오버플로우를 열심히 찾아봤다. 나와 같은 문제를 겪었던 많은 사람들의 질문을 발견. Cypress run won’t finish, stuck while making connection to Chrome · Issue #6540 · cypress-io/cypres..