react-native-invariants

Check React Native invariants with react-test-renderer.

Usage no npm install needed!

<script type="module">
  import reactNativeInvariants from 'https://cdn.skypack.dev/react-native-invariants';
</script>

README

React Native Invariants

Travis (.com) Coveralls github npm

This package checks React Native invariants not covered by react-test-renderer and friends.

Motivation

Libraries like react-test-renderer and react-native-testing-library overlook React Native invariant violations (obviously). We want to detect this type of errors in unit tests, while waiting for Enzyme to hopefully catch up.

<View>
  <CircularProgress />
  Loading in progress...
</View>

The most common mistakes (for us non-native developers) are raw text not inside Text components, and Views inside Text components. This library detects both.

Installation

yarn add --dev react-native-invariants react-test-renderer

Usage

import React from 'react';
import renderer from 'react-test-renderer';
import { checkInvariants } from 'react-native-invariants';
import { MyComponent } from '../somewhere';

it('Tests a React Native component', () => {
  const tree = renderer.create(<MyComponent />).toJSON();
  checkInvariants(tree);
});

Or redefine a render method to always check invariants.