Accidentally opened "Run in web browser" and now app will not work in iOS Simulator. Metro (the local dev server) is run from the wrong folder. AppRegistry.registerComponent?

  1. SDK Version: 43.0.2
  2. Platforms(Android/iOS/web/all): web/iOS

I was working in the iOS simulator, my project was working fine. I accidentally clicked “Run in web browser” inside my Metro Bundler browser window.

The below error appeared

TypeError: undefined is not an object (evaluating 'navigator.userAgent.length')
- ... 9 more stack frames from framework internals

Invariant Violation: "main" has not been registered. This can happen if:
* Metro (the local dev server) is run from the wrong folder. Check if Metro is running, stop it and restart it in the current project.
* A module failed to load due to an error and `AppRegistry.registerComponent` wasn't called.
at node_modules/react-native/Libraries/Core/ExceptionsManager.js:104:6 in reportException
at node_modules/react-native/Libraries/Core/ExceptionsManager.js:172:19 in handleException
at node_modules/react-native/Libraries/Core/setUpErrorHandling.js:24:6 in handleError
at node_modules/@react-native/polyfills/error-guard.js:49:36 in ErrorUtils.reportFatalError

Then I ran

$ rm -rf .expo .expo-shared yarn.lock node_modules
$ yarn start

The package.json name and the app.json name are the same.

Still the error is persisting.

Could it be something to do with AppEntry.js or AppRegistry.js?

I am interested in eventually supporting a web browser client of my app.

Package.json:

{
  "name": "appname",
  "version": "1.0.0",
  "main": "node_modules/expo/AppEntry.js",
  "dependencies": {
    "@apollo/client": "^3.5.5",
    "@bugsnag/expo": "^7.15.1",
    "@expo/vector-icons": "^12.0.0",
    "@react-native-async-storage/async-storage": "~1.15.0",
    "@react-navigation/bottom-tabs": "^6.0.5",
    "@react-navigation/native": "^6.0.2",
    "@react-navigation/native-stack": "^6.1.0",
    "@splitsoftware/splitio": "^10.17.1",
    "apollo3-cache-persist": "^0.13.0",
    "cross-fetch": "^3.1.4",
    "expo": "~43.0.2",
    "expo-analytics-segment": "~11.0.3",
    "expo-asset": "~8.4.3",
    "expo-constants": "~12.1.3",
    "expo-facebook": "~12.0.3",
    "expo-firebase-recaptcha": "^2.1.0",
    "expo-font": "~10.0.3",
    "expo-linking": "~2.4.2",
    "expo-localization": "~11.0.0",
    "expo-modules-core": "~0.4.10",
    "expo-notifications": "~0.13.3",
    "expo-splash-screen": "~0.13.5",
    "expo-status-bar": "~1.1.0",
    "expo-updates": "~0.10.15",
    "expo-web-browser": "~10.0.3",
    "firebase": "9.5.0",
    "graphql": "^16.0.1",
    "i18n-js": "^3.8.0",
    "jest-fetch-mock": "^3.0.3",
    "react": "17.0.1",
    "react-dom": "17.0.1",
    "react-native": "0.64.3",
    "react-native-country-picker-modal": "^2.0.0",
    "react-native-gesture-handler": "^2.2.0",
    "react-native-reanimated": "^2.3.1",
    "react-native-safe-area-context": "3.3.2",
    "react-native-screens": "~3.8.0",
    "react-native-web": "0.17.1"
  },
  "devDependencies": {
    "@babel/core": "^7.12.9",
    "@testing-library/jest-native": "^4.0.4",
    "@testing-library/react-native": "^9.0.0",
    "@types/country-select-js": "^1.0.2",
    "@types/enzyme": "^3.10.11",
    "@types/i18n-js": "^3.8.2",
    "@types/jest": "^27.4.0",
    "@types/react": "~17.0.21",
    "@types/react-native": "~0.64.12",
    "@types/react-test-renderer": "^17.0.1",
    "enzyme": "^3.11.0",
    "enzyme-adapter-react-16": "^1.15.6",
    "eslint-config-airbnb": "^19.0.4",
    "jest": "^27.4.7",
    "jest-expo": "~43.0.0",
    "react-test-renderer": "17",
    "ts-jest": "^27.1.3",
    "ts-node": "^10.4.0",
    "typescript": "~4.3.5"
  },
  "private": true
}

are you sure pressing that was the cause? there is no side effect that will be persisted after deleting the directories that you did. you may want to try reverting to your last known working commit to verify

Environment

  • Bugsnag version: "@bugsnag/expo": "^7.16.0",
  • Browser framework version (if any):
    • "react-native": "0.64.3",
    • "react": "17.0.1",
  • Expo SDK Version: 43.0.2
  • Platforms(Android/iOS/web/all): web/iOS
  • Browser version (e.g. chrome, safari): Expo iOS simulator
  • Device (e.g. iphonex): iOS Simulator

Describe the bug

I was working in the iOS simulator, my project was working fine. I accidentally clicked “Run in web browser” inside my Metro Bundler browser window.

The below errors appeared

Error 1:

TypeError: undefined is not an object (evaluating 'navigator.userAgent.length')
- ... 9 more stack frames from framework internals

Error 2:

Invariant Violation: "main" has not been registered. This can happen if:
* Metro (the local dev server) is run from the wrong folder. Check if Metro is running, stop it and restart it in the current project.
* A module failed to load due to an error and `AppRegistry.registerComponent` wasn't called.
at node_modules/react-native/Libraries/Core/ExceptionsManager.js:104:6 in reportException
at node_modules/react-native/Libraries/Core/ExceptionsManager.js:172:19 in handleException
at node_modules/react-native/Libraries/Core/setUpErrorHandling.js:24:6 in handleError
at node_modules/@react-native/polyfills/error-guard.js:49:36 in ErrorUtils.reportFatalError

Attempts:


Attempt 1:

The package.json name and the app.json name are the same. I have restated my computer. Two metro bundlers are not running. I haven’t edited AppRegistry.registerComponent or changed Expo’s AppEntry.js.


Attempt 2:

I went back to an old commit, when I knew this was working, then ran the following commands:

$ rm -rf .expo .expo-shared yarn.lock node_modules
$ watchman watch-del-all 
$ rm -rf node_modules 
$ rm -fr $TMPDIR/haste-map-*
$ rm -rf $TMPDIR/metro-cache
$ yarn cache clean
$ yarn
$ yarn start

Even after doing this, the errors are still occurring.


Attempt 3:

navigator.userAgent would only be needed for the browser, not for an iOS or Android device. Which is why I think the issue I’m seeing is related to when I clicked “Run in web browser”.

Notice that it says fingerprint.browser.js and AppEntry.bundle:192932:32 and loadModuleImplementation. I’ve a feeling that I may have not set something up for a web version of my app but after clicking that button something automagically changed.

I click on fingerprint.browser.js in the Call Stack and my editor opened a @bugsnag/cuid/lib/fingerprint.browser.js file, which has the navigator.userAgent code. :thinking: This comes from a bugsnag submodule located here

I re-initialized bugsnag: $ npx bugsnag-expo-cli init.

This had no change.

For some reason it appears that Bugsnag thinks I’m trying to load my app inside the browser when in fact I’m loading it within the iOS simulator. I looked into the package and it isn’t obvious how this distinction is being made.


Thoughts

  • These two errors seem related. It appears that by triggering the web version of the app, the app and bugsnag have become confused on if I’m rendering in the browser or in a Native environment.
  • Something seems to be happening to the CUID lib but I can’t exactly pinpoint what.

I’ll continue debugging this until I find a solution but if anyone has any ideas I’m all ears. If I find a solution I’ll post it here.

TLDR: Remove bugsnag

Partial solution, but progress :man_shrugging:

First approach

I removed "@bugsnag/expo": "^7.15.1", from my package JSON, remove all references to this package being loaded into my app, then $ yarn start and the app built as before.

To confirm, I re-added bugsnag. $yarn start and the same navigator.userAgent error as above appears.

Simplest approach

I kept @bugsnag/expo installed but I never call bugsnag.start(). The app builds correctly in both iOS and web.

Final thoughts

Problem appears to be with Bugsnag retrieving the correct fingerprint.
Follow this thread on Bugsnag’s issues board if you are curious about where this went.

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.