TypeError: unusable

[jmsims2]

I'm upgrading MSW in a large project at work. We use it in our jest tests. I have followed the guidance and have my jest polyfills, utilizing undici. I have everything upgraded but several tests are failing with the following stacktrace below. I'm logging out several events from msw and it looks like all my requests are getting matched and mocked just fine, but still hitting this stack trace. Our UI uses axios as an API client and we are on latest msw and node 20.17.

Does anyone have any potential ideas for me to look into? Trying to get a minimal repro together but figured I'd ask anyways

 TypeError: unusable

      at Request.clone (node_modules/undici/lib/fetch/request.js:717:13)
      at XMLHttpRequestController.respondWith (node_modules/@mswjs/interceptors/src/interceptors/XMLHttpRequest/XMLHttpRequestController.ts:299:29)
      at Object.onResponse (node_modules/@mswjs/interceptors/src/interceptors/XMLHttpRequest/XMLHttpRequestProxy.ts:70:24)
      at handleResponse (node_modules/@mswjs/interceptors/src/utils/handleRequest.ts:55:21)
      at handleRequest (node_modules/@mswjs/interceptors/src/utils/handleRequest.ts:207:12)
      at async XMLHttpRequestController.xhrRequestController.onRequest (node_modules/@mswjs/interceptors/src/interceptors/XMLHttpRequest/XMLHttpRequestProxy.ts:64:34)

[lukehillonline]

I too am getting the same error

[steliyan]

If you are using await request.json(), you can try using await request.clone().json().

[jmsims2]

That ended up being my problem, had that in 2 places and updated and tests passed. Thanks for the help!!

[kettanaito]

@jmsims2, can you please share where you've implemented this fix? Was it in a request handler? In a life-cycle event? Would love to learn more.

[jmsims2]

Yeah for sure. I was reading the request in a handler, something like the below. I was doing that in a couple handlers and as soon as I started doing request.clone().json() my unusable error went away.

http.post<never, SearchRequest>(
    searchEventsUrl,
    async ({ params, request }) => {
      const body = await request.json();
//...rest of code...

[kettanaito]

This is a bug, you shouldn't be cloning a request body to read it by default.

The fix is here #2282. Once it's merged, you can remove the .clone() call in your handler. Thanks.

[jmsims2]

Nice, thanks for the fix!