I have an nextjs 15 project (v15.1.7 to be specific) with MSW 2 (2.3.1). There isn't too much info online on setting up nextjs with msw, and the official msw examples repo is missing nextjs. However based on what there is, I have configured it as so:

// app/mocks/browser.ts
import { setupWorker } from 'msw/browser';

import handlers from './handlers';

export const worker = setupWorker(...handlers);

// app/mocks/server.ts
import { setupServer } from 'msw/node';

import handlers from './handlers';

// this configures a Service Worker with the given request handlers.
export const server = setupServer(...handlers);
export * from 'msw';

// app/mocks/index.ts
export const setupMsw = async () => {
  if (typeof window === 'undefined') {
    const { server } = await import('./server');
    server.listen();
  } else {
    const { worker } = await import('./browser');
    void worker.start({
      serviceWorker: {
        url: `${process.env.NEXT_PUBLIC_BASE_PATH ?? ''}/mockServiceWorker.js`,
      },
    });
  }
};

setupMsw is called inside of a client component which is inserted into root layout of the app.

The mocking is used to mock API endpoints of an api which is fetched by a number of different server actions. This mocking behaves well, and it works, most of the time. However, there are certain things that I do (such as making a new file, modifying the middleware, and some other things I'm not sure of) that cause something related to the mocking to fail. It throws an error like this:

 ⨯ TypeError: fetch failed
    at async getRevisionHistory (src\lib\getRevisionHistory.ts:9:21)
    at async RevisionsLayout (src\app\revision\[revision]\layout.tsx:17:23)
   7 |     //....
   8 |     //....
>  9 |     const response = await fetch(url);
     |                     ^
  10 |
  11 |     if (!response.ok) {
  12 |       throw new Error('Failed to fetch data'); {
  digest: '1562509719',
  [cause]: [Error: unknown scheme]
}

.........