Skip to main content

storybook + msw setup

add msw to storybook to simulate Online API

create genertic Service Worker in public folder

npm init-msw

update .storybook/preview.js to init Service Worker

import { initialize, mswDecorator } from 'msw-storybook-addon'

initialize();
export const decorators = [mswDecorator];

add Story Parameter to mock remote API call

import { rest } from "msw"
import { MockedState } from "./TaskList.stories"

export const Default = Template.bind({})
Default.parameters = {
  msw: {
    handlers: [
      rest.get(
        "https://jsonplaceholder.typicode.com/todos?userId=1',
        (req, res, ctx) => res(ctx.json(MockedState.tasks))
      )
    ]
  }
}

References​