Will histoire support mocking requests natively or via a msw plugin ?

[olemarius]

I'm using msw both in storybook and cypress, so migrating from sb to histoire will be more straight forward if msw were supported.

Alternatively, if we can just use msw like explained in this article, example docs would suffice.

[jagoncalves14]

Yeah, this would be awesome to have.
Storybook has this cool plugin for mocking request within the story files.

https://storybook.js.org/addons/msw-storybook-addon

[awacode21]

You can use MSW in histoire.
Histoire provides the possibility for a histoire.setup.js or histoire.setup.ts
here you can initialise you Mock Service Worker as you do for your app.

An example how i did

const setupMockServer = () => {
    const serverConfigurationObject = {
        onUnhandledRequest(request: { url: { href: string } }) {
            // avoid assets, fonts, images, or vite internal to be processed by mock server
            if (
                /(\/assets+)|(\/fonts+)|(\/images)|(\/__vite_ping)/.test(
                    request.url.href
                )
            ) {
                return;
            }
        },
    };
    const { worker } = setupWorker(/** your handlers go here */);
    worker.start(serverConfigurationObject);
}

export const setupVue3 = defineSetupVue3({ app, story, variant }) => {
   setupMockServer();

    const pinia = createPinia();
    const head = createHead();
    app.use(pinia);
    app.use(head);
});