interceptors stuck while uploading a file.

[lcharlois-neotys]

Hello,

I'm facing an issue where the interceptor looks to be stuck when the request is a file upload request. We're using @mswjs/interceptors to record request and response from our tests. We're testing an API and the API client is generated and use axios.

Here are the details about the request intercepted by msw.

{
  request: Request {
    method: 'POST',
    url: 'https://v4/tests/2def6de8-45a0-45eb-bf97-0346b324914a/project',
    headers: Headers {
      Accept: 'application/json, text/plain, */*',
      'Content-Type': 'multipart/form-data; boundary=axios-1.7.7-boundary-0Frzr8xTBUgB5zuG06g-dfR9w',
      'User-Agent': 'axios/1.7.7',
      'Content-Length': '2166',
      'Accept-Encoding': 'gzip, compress, deflate, br',
      Host: '------',
      Connection: 'close'
    },
    destination: '',
    referrer: 'about:client',
    referrerPolicy: '',
    mode: 'cors',
    credentials: 'same-origin',
    cache: 'default',
    redirect: 'follow',
    integrity: '',
    keepalive: false,
    isReloadNavigation: false,
    isHistoryNavigation: false,
    signal: AbortSignal { aborted: false }
  }
}

Here is how the interceptor is configured.

const interceptor = new ClientRequestInterceptor();

beforeAll(async () => {
    interceptor.apply();

    interceptor.on('response', async ({ response, request }) => {
        try {
            //doSomething
        } catch (error) {
            console.error('An error occured while parsing request', error.message);
        }
    });
});

Without the interceptor everything works well. With interceptor, the request can be intercepted but the response is never intercepted.

Maybe an important detail, the generated axios API client accepts a node File as parameter.

I also tried to setup an unhandledException listener, but I've got nothing.

[kettanaito]

Hi, @lcharlois-neotys. Thanks for reporting this.

I believe this is related to https://github.com/nodejs/undici/issues/3676. Undici had trouble parsing FormData from Axios due to newlines present in the body. They've merged the fix but it has to be released and, perhaps, even backported to support Node.js v18.

That shouldn't prevent the request from pending though. Perhaps this is a different issue. Can you please submit a reproduction repo? I cannot help you with this otherwise.

Maybe an important detail, the generated axios API client accepts a node File as parameter.

No, that shouldn't matter. But thanks for mentioning.

[lcharlois-neotys]

I will try to provide a reproduction repo, but that's not easy to extract that. I'm not sure to be able to provide an simple one.

[lcharlois-neotys]

@kettanaito Here is a small repo reproducing the issue. https://github.com/lcharlois-neotys/msw-interceptors-repro The repo contains a README file describing the steps to reproduce.

Here are the npm version output on my test environment.

$ npm version
{
  npm: '10.8.2',
  node: '20.17.0',
  acorn: '8.11.3',
  ada: '2.9.0',
  ares: '1.32.3',
  base64: '0.5.2',
  brotli: '1.1.0',
  cjs_module_lexer: '1.2.2',
  cldr: '45.0',
  icu: '75.1',
  llhttp: '8.1.2',
  modules: '115',
  napi: '9',
  nghttp2: '1.61.0',
  nghttp3: '0.7.0',
  ngtcp2: '1.1.0',
  openssl: '3.0.13+quic',
  simdutf: '5.3.0',
  tz: '2024a',
  undici: '6.19.2',
  unicode: '15.1',
  uv: '1.46.0',
  uvwasi: '0.0.21',
  v8: '11.3.244.8-node.23',
  zlib: '1.3.0.1-motley-209717d'
}

Let me know if you need more details about this issue.