msw: ReferenceError: Property 'location' doesn't exist in React Native + Storybook

Prerequisites

Environment check

  • I’m using the latest msw version
  • I’m using Node.js version 14 or higher

Node.js version

v18.18.0

Reproduction repository

Reproduction

Reproduction steps

Run the app in development. Notice that requests aren’t being returned by msw.

Current behavior

I am trying to run msw for development in React Native. It works great for testing! For development I am using the setupServer from ‘msw/native’. When msw is used I get the following error:

TypeError: undefined is not a function
    at createLazyCallback (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:597475:15)
    at InteractiveIsomorphicRequest (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:597331:66)
    at anonymous (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:589356:107)
    at anonymous (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:5194:17)
    at Promise (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:523942:17)
    at fetch (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:5121:25)
    at ?anon_0_ (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:112592:33)
    at next (native)
    at asyncGeneratorStep (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:4630:26)
    at _next (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:4649:29)
    at anonymous (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:4654:14)
    at Promise (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:523942:17)
    at anonymous (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:4646:25)
    at apply (native)
    at _fetchData (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:112596:32)
    at apply (native)
    at fetchData (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:112588:32)
    at anonymous (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:112598:16)
    at commitHookEffectListMount (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:72990:38)
    at commitPassiveMountOnFiber (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:74016:44)
    at commitPassiveMountEffects_complete (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:73988:40)
    at commitPassiveMountEffects_begin (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:73978:47)
    at commitPassiveMountEffects (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:73968:40)
    at flushPassiveEffectsImpl (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:75162:34)
    at flushPassiveEffects (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:75122:43)
    at anonymous (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:75021:34)
    at workLoop (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:77416:48)
    at flushWork (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:77395:28)
    at performWorkUntilDeadline (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:77601:48)
    at apply (native)
    at anonymous (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:29730:26)
    at _callTimer (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:29649:17)
    at _callReactNativeMicrotasksPass (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:29679:17)
    at callReactNativeMicrotasks (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:29842:44)
    at __callReactNativeMicrotasks (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:2779:46)
    at anonymous (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:2591:45)
    at __guard (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:2763:15)
    at flushedQueue (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:2590:21)
    at invokeCallbackAndReturnFlushedQueue (http://192.168.0.101:19000/index.bundle?platform=ios&dev=true&hot=false:2584:33)

Expected behavior

I expect the request to be handled by the handlers but it never makes it there and just throws the error.

About this issue

  • Original URL
  • State: closed
  • Created 8 months ago
  • Comments: 17 (6 by maintainers)

Most upvoted comments

In the mocks folder I have testServer.js which uses msw/node and devServer.js which uses msw/native. In setupJest.js I use the testServer and in App.js I use the devServer

I looked at your repro and I was wondering something, I saw that you use msw/node but I thought there was a ‘msw/native’ which is for react native?

Once you have the repro I’ll take a look. I know that other people have had success with msw + react native so it should work in theory.

Hi, @KrastanD. Thanks for reporting this. Something odd is going on, we should look deeper into this.

Also, do you get the same behavior using msw@next (#1464)? I highly recommend you try that version, it will be the official latest very soon.