Introduce msw to demonstrate bug

msw/browser.ts

@@ -0,0 +1,4 @@
+import { setupWorker } from "msw"
+import { handlers } from "./handlers"
+
+export const worker = setupWorker(...handlers)

msw/handlers.ts

@@ -0,0 +1,7 @@
+import { rest } from "msw"
+
+export const handlers = [
+  rest.get("/sandbox", (req, res, ctx) => {
+    return res(ctx.status(200), ctx.json({ ok: true }))
+  }),
+]

msw/index.ts

@@ -0,0 +1,9 @@
+export default function setupMsw() {
+  if (typeof window === "undefined") {
+    const { server } = require("./server")
+    server.listen()
+  } else {
+    const { worker } = require("./browser")
+    worker.start()
+  }
+}

msw/server.ts

@@ -0,0 +1,6 @@
+// src/mocks/server.js
+import { setupServer } from "msw/node"
+import { handlers } from "./handlers"
+
+// This configures a request mocking server with the given request handlers.
+export const server = setupServer(...handlers)

package.json

@@ -36,6 +36,7 @@
     "@types/node": "^15.12.4",
     "@types/react": "^17.0.11",
     "@types/react-dom": "^17.0.8",
+    "msw": "^0.36.7",
     "typescript": "^4.3.4"
   }
 }

pages/_app.tsx

@@ -1,7 +1,10 @@
 import { SessionProvider } from "next-auth/react"
 import type { AppProps } from "next/app"
+import setupMsw from "./../msw"
 import "./styles.css"
 
+setupMsw()
+
 // Use the <SessionProvider> to improve performance and allow components that call
 // `useSession()` anywhere in your application to access the `session` object.
 export default function App({ Component, pageProps }: AppProps) {