철학

Mock Service Worker의 기반이 되는 사고 모델.

이 페이지는 MSW와, 더 나아가 여러분이 API 모킹을 접근할 때 채택하는 사고방식을 설명합니다. 개념적 수준에서 MSW를 독특하게 만드는 요소가 무엇인지 궁금해하는 사람들과 더 실용적인 관점을 원하는 사람들을 위해 준비한 페이지입니다. 더 실용적인 관점을 원한다면 비교 페이지를 참고하세요.

독립적인 계층으로서의 모킹

Mock Service Worker(MSW)는 다른 API 모킹 솔루션과 비슷하면서도 전혀 다릅니다. MSW는 외부로 나가는 요청을 가로채고 그 응답을 모킹할 수 있는 기능을 제공하지만, 특정 테스트나 개발 도구에 종속되지 않습니다. 이 작은 차이가 MSW가 제공하는 대부분의 장점을 가능하게 합니다.

우리는 API 모킹이 애플리케이션에서 독립적인 계층을 가질 만큼 중요하다고 믿습니다. 네트워크를 언제 어디서나 제어할 수 있다면, 네트워크 관련 코드를 테스트하거나 특정 네트워크 시나리오를 재현하고 디버깅하는 등 다양한 상황에서 유용하게 사용할 수 있습니다. 다른 도구의 기능으로서 API 모킹을 사용할 때는 항상 그 도구의 제약에 묶이기 때문에 이러한 수준의 제어는 불가능합니다. 하지만 MSW에는 그런 제약이 없습니다.

Mock vs 네트워크 동작

이 문서에서는 “mock”이라는 용어를 거의 사용하지 않습니다. 역사적으로 이 용어는 부정적인 의미와 강하게 연결되어 왔습니다. 개발자들은 모킹을 더럽고, 신뢰할 수 없으며, 임시방편적인 것으로 여기곤 했습니다. 사실 MSW가 등장하기 전까지는 그랬습니다.

MSW는 나가는 네트워크 트래픽을 가로챌 때 최소한의 침입 프레임워크를 사용합니다. 이는 브라우저에서 지정된 서비스 워커를 사용하거나, Node.js에서 코드의 무결성에 초점을 맞춘 커스텀 요청 가로채기 알고리즘을 구현함으로써 코드를 전혀 변경하지 않음을 의미합니다. 우리는 여러분의 애플리케이션을 존중하기 위해 많은 노력을 기울였고, 그 대가로 새로운 용어인 네트워크 동작을 만들었습니다.

네트워크 동작은 네트워크의 예상 상태를 계약처럼 설명한 것입니다. “요청 X가 발생하면 Y로 응답한다.” 이것이 바로 MSW를 사용할 때 작업하게 될 추상화 수준이며, 읽기 쉽고 확장성 있으며 유지보수하기 좋은 수준입니다.

플랫폼 활용하기

이전에 API 모킹 솔루션을 사용해 본 적이 있다면, 그 문법과 구현 방식이 얼마나 다양할 수 있는지 알 것입니다. 메서드 체이닝부터 컨트롤러 정의, JSON 파일에 네트워크 시나리오를 나열하거나 프레임워크 같은 라우팅을 채택하는 방식까지. 특정 도구에만 적용되는 지식을 항상 기억해야 하며, 종종 API를 모킹할 때 실제로 무엇을 하고 있는지 배우지 못하는 경우가 많습니다.

우리는 개발자 교육을 개발자 경험의 필수불가결한 부분으로 봅니다. MSW를 사용하기 위해 필요한 라이브러리 특정 지식을 최소화하기 위해 지속적으로 노력합니다. 대신, 표준 API와 플랫폼 기능에 의존하여 여러분이 실제로 요청과 응답을 다루는 방법을 배울 수 있도록 합니다(그리고 더 적은 코드를 배포할 수 있어서 좋습니다!).

우리는 WHATWG Fetch API 명세를 채택하여, 가로챈 각 요청이 실제 Request 인스턴스이고, 모킹된 각 응답이 실제 Response 인스턴스가 되도록 합니다. 또한 Service Worker API를 활용하여 브라우저의 네트워크 수준에서 요청을 가로채도록 합니다. 이렇게 하면 애플리케이션과 테스트가 모킹이 진행 중인지 전혀 알지 못하게 됩니다. 특정 사용 사례를 충족시키기 위해 커스텀 API를 고안하는 대신, 의미론과 표준에 의존합니다. 이것이 바로 많은 개발자들이 CI/CD 파이프라인을 우리에게 맡기는 이유 중 하나입니다.

예를 들어, MSW에서 모킹된 리다이렉트를 응답하는 방법은 다음과 같습니다:

http.get('/old', () => {
  return new Response(null, {
    status: 302,
    headers: {
      Location: '/new',
    },
  })
})

서버의 관점

MSW를 사용할 때 여러분은 요청 핸들러를 작성하여 요청을 가로채고 응답하게 됩니다. 특정 시나리오에서 서버가 어떻게 동작해야 하는지를 설명하는 것이기 때문에, 이러한 핸들러를 서버의 관점에서 접근하는 것이 중요합니다.