msw: TypeError: Failed to fetch in a `miniflare-like` environment

I’ve opened PRs in both

• https://github.com/mswjs/interceptors/pull/479
• https://github.com/mswjs/cookies/pull/27

These 2 prs update the code which seems to cause issues in your tests, and should guard against future regressions in those dependencies, since I’ve added a miniflare environment test to each.

I also opened a failing test using the miniflare environment on this repo

• https://github.com/mswjs/msw/pull/1840

Once we land the 2 linked prs from dependencies, and bump their versions, I expect the regression test that’s failing in #1840 will pass

Released: v2.0.4 🎉

This has been released in v2.0.4!

• 📄 Release notes
• 📦 npm package

Make sure to always update to the latest version (npm i msw@latest) to get the newest features and bug fixes.

Predictable release automation by @ossjs/release.

It looks like there are a few places we read properties unavailable in cloudflares Request/Response objects.

here are the lines I modified (in node_modules directly to get things cleared up)

first, the log lines: (this, being non-synchronous) will likely end after your test does and cause some warnings.

- server.events.on("request:start", ({ request }) => {
+ server.events.on("request:start", async ({ request }) => {
  console.log(
    "MSW intercepted:",
    request.method,
    request.url,
-     request.json()
+    await request.clone().json()
  );
});

request.credentials:

• https://github.com/mswjs/msw/blob/461a1885280451ec0837fdce897f49521b8ff260/src/core/utils/request/getRequestCookies.ts#L20-L37
• https://github.com/mswjs/cookies/blob/94198194fc70bb01071c66702c4b167330475de5/src/store.ts#L52
• https://github.com/mswjs/cookies/blob/94198194fc70bb01071c66702c4b167330475de5/src/store.ts#L92

response.type - https://github.com/mswjs/interceptors/blob/3258f5cc62c472ba63f5c70e455d5b245c74a216/src/interceptors/fetch/index.ts#L106

Once I wrap those (in msw and msw/cookies) in some try/catch logic, it seems like you’re missing a scope response from

  return HttpResponse.json({
      id: "15d42a4d-1948-4de4-ba78-b8a893feaf45",
      firstName: "John",
+     scope: "",
    });

I’m not familiar about whether we should wrap these, or test for them somehow, and that might need a bit of prodding,

@monoald I’ll keep this open until we fix the underlying msw code to work by default if that’s ok with you

@mattcosta7 Thank you so much for the help! I’m about to make the changes. If the pr is accepted, for other users there is no need for them to use patch-package right?

yep - we should be able to avoid patch-package once some changes to msw are made to avoid accessing properties that throw in those environments. but may take a little bit to get those into a stable place and landed, so patching should at least unblock your progress

• https://github.com/mswjs/cookies/pull/27

once that lands we should be able to update msw and add a test in the miniflare environment to help catch regressions, while similarly checking for access in this library before before using unimplemented prototype properties in miniflare/cloudflare

It is strange to me that miniflare/cloudflare error instead of ignoring these

In the short term, I think you can use something like patch-package to make similar changes to wrap a try {} catch {} around the areas I linked above, and make the diff changes to the test - and get things looking pretty green

@monoald I think there’s something here:

1 - the error you’re seeing is from your attempt to log request.json, I think you want to await request.clone().json() to copy that rquest properly before reading it, since a body can only be read once

Once doing that, we do get a different error

Trace: TypeError: Failed to fetch
        at createNetworkError (/workspaces/auth-hono/node_modules/@mswjs/interceptors/lib/node/interceptors/fetch/index.js:140:24)
        at globalThis.fetch (/workspaces/auth-hono/node_modules/@mswjs/interceptors/lib/node/interceptors/fetch/index.js:80:31)
        at AuthFlow.getTokenFromCode (/workspaces/auth-hono/src/service/google/authFlow.ts:102:22)
        at AuthFlow.getUserData (/workspaces/auth-hono/src/service/google/authFlow.ts:136:40)
        at /workspaces/auth-hono/src/service/google/googleAuth.ts:48:5
        at /workspaces/auth-hono/node_modules/hono/dist/cjs/hono-base.js:259:62 {
      cause: Error: Failed to get the 'credentials' property on 'Request': the property is not implemented.
          at unimplemented (/workspaces/auth-hono/node_modules/@miniflare/core/src/standards/http.ts:96:9)
          at Request.get credentials [as credentials] (/workspaces/auth-hono/node_modules/@miniflare/core/src/standards/http.ts:520:12)
          at CookieStore.get (/workspaces/auth-hono/node_modules/@mswjs/cookies/src/store.ts:92:21)
          at getAllRequestCookies (/workspaces/auth-hono/node_modules/msw/lib/core/utils/request/getRequestCookies.js:76:66)
          at HttpHandler.<anonymous> (/workspaces/auth-hono/node_modules/msw/lib/core/handlers/HttpHandler.js:106:73)

Which looks like an issue with the way Request is implemented in miniflare/cloudflare workers?

We may need to wrap reads of credentials to help support that environment