An example of using `msw` with ladle

MSWExample.stories.tsx

import { setupWorker, rest } from "msw";

export const ExampleStory = () => {
  ...
};

ExampleStory.decorators = [
  (Story) => {
    const [ready, setReady] = React.useState(false);

    React.useEffect(() => {
      const worker = setupWorker(
        rest.get("/fake", (req, res, ctx) => {
          // define your handler
        })
      );

      worker.start().then(() => {
        setReady(true);
      });
    }, []);

    if (!ready) {
      return <>Loading...</>;
    }

    return <Story />;
  },
];

Hi @twhitbeck, thanks, for the useful example!

I got it running using npx ladle build and npx ladle preview, but I have to add the mockServiceWorker.js after each build to the ./build directory, which can be automatized.

Did you got it working with npx ladle serve ? I tried to add the worker script to different locations like vite, public etc. but it was still not found. In case you have found a solution you could drop a note here, thanks in advance!