feat: upgraded msw to 2.0 (#1007)

* feat: upgraded msw to 2.0 * chore: upgraded to node 18 on pipeline * fix: remove cuid and deprecated version warning
orval-labs · Nov 2, 2023 · cc3e72a · cc3e72a
1 parent e58d906
commit cc3e72a
Show file tree

Hide file tree

Showing 37 changed files with 9,989 additions and 13,220 deletions.
diff --git a/.github/workflows/tests.yaml b/.github/workflows/tests.yaml
@@ -14,7 +14,7 @@ jobs:
     strategy:
       matrix:
         os: [ubuntu-latest, windows-latest]
-        node-version: [16.x]
+        node-version: [18.x]
     steps:
       - uses: actions/checkout@v4
       - name: Use Node.js ${{ matrix.node-version }}

diff --git a/packages/msw/package.json b/packages/msw/package.json
@@ -14,7 +14,6 @@
   },
   "dependencies": {
     "@orval/core": "6.19.1",
-    "cuid": "^2.1.8",
     "lodash.get": "^4.4.2",
     "lodash.omit": "^4.5.0",
     "openapi3-ts": "^3.0.0"

diff --git a/packages/msw/src/index.ts b/packages/msw/src/index.ts
@@ -12,7 +12,11 @@ import { getMockDefinition, getMockOptionsDataOverride } from './mocks';
 
 const MSW_DEPENDENCIES: GeneratorDependency[] = [
   {
-    exports: [{ name: 'rest', values: true }],
+    exports: [
+      { name: 'http', values: true },
+      { name: 'HttpResponse', values: true },
+      { name: 'delay', values: true },
+    ],
     dependency: 'msw',
   },
   {
@@ -74,23 +78,32 @@ export const generateMSW = (
     value = definitions[0];
   }
 
-  const responseType = response.contentTypes.includes('text/plain')
-    ? 'text'
-    : 'json';
+  const isTextPlain = response.contentTypes.includes('text/plain');
+
+  const functionName = `get${pascal(operationId)}Mock`;
 
   return {
     implementation: {
       function:
         value && value !== 'undefined'
-          ? `export const get${pascal(operationId)}Mock = () => (${value})\n\n`
+          ? `export const ${functionName} = () => (${value})\n\n`
           : '',
-      handler: `rest.${verb}('${route}', (_req, res, ctx) => {
-        return res(
-          ctx.delay(${getDelay(override)}),
-          ctx.status(200, 'Mocked status'),${
-            value && value !== 'undefined'
-              ? `\nctx.${responseType}(get${pascal(operationId)}Mock()),`
-              : ''
+      handler: `http.${verb}('${route}', async () => {
+        await delay(${getDelay(override)});
+        return new HttpResponse(${
+          value && value !== 'undefined'
+            ? isTextPlain
+              ? `${functionName}()`
+              : `JSON.stringify(${functionName}())`
+            : null
+        },
+          { 
+            status: 200,
+            headers: {
+              'Content-Type': '${
+                isTextPlain ? 'text/plain' : 'application/json'
+              }',
+            }
           }
         )
       }),`,

diff --git a/samples/angular-app/package.json b/samples/angular-app/package.json
@@ -29,7 +29,7 @@
     "@faker-js/faker": "^8.0.2",
     "@types/node": "^12.11.1",
     "codelyzer": "^6.0.0",
-    "msw": "^0.21.2",
+    "msw": "^2.0.2",
     "orval": "link:../../packages/orval/dist",
     "ts-node": "~8.3.0",
     "tslint": "~6.1.0",

diff --git a/samples/angular-app/src/api/endpoints/pets/pets.msw.ts b/samples/angular-app/src/api/endpoints/pets/pets.msw.ts
@@ -5,7 +5,7 @@
  * OpenAPI spec version: 1.0.0
  */
 import { faker } from '@faker-js/faker';
-import { rest } from 'msw';
+import { HttpResponse, delay, http } from 'msw';
 
 export const getListPetsMock = () =>
   Array.from(
@@ -25,21 +25,31 @@ export const getShowPetByIdMock = () =>
   }))();
 
 export const getPetsMSW = () => [
-  rest.get('*/v:version/pets', (_req, res, ctx) => {
-    return res(
-      ctx.delay(1000),
-      ctx.status(200, 'Mocked status'),
-      ctx.json(getListPetsMock()),
-    );
+  http.get('*/v:version/pets', async () => {
+    await delay(1000);
+    return new HttpResponse(JSON.stringify(getListPetsMock()), {
+      status: 200,
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    });
   }),
-  rest.post('*/v:version/pets', (_req, res, ctx) => {
-    return res(ctx.delay(1000), ctx.status(200, 'Mocked status'));
+  http.post('*/v:version/pets', async () => {
+    await delay(1000);
+    return new HttpResponse(null, {
+      status: 200,
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    });
   }),
-  rest.get('*/v:version/pets/:petId', (_req, res, ctx) => {
-    return res(
-      ctx.delay(1000),
-      ctx.status(200, 'Mocked status'),
-      ctx.json(getShowPetByIdMock()),
-    );
+  http.get('*/v:version/pets/:petId', async () => {
+    await delay(1000);
+    return new HttpResponse(JSON.stringify(getShowPetByIdMock()), {
+      status: 200,
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    });
   }),
 ];
diff --git a/samples/angular-app/src/api/mocks/mock.service.ts b/samples/angular-app/src/api/mocks/mock.service.ts
@@ -1,5 +1,5 @@
 import { Inject, Injectable } from '@angular/core';
-import { setupWorker } from 'msw';
+import { setupWorker } from 'msw/browser';
 import { getPetsMSW } from '../endpoints/pets/pets.msw';
 import { MOCKED_API } from './mock.token';
 import { MockedApi } from './mock.type';