Mocking Camera functionality on iOS simulator with React Native

Tomoaki Imai
4 min readJun 25, 2021

When you build an app that has a Camera functionality, you need to use a real device to go through the photo shooting process. However, sometimes you want to just use a simulator. There are few approaches you can take:

  1. Use Camera Library that supports iOS simulator like https://github.com/teslamotors/react-native-camera-kit
  2. Add Image Picker Library(e.g. https://github.com/react-native-image-picker/react-native-image-picker) and skip the photo shooting process
  3. Create a wrapper component and mock the Camera functionality

In this article, I’m going to explain the third approach. Here’s the video of how it will look.

Running on iOS simulator. We love cats, right?

I’m going to explain in this order:

  • Create a functional Component for Camera
  • Check whether the app is running on a device or iOS simulator
  • Mock takePicture function

If you just want to hop in to the code, the link is here:

--

--

Tomoaki Imai

CTO at Noxx https://www.noxx.net/ AI hiring tool. FullStack developer and leader. Love to share ideas about software development. https://github.com/tomoima525