CODEWITHSUNDEEP
react-native
Abdullah Almesbahi
Abdullah Almesbahi

Reputation: 281

Running multiple iOS simulators with React Native?

I want to run the app in multiple IOS simulators with React Native so will be able to compare the iPhone version vs the iPad version

I see there is some one already did it https://ashleyd.ws/running-multiple-ios-simulators-with-react-native/

but unfortunate he did not mention how he did it

Upvotes: 23

Views: 22895

Answers (7)

Mohd Sher Khan
Mohd Sher Khan

Reputation: 1087

I have Used more than 2 Simulator at a one time by using different terminals and they works well 

react-native run-ios --simulator="iPhone 11 Pro Max"  //write like this.
react-native run-ios --simulator="iPhone 6".          //write like this.
react-native run-ios --simulator="iPhone 12 Pro Max"  //write like this.
react-native run-ios --simulator="iPhone 8 Plus".

Upvotes: 1

Jose
Jose

Reputation: 2289

I got two separate react native apps running at the same time doing this

I entered the following in one terminal for the first app 

react-native run-ios --simulator="iPhone X"

After that finished building I opened another terminal and ran for the second app

react-native run-ios --simulator="iPhone XS" --port=8088

Then that built the second app on the new simulator and using a different port for the metro bundler. However after the second one built the first app changed its screen from the first app to the second app. I hit the home button and just re-opened the first app. One observation is that the first app seems to have both apps installed in the simulator while the second one does not.

Upvotes: 14

navalsaini
navalsaini

Reputation: 522

Some of the answers above helped me, but I think they are incomplete.

I have been using this technique to test a two player game (halfchess.com) on iOS simulators. My goal is to run two instances of halfchess at the same time.

To have my app running on two simulators, I first need to install Expo app on multiple simulators. Below steps are for the first time only.

  1. react-native-scripts start to run the package manager. Copy the expo URL for the app, for ex., exp://172.20.10.2:19000 to clipboard.
  2. Run ios simulator from within above (press i). This opens a default simulator and runs the app. Lets call the default device X.
  3. Goto menu Hardware -> Device -> iOS -> select a different device
  4. Close the current device from File -> Close Window. Now we have only one window open.
  5. Install expo app on this device by restarting package manger and pressing i again for install.
  6. Now we can open the earlier closed device X again. Open simulator and open the expo app.
  7. The expo URL from step 1 should be in clipboard textarea for the expo app. Launch the app by clicking the URL.

For next time onwards, the picked devices already have an expo app installed.

  1. Do step 1 as above.
  2. Open the default X and the other device Y.
  3. Open e

xpo apps on devices and follow step 7 to run the app on both simulators.

So its much faster the second time onwards.

The downside with this is that logs from both simulators appear in the same terminal. Right now, I have cloned the project in a different directory, and do react-native-scrips start from a different terminal; and use the second expo URL generated in one of the simulators. The logs from both simulators now appear in different terminals. There should be better ways to do this.

PS - I am currently on version 10+ of xcode.

Upvotes: 0

Gijs
Gijs

Reputation: 434

Opening multiple simulators from the command-line did not work for me. With some manual interaction I got this to work with simulator 10.0 and react-native 0.47.2 - its based on the fact that react native always opens the app in the last opened simulator:

  • manually open simulator
  • start app: react-native run-ios
  • manually do: Hardware -> Device -> select iOS -> select Device (different then before !)
  • that will open a second simulator
  • start app again: react-native run-ios
  • this opens the app in the second simulator

Upvotes: 1

Gijs
Gijs

Reputation: 434

Another option is to run the app from xcode plus open another one from react-native commandline. Each normally opens their own simulator (I wonder why). And if I run an end-to-end test with Detox then it also opens its own simulator.

Upvotes: 0

Mohamed Saleh
Mohamed Saleh

Reputation: 3287

This isn't the direct answer to your question, but I think it gives a better solution than running different simulators. You can check the following lib called ScreenSwitcher.

It basically use the same simulator, in our case iPhone 6 plus only and you can check and inspect any other smaller screen on it directly. I find that approach more efficient and faster.

ScreenSwitcher

Upvotes: 1

Wookiem
Wookiem

Reputation: 1730

Using MacOs Terminal, launch first simulator:

  1. cd /Applications/Xcode.app/Contents/Developer/Applications
  2. open -n Simulator.app
  3. cd <your react native project>
  4. react-native run-ios

Now, launch 2nd simulator:

  1. cd /Applications/Xcode.app/Contents/Developer/Applications
  2. open -n Simulator.app
  3. Click "Ok" when you get "Unable to boot device in current state"
  4. Change simulator to be different than first simulator (e.g. Hardware -> Device -> iPhone 6s)
  5. cd <react-native project>
  6. react-native run-ios --simulator "iPhone 6s" (or whatever simulator you chose in step 8).

Note: In the last step, you can disregard the terminal output since it indicates that it is launching using the 1st simulator hardware. In fact, it is launching into the 2nd simulator (as desired).

Upvotes: 39

Related Questions