How-to guides
Mock API responses
Configure generated MSW handlers and register them in tests or a browser worker.
Generate typed handlers
Add pluginTs and pluginMsw to your configuration. The default parser: 'data' creates handlers whose response data you supply.
kubb.config.ts
import { defineConfig } from 'kubb'
import { pluginTs } from '@kubb/plugin-ts'
import { pluginMsw } from '@kubb/plugin-msw'
export default defineConfig({
input: './petStore.yaml',
output: { path: './src/gen' },
plugins: [
pluginTs(),
pluginMsw({ output: { path: 'handlers', mode: 'directory' }, baseURL: 'http://localhost:3000', handlers: true }),
],
})
For Node tests, set baseURL to the URL your client calls so MSW can match absolute requests. Browser handlers can use relative paths for the current origin.
Supply test data
Call a generated handler with a response body or a callback that returns a Response.
test-server.ts
import { setupServer } from 'msw/node'
import { getPetByIdHandler } from './src/gen/handlers/getPetByIdHandler'
export const server = setupServer(
getPetByIdHandler({ name: 'Rex', photoUrls: [] }),
)
Generate mock data
Add pluginFaker and change the MSW parser to 'faker'.
kubb.config.ts
import { pluginTs } from '@kubb/plugin-ts'
import { pluginFaker } from '@kubb/plugin-faker'
import { pluginMsw } from '@kubb/plugin-msw'
const plugins = [
pluginTs(),
pluginFaker(),
pluginMsw({
output: { path: 'handlers', mode: 'directory' },
baseURL: 'http://localhost:3000',
parser: 'faker',
handlers: true,
}),
]
Use this array as defineConfig.plugins. Calling getPetByIdHandler() without data now uses generated Faker values.
Register the handler collection
With handlers: true, Kubb exports an operation-ordered collection from handlers.ts. Register it in Node or a browser.
import { setupServer } from 'msw/node'
import { handlers } from './src/gen/handlers/handlers'
export const server = setupServer(...handlers)
import { setupWorker } from 'msw/browser'
import { handlers } from './src/gen/handlers/handlers'
export const worker = setupWorker(...handlers)
Start the server or worker through your test or application setup.