feat: Use of function with parameter data to create msw handlers

.changeset/eleven-fireants-doubt.md

@@ -0,0 +1,5 @@
+---
+"@kubb/plugin-msw": major
+---
+
+Use of function with parameter data to create msw handlers

docs/changelog.md

@@ -4,6 +4,18 @@ title: Changelog
 
 # Changelog
 
+## 3.0.0-beta.9
+- [`plugin-msw`](/plugins/plugin-msw): `parser` option to disable faker generation
+  - `'faker'` will use `@kubb/plugin-faker` to generate the data for the response
+  - `'data'` will use your custom data to generate the data for the response
+- [`plugin-msw`](/plugins/plugin-msw): Siblings for better AST manipulation
+
+## 3.0.0-beta.8
+- [`plugin-zod`](/plugins/plugin-zod): Siblings for better AST manipulation
+
+## 3.0.0-beta.7
+- Upgrade external packages
+
 ## 3.0.0-beta.6
 - [`plugin-faker`](/plugins/plugin-faker): Min/Max for type array to generate better `faker.helpers.arrayElements` functionality
 

docs/migration-guide.md

@@ -364,3 +364,25 @@ See [Filter And Sort](/knowledge-base/filter-and-sort).
 - Support for `signal`, this makes it possible to cancel a request
 - Removal of `mutate.variablesType` and use `'mutate'` as default
 
+### @kubb/plugin-msw
+- `parser` to switch between using Faker(`'faker'`) for your data or define your own data with `'data'`.
+- By default, use of a function with `data` as parameter to override the response of MSW.
+```typescript
+export const addPetHandler = http.post('*/pet', function handler(info) { // [!code --]
+  return new Response(JSON.stringify(createAddPetMutationResponse()), { // [!code --]
+    headers: { // [!code --]
+      'Content-Type': 'application/json', // [!code --]
+    }, // [!code --]
+  }) // [!code --]
+}) // [!code --]
+
+export function addPetHandler(data?: AddPetMutationResponse) { // [!code ++]
+  return http.post('*/pet', function handler(info) { // [!code ++]
+    return new Response(JSON.stringify(createAddPetMutationResponse(data)), { // [!code ++]
+      headers: { // [!code ++]
+        'Content-Type': 'application/json', // [!code ++]
+      }, // [!code ++]
+    }) // [!code ++]
+  }) // [!code ++]
+} // [!code ++]
+```

docs/package.json

@@ -21,7 +21,7 @@
     "serve": "vitepress serve"
   },
   "dependencies": {
-    "@shikijs/vitepress-twoslash": "^1.22.0",
+    "@shikijs/vitepress-twoslash": "^1.22.1",
     "mermaid": "^11.3.0",
     "sitemap": "^8.0.0",
     "vitepress": "^1.4.1",
@@ -44,12 +44,12 @@
     "@kubb/plugin-zod": "workspace:*",
     "@kubb/react": "workspace:*",
     "@mermaid-js/mermaid-cli": "^11.2.1",
-    "@types/node": "^20.16.13",
-    "@types/react": "^18.3.11",
+    "@types/node": "^20.17.0",
+    "@types/react": "^18.3.12",
     "cross-env": "^7.0.3",
     "react": "^18.3.1",
     "unplugin-kubb": "workspace:^",
-    "vite": "^5.4.9"
+    "vite": "^5.4.10"
   },
   "packageManager": "[email protected]",
   "engines": {

e2e/package.json

@@ -32,24 +32,24 @@
     "@kubb/plugin-ts": "workspace:*",
     "@kubb/plugin-zod": "workspace:*",
     "@kubb/react": "workspace:*",
-    "@tanstack/react-query": "^5.59.15",
-    "@tanstack/solid-query": "^5.59.13",
-    "@tanstack/svelte-query": "^5.59.13",
-    "@tanstack/vue-query": "^5.59.13",
+    "@tanstack/react-query": "^5.59.16",
+    "@tanstack/solid-query": "^5.59.16",
+    "@tanstack/svelte-query": "^5.59.16",
+    "@tanstack/vue-query": "^5.59.16",
     "axios": "^1.7.7",
-    "msw": "^2.4.12",
+    "msw": "^2.5.1",
     "react": "^18.3.1",
-    "solid-js": "^1.9.2",
+    "solid-js": "^1.9.3",
     "svelte": "^3.59.2",
     "swr": "^2.2.5",
-    "tsup": "^8.3.0",
+    "tsup": "^8.3.4",
     "vue": "^3.5.12",
     "zod": "^3.23.8"
   },
   "devDependencies": {
     "@kubb/config-ts": "workspace:*",
     "@kubb/config-tsup": "workspace:*",
-    "tsup": "^8.3.0",
+    "tsup": "^8.3.4",
     "typescript": "^5.6.3"
   },
   "packageManager": "[email protected]",

examples/advanced/package.json

@@ -38,23 +38,23 @@
     "@kubb/plugin-ts": "workspace:*",
     "@kubb/plugin-zod": "workspace:*",
     "@kubb/react": "workspace:*",
-    "@tanstack/query-core": "^5.59.13",
-    "@tanstack/react-query": "^5.59.15",
-    "@tanstack/solid-query": "^5.59.13",
-    "@tanstack/svelte-query": "^5.59.13",
-    "@tanstack/vue-query": "^5.59.13",
+    "@tanstack/query-core": "^5.59.16",
+    "@tanstack/react-query": "^5.59.16",
+    "@tanstack/solid-query": "^5.59.16",
+    "@tanstack/svelte-query": "^5.59.16",
+    "@tanstack/vue-query": "^5.59.16",
     "axios": "^1.7.7",
-    "msw": "^2.4.12",
+    "msw": "^2.5.1",
     "react": "^18.3.1",
-    "solid-js": "^1.9.2",
+    "solid-js": "^1.9.3",
     "svelte": "^3.59.2",
     "swr": "^2.2.5",
     "vue": "^3.5.12",
     "zod": "^3.23.8"
   },
   "devDependencies": {
     "@kubb/config-ts": "workspace:*",
-    "tsup": "^8.3.0",
+    "tsup": "^8.3.4",
     "typescript": "^5.6.3"
   },
   "packageManager": "[email protected]",

examples/advanced/src/gen/msw/handlers.ts

@@ -16,20 +16,20 @@ import { logoutUserHandler } from './userController/logoutUserHandler.ts'
 import { updateUserHandler } from './userController/updateUserHandler.ts'
 
 export const handlers = [
-  createPetsHandler,
-  updatePetHandler,
-  addPetHandler,
-  findPetsByStatusHandler,
-  findPetsByTagsHandler,
-  getPetByIdHandler,
-  updatePetWithFormHandler,
-  deletePetHandler,
-  uploadFileHandler,
-  createUserHandler,
-  createUsersWithListInputHandler,
-  loginUserHandler,
-  logoutUserHandler,
-  getUserByNameHandler,
-  updateUserHandler,
-  deleteUserHandler,
+  createPetsHandler(),
+  updatePetHandler(),
+  addPetHandler(),
+  findPetsByStatusHandler(),
+  findPetsByTagsHandler(),
+  getPetByIdHandler(),
+  updatePetWithFormHandler(),
+  deletePetHandler(),
+  uploadFileHandler(),
+  createUserHandler(),
+  createUsersWithListInputHandler(),
+  loginUserHandler(),
+  logoutUserHandler(),
+  getUserByNameHandler(),
+  updateUserHandler(),
+  deleteUserHandler(),
 ] as const

examples/advanced/src/gen/msw/petController/addPetHandler.ts

@@ -1,10 +1,12 @@
-import { createAddPetMutationResponseFaker } from '../../mocks/petController/createAddPetFaker.ts'
+import type { AddPetMutationResponse } from '../../models/ts/petController/AddPet.ts'
 import { http } from 'msw'
 
-export const addPetHandler = http.post('*/pet', function handler(info) {
-  return new Response(JSON.stringify(createAddPetMutationResponseFaker()), {
-    headers: {
-      'Content-Type': 'application/json',
-    },
+export function addPetHandler(data?: AddPetMutationResponse) {
+  return http.post('*/pet', function handler(info) {
+    return new Response(JSON.stringify(data), {
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    })
   })
-})
+}

examples/advanced/src/gen/msw/petController/deletePetHandler.ts

@@ -1,10 +1,12 @@
-import { createDeletePetMutationResponseFaker } from '../../mocks/petController/createDeletePetFaker.ts'
+import type { DeletePetMutationResponse } from '../../models/ts/petController/DeletePet.ts'
 import { http } from 'msw'
 
-export const deletePetHandler = http.delete('*/pet/:petId', function handler(info) {
-  return new Response(JSON.stringify(createDeletePetMutationResponseFaker()), {
-    headers: {
-      'Content-Type': 'application/json',
-    },
+export function deletePetHandler(data?: DeletePetMutationResponse) {
+  return http.delete('*/pet/:petId', function handler(info) {
+    return new Response(JSON.stringify(data), {
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    })
   })
-})
+}

examples/advanced/src/gen/msw/petController/findPetsByStatusHandler.ts

@@ -1,10 +1,12 @@
-import { createFindPetsByStatusQueryResponseFaker } from '../../mocks/petController/createFindPetsByStatusFaker.ts'
+import type { FindPetsByStatusQueryResponse } from '../../models/ts/petController/FindPetsByStatus.ts'
 import { http } from 'msw'
 
-export const findPetsByStatusHandler = http.get('*/pet/findByStatus', function handler(info) {
-  return new Response(JSON.stringify(createFindPetsByStatusQueryResponseFaker()), {
-    headers: {
-      'Content-Type': 'application/json',
-    },
+export function findPetsByStatusHandler(data?: FindPetsByStatusQueryResponse) {
+  return http.get('*/pet/findByStatus', function handler(info) {
+    return new Response(JSON.stringify(data), {
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    })
   })
-})
+}

examples/advanced/src/gen/msw/petController/findPetsByTagsHandler.ts

@@ -1,10 +1,12 @@
-import { createFindPetsByTagsQueryResponseFaker } from '../../mocks/petController/createFindPetsByTagsFaker.ts'
+import type { FindPetsByTagsQueryResponse } from '../../models/ts/petController/FindPetsByTags.ts'
 import { http } from 'msw'
 
-export const findPetsByTagsHandler = http.get('*/pet/findByTags', function handler(info) {
-  return new Response(JSON.stringify(createFindPetsByTagsQueryResponseFaker()), {
-    headers: {
-      'Content-Type': 'application/json',
-    },
+export function findPetsByTagsHandler(data?: FindPetsByTagsQueryResponse) {
+  return http.get('*/pet/findByTags', function handler(info) {
+    return new Response(JSON.stringify(data), {
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    })
   })
-})
+}

examples/advanced/src/gen/msw/petController/getPetByIdHandler.ts

@@ -1,10 +1,12 @@
-import { createGetPetByIdQueryResponseFaker } from '../../mocks/petController/createGetPetByIdFaker.ts'
+import type { GetPetByIdQueryResponse } from '../../models/ts/petController/GetPetById.ts'
 import { http } from 'msw'
 
-export const getPetByIdHandler = http.get('*/pet/:petId', function handler(info) {
-  return new Response(JSON.stringify(createGetPetByIdQueryResponseFaker()), {
-    headers: {
-      'Content-Type': 'application/json',
-    },
+export function getPetByIdHandler(data?: GetPetByIdQueryResponse) {
+  return http.get('*/pet/:petId', function handler(info) {
+    return new Response(JSON.stringify(data), {
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    })
   })
-})
+}

examples/advanced/src/gen/msw/petController/updatePetHandler.ts

@@ -1,10 +1,12 @@
-import { createUpdatePetMutationResponseFaker } from '../../mocks/petController/createUpdatePetFaker.ts'
+import type { UpdatePetMutationResponse } from '../../models/ts/petController/UpdatePet.ts'
 import { http } from 'msw'
 
-export const updatePetHandler = http.put('*/pet', function handler(info) {
-  return new Response(JSON.stringify(createUpdatePetMutationResponseFaker()), {
-    headers: {
-      'Content-Type': 'application/json',
-    },
+export function updatePetHandler(data?: UpdatePetMutationResponse) {
+  return http.put('*/pet', function handler(info) {
+    return new Response(JSON.stringify(data), {
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    })
   })
-})
+}

examples/advanced/src/gen/msw/petController/updatePetWithFormHandler.ts

@@ -1,10 +1,12 @@
-import { createUpdatePetWithFormMutationResponseFaker } from '../../mocks/petController/createUpdatePetWithFormFaker.ts'
+import type { UpdatePetWithFormMutationResponse } from '../../models/ts/petController/UpdatePetWithForm.ts'
 import { http } from 'msw'
 
-export const updatePetWithFormHandler = http.post('*/pet/:petId', function handler(info) {
-  return new Response(JSON.stringify(createUpdatePetWithFormMutationResponseFaker()), {
-    headers: {
-      'Content-Type': 'application/json',
-    },
+export function updatePetWithFormHandler(data?: UpdatePetWithFormMutationResponse) {
+  return http.post('*/pet/:petId', function handler(info) {
+    return new Response(JSON.stringify(data), {
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    })
   })
-})
+}

examples/advanced/src/gen/msw/petController/uploadFileHandler.ts

@@ -1,10 +1,12 @@
-import { createUploadFileMutationResponseFaker } from '../../mocks/petController/createUploadFileFaker.ts'
+import type { UploadFileMutationResponse } from '../../models/ts/petController/UploadFile.ts'
 import { http } from 'msw'
 
-export const uploadFileHandler = http.post('*/pet/:petId/uploadImage', function handler(info) {
-  return new Response(JSON.stringify(createUploadFileMutationResponseFaker()), {
-    headers: {
-      'Content-Type': 'application/json',
-    },
+export function uploadFileHandler(data?: UploadFileMutationResponse) {
+  return http.post('*/pet/:petId/uploadImage', function handler(info) {
+    return new Response(JSON.stringify(data), {
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    })
   })
-})
+}

examples/advanced/src/gen/msw/petsController/createPetsHandler.ts

@@ -1,10 +1,12 @@
-import { createCreatePetsMutationResponseFaker } from '../../mocks/petsController/createCreatePetsFaker.ts'
+import type { CreatePetsMutationResponse } from '../../models/ts/petsController/CreatePets.ts'
 import { http } from 'msw'
 
-export const createPetsHandler = http.post('*/pets/:uuid', function handler(info) {
-  return new Response(JSON.stringify(createCreatePetsMutationResponseFaker()), {
-    headers: {
-      'Content-Type': 'application/json',
-    },
+export function createPetsHandler(data?: CreatePetsMutationResponse) {
+  return http.post('*/pets/:uuid', function handler(info) {
+    return new Response(JSON.stringify(data), {
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    })
   })
-})
+}

examples/advanced/src/gen/msw/userController/createUserHandler.ts

@@ -1,10 +1,12 @@
-import { createCreateUserMutationResponseFaker } from '../../mocks/userController/createCreateUserFaker.ts'
+import type { CreateUserMutationResponse } from '../../models/ts/userController/CreateUser.ts'
 import { http } from 'msw'
 
-export const createUserHandler = http.post('*/user', function handler(info) {
-  return new Response(JSON.stringify(createCreateUserMutationResponseFaker()), {
-    headers: {
-      'Content-Type': 'application/json',
-    },
+export function createUserHandler(data?: CreateUserMutationResponse) {
+  return http.post('*/user', function handler(info) {
+    return new Response(JSON.stringify(data), {
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    })
   })
-})
+}

examples/advanced/src/gen/msw/userController/createUsersWithListInputHandler.ts

@@ -1,10 +1,12 @@
-import { createCreateUsersWithListInputMutationResponseFaker } from '../../mocks/userController/createCreateUsersWithListInputFaker.ts'
+import type { CreateUsersWithListInputMutationResponse } from '../../models/ts/userController/CreateUsersWithListInput.ts'
 import { http } from 'msw'
 
-export const createUsersWithListInputHandler = http.post('*/user/createWithList', function handler(info) {
-  return new Response(JSON.stringify(createCreateUsersWithListInputMutationResponseFaker()), {
-    headers: {
-      'Content-Type': 'application/json',
-    },
+export function createUsersWithListInputHandler(data?: CreateUsersWithListInputMutationResponse) {
+  return http.post('*/user/createWithList', function handler(info) {
+    return new Response(JSON.stringify(data), {
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    })
   })
-})
+}