Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

604
Views
how to mock react-native-camera with jest?

I am trying to test react-native-camera module with jest

So I have the following package.json:

{
  "name": "app",
  "version": "0.0.1",
  "private": true,
  "main": "index.js",
  "license": "MIT",
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },
  "dependencies": {
    "react": "~15.4.0-rc.4",
    "react-native": "0.40.0",
    "react-native-camera": "^0.5.1"
  },
  "devDependencies": {
    "babel-eslint": "^7.1.1",
    "babel-jest": "18.0.0",
    "babel-preset-react-native": "1.9.1",
    "jest": "18.1.0",
    "react-test-renderer": "~15.4.0-rc.4"
  },
  "jest": {
    "preset": "react-native"
  }
}

And given the following Component as it is in the example:

import React from 'react';
import Camera from 'react-native-camera';

class CameraComponent extends React.Component {
  constructor(props: Props) {
    super(props);

    this.camera = null;

    this.state = {
      camera: {
        aspect: Camera.constants.Aspect.stretch,
        captureTarget: Camera.constants.CaptureTarget.cameraRoll,
        type: Camera.constants.Type.back,
        orientation: Camera.constants.Orientation.auto,
        flashMode: Camera.constants.FlashMode.auto,
      }
    };
  }

  render() {
    return (
        <Camera
          ref={(cam) => {
            this.camera = cam;
          }}
          style={styles.preview}
          aspect={this.state.camera.aspect}
          captureTarget={this.state.camera.captureTarget}
          type={this.state.camera.type}
          flashMode={this.state.camera.flashMode}
          defaultTouchToFocus
          mirrorImage={false}
        />
    );
  }
}

const styles = StyleSheet.create({
  preview: {
    flex: 1
  }
}

So the test below is failing with the following message:

TypeError: Cannot read property 'Aspect' of undefined

import 'react-native';
import React from 'react';
import Index from '../index.ios.js';

import renderer from 'react-test-renderer';

it('renders correctly', () => {
  const tree = renderer.create(
    <Index />
  );
});
over 4 years ago · Santiago Trujillo
2 answers
Answer question

0

To fix that created react-native-camera react component in __mocks__ folder:

import React from 'react';

const constants = constants = {
  Aspect: {},
  BarCodeType: {},
  Type: {},
  CaptureMode: {},
  CaptureTarget: {},
  CaptureQuality: {},
  Orientation: {},
  FlashMode: {},
  TorchMode: {}
};

class Camera extends React.Component {

  static constants = constants
  render() {
    return null;
  }
}

Camera.constants = constants;

export default Camera;

And modified the test by adding the following lines:

import mockCamera from '../__mocks__/Camera';

jest.mock('react-native-camera', () => mockCamera);
over 4 years ago · Santiago Trujillo Report

0

You have to mock it using the name of the library and name of the component like this:

jest.mock('react-native-camera', () => 'Camera');

More info here: https://facebook.github.io/jest/docs/tutorial-react-native.html#tips

over 4 years ago · Santiago Trujillo Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!