Following React Native docs does not work and Property 'TransformStream' doesn't exist on React Native (runtime)

[lgibso34]

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

v18.15.0

Reproduction repository

https://github.com/lgibso34/react-native-msw

Reproduction steps

Similar to #2344 but not Jest related.

1. checkout main branch
2. npm start
3. launch on device

TransformStream error

1. git checkout bug/sync
2. npm start
3. launch on device

Current behavior

Bug 1: Seems that React Native does not support the dynamic import syntax and fails to register the component in time.

Bug 2: Property 'TransformStream' doesn't exist on React Native at runtime running the synchronous code. This would also occur if the async version (bug 1) worked

Expected behavior

Bug 1: I expect the docs to explain how to get this working with additional metro config or a complete example with Metro and RN CLI. I expect the docs to accurately describe how to get msw to work in React Native.

Bug 2: I expect this to work on React Native like the docs suggest.

Async error (main)

Sync error (bug/sync)

[kettanaito]

Hi, @lgibso34. Thanks for reporting this!

We should introduce a separate export condition for react-native to exclude the Brotli decompressor from that environment. The decompression relies on the standard TransformStream web API that doesn't exist in React Native, sadly.

This is a pull request for https://github.com/mswjs/interceptors.

[kettanaito]

Do you know if there's a list of all global APIs in React Native? I doubt there's DecompressionStream there either.

[lgibso34]

exclude the Brotli deco

I do not, sorry. Thanks for responding though and taking a look.

[lgibso34]

@kettanaito I'm sure I'm doing something wrong but I tried to comment out this line or well changed it do const decompressedStream = null and comment any other decompression imports in my node_modules and some how I still see ReferenceError: Property 'TransformStream' doesn't exist when I start my server

[freitagdavid]

Found a workaround it looks like this polyfill can get things working for the time being if you add it to your msw.polyfill.js file.

https://github.com/MattiasBuelens/web-streams-polyfill

Edit: Spoke too soon it did get me past the TransformStream issue but now I'm seeing something about MessageEvent.