Skip to content

Auto-generated mock data

Fill each handler with generated data by setting parser to 'faker'. This value comes from @kubb/plugin-faker, so add pluginFaker() to the plugins array alongside pluginTs().

kubb.config.ts
typescript
import { defineConfig } from 'kubb/config'
import { pluginTs } from '@kubb/plugin-ts'
import { pluginFaker } from '@kubb/plugin-faker'
import { pluginMsw } from '@kubb/plugin-msw'

export default defineConfig({
  input: './petStore.yaml',
  output: { path: './src/gen', clean: true },
  plugins: [
    pluginTs(),
    pluginFaker(),
    pluginMsw({
      output: { path: 'handlers', mode: 'directory' },
      parser: 'faker',
    }),
  ],
})

Output example

src/gen/handlers/getPetByIdHandler.ts
typescript
import type { GetPetByIdResponse } from '../types/GetPetById'
import { createGetPetByIdResponse } from '../mocks/createGetPetById'
import { http } from 'msw'

export function getPetByIdHandler(data?: GetPetByIdResponse | ((info: Parameters<Parameters<typeof http.get>[1]>[0]) => Response | Promise<Response>)) {
  return http.get('/pet/:petId\\:search', function handler(info) {
    if (typeof data === 'function') return data(info)

    return new Response(JSON.stringify(data || createGetPetByIdResponse(data)), {
      status: 200,
      headers: { 'Content-Type': 'application/json' },
    })
  })
}
usage.ts
typescript
import { setupServer } from 'msw/node'
import { getPetByIdHandler } from './src/gen/handlers/getPetByIdHandler'

// No `data` passed in, so the handler falls back to Faker-generated pet data.
const server = setupServer(getPetByIdHandler())