Getting started

Install

npm pnpm yarn bun

npm install -D msw-panel

pnpm add -D msw-panel

yarn add -D msw-panel

bun add -d msw-panel

Add to your app

import { createMswPanelController } from "msw-panel";
import { MswPanel } from "msw-panel/react";
import { worker } from "./mocks/browser";

const controller = createMswPanelController({ runtime: worker });

export function App() {
  return (
    <>
      <Routes />
      <MswPanel controller={controller} />
    </>
  );
}

That’s it. A floating button appears in the corner — click it to open the panel and toggle handlers on or off.

See the React reference for all props and defaults.