Skip to main content

Troubleshooting

FIRST AID

Here are some things to try and help get your setup working again. Make sure you work through them in order:

  1. Try restarting the Metro bundler, e.g. yarn ladbrokes
  2. Try rebuilding the app bundle, e.g. yarn ios:ladbrokes
  3. Rebase your branch with latest changes from upstream main branch, and try reproducing your issue: git pull origin main --rebase
    • Your branch may be missing some fixes or changes that were recently merged into main, if you have not updated your branch in a while.
  4. Check out main branch locally and try reproducing your issue: git checkout main
    • If your local main branch is behind origin/main, be sure to update it first, then try reproducing your issue.
    • If the problem isn’t happening on main branch, there might be some issue with changes you’ve made on the branch you are working on.
  5. Try deleting all project caches, dependencies, and build files, then re-install and re-build them:
    • Run yarn rebuild to delete and re-install dependencies and build files.
    • If that didn’t work, run yarn setup in the project root folder first.
  6. Check the FAQs and Troubleshooting sections of our documentation, for guidance on specific issues.
  7. Search the web for any error messages you get in the simulator, emulator, or console logs, to check for existing solutions.
  8. Try using a different brand for the app, to see if the issue is brand-specific in our code.
    • yarn neds, yarn ios:neds instead of yarn ladbrokes, yarn ios:ladbrokes, etc.
  9. Use a different platform, e.g. Android instead of iOS, to see if the issue is platform-specific.
  10. Uninstall the app you are having issues with, from the simulator/emulator itself, and then try rebuilding and re-installing the app bundle.
  11. Cold boot the iOS simulator, Android emulator, or physical device you are testing development on.
  12. Use a different version of iOS or Android on the simulator/emulator you're developing on.
  13. Use a completely different device model in the simulator/emulator.
  14. Check that you are using the right versions of the following, and that they are properly set up in your environment:
    • Node
      • Yarn
    • For iOS
      • Ruby, Bundler, CocoaPods, Xcode
    • For Android
      • Java Development Kit (JDK), Android SDK, Android Studio
  15. Check that there aren’t multiple conflicting instances of tools in your toolchain
    • E.g. having Node installed via both nvm and volta in the same dev environment, or having yarn installed both via brew and globally via npm, etc.
  16. Restart your computer (seriously).
  17. As a last resort, completely delete and re-pull the project repository, following the First Time Setup steps again.

Specific Issues

On initial setup I get a red and black screen that says Unable to resolve module [path] from App.tsx: None of these files exist.

  1. Shut down computer and reboot
  2. Open ReactNative.xcworkspace
  3. Check xcode > preferences > locations matches the following:
    • Derived Data: Default
    • Archives: Default
    • Command Line Tools: Xcode [version]
  4. xcode > product > clean build folder
  5. run yarn ios:[brand] in apps folder

The build pipeline fails and I get an error message from a failing Jest test, saying that an import statement cannot be used outside of a module.

This happens due to Jest trying to convert non-ES6 modules when it shouldn't.

To fix that, go to the jest.config.js file and add the imported module that it's complaining about to transformIgnorePatterns

When debugging on a physical android device it won't connect to metro.

Make sure all other steps have been correctly followed, i.e. the running on device instructions in the RN docs

Go into network_security_config.xml and debug_network_security_config.xml (if created) at android/app/src/main/res/xml/network_security_config.xml and add a domain line inside domain-config with your system IP next to any existing lines. It should look something like:

...
<domain-config cleartextTrafficPermitted="true">
<domain includeSubdomains="true"> YOUR IP HERE </domain>
</domain-config>
...

If adding your IP to the domain config does not resolve the issue please try the following:

  1. Open the in-app Developer menu. shake your phone or press CMD/ctrl + M
  2. Click on Settings
  3. Click on Debug server host & port for device
  4. On popup, type the IP address and the port of the local dev server. This will be 10.0.2.2:8081.
  5. Go back to the Developer menu and select Reload.

Scrolling behaviours lacks velocity/momentum in the iOS simulator on my M1 machine.

Some people running iOS simulators on their M1 machines will notice that scrolling elements such as ScrollView no longer continue to scroll with velocity/momentum when releasing the drag.

This appears to be a bug when the simulator runs in arm64 mode as documented by this Apple Developer forum post.

We work around this issue by forcing the simulator to run via Rosetta by following these steps:

  1. Go to Applications
  2. Right-click Xcode and select Show Package Contents
  3. Navigate to Contents/Developer/Applications
  4. Right-click Simulator and select Get Info
  5. Check the box Open using Rosetta
  6. Close the Simulator completely, restart it, and test that the issue is no longer present.

Update

Since new version xcode update, the work around above may be not working because option Open using Rosetta is unavailable

following the discussion of Apple Developer forum post

a new workaround could be:

  1. close IOS simulator completely (command + q)
  2. run below command from terminal to open IOS simulator
arch -x86_64 /Applications/Xcode.app/Contents/Developer/Applications/Simulator.app/Contents/MacOS/Simulator