"TypeError: response.body.getReader is not a function" for HTTPResponse of JSON type

[schok-d]

Prerequisites

• I confirm my issue is not in the opened issues
• I confirm the Frequently Asked Questions didn't contain the answer to my issue

Environment check

• I'm using the latest msw version
• I'm using Node.js version 18 or higher

Node.js version

v20.11.0

Reproduction repository

NA

Reproduction steps

NA

Current behavior

I am trying to mock a simple JSON response for API for a React application that use Axios.
Seeing this error: TypeError: response.body.getReader is not a function.

  http.get(/\/carts/, async () => {
    await delay(150)
    return HttpResponse.json({ cart: 1 }, { status: 200 })    
  })
]

### Expected behavior

NA

[akmjenkins]

Smells a lot like the whatwg-fetch-esque style problem: using a non-spec compliant Response polyfill

more info about it here:

#2026

if you use the Response global from node >=18 in your test environment I think your issue will be resolved.

I’d be happy to verify if you could post your package.json dependencies and show your relevant test setup files/configuration

[schok-d]

Thanks for the response @akmjenkins. One important thing to note here, I generated this project using NX and its using @nx/jest plugin.

I fixed my test environment setup and added jest polyfills(mentioned below) which fixed above issue but now I am getting AxiosNetwork error.

      message: 'Network Error',
      name: 'AxiosError',
      code: 'ERR_NETWORK',
      config: {
        transitional: {
          silentJSONParsing: true,
          forcedJSONParsing: true,
          clarifyTimeoutError: false
        },...

Polyfills

Object.defineProperties(globalThis, {
  TextDecoder: { value: TextDecoder },
  TextEncoder: { value: TextEncoder },
  ReadableStream: { value: ReadableStream }
})

const { Blob, File } = require('node:buffer')
const { fetch, Headers, FormData, Request, Response } = require('undici')

Object.defineProperties(globalThis, {
  fetch: { value: fetch, writable: true },
  Blob: { value: Blob },
  File: { value: File },
  Headers: { value: Headers },
  FormData: { value: FormData },
  Request: { value: Request },
  Response: { value: Response }
})


Everything works perfectly fine if I switched to msw@1.3.3.

[kettanaito]

This is an issue with Jest. Most likely related to structuredClone() and Jest using core-js that doesn't implement structuredClone() correctly and refuses you to give the correctly working global function from Node.js.

Here are a few references that I hope will prove helpful to you:

• MSW + Jest: Transferring of ReadableStream cannot be properly polyfilled in this engine #1931 (comment)
• Axios call with data doesn't match predicate with same path in 2.x #1929 (comment)
• Undici 6.x - Request/Response/TextEncoder is not defined (Jest) no longer works #1916 (comment)

I'm closing this because I will not look into Jest/JSDOM-related issues (but anyone is welcome to dive into this, I don't mean to discourage you either!). No amount of time I invest into this will make those tools any less broken. If you can, migrate to Vitest. If you can't, raise this in the Jest repo. The more people raise these problems, the more likely Jest will fix them. Nothing we can or should do on MSW's side—it's using valid standard JavaScript.

[schok-d]

@kettanaito Thank you for your response, from one of the references you have provided in your response, I read that downgrading undici to v5 helped someone. I tried that and apparently I no longer see Axios network error and my test cases seem to be working.

[kettanaito]

@schok-d, that's great news! So, it was the structuredClone() issue. Downgrading Undici "helps" in this case because v5 doesn't rely on structuredClone().