Component not rendering in Mocha

[CodingItWrong]

I'm attempting to create a "Hello World" component to try out RNTL with Mocha and I'm getting an error attempting to render the component.

Full reproduction repo: https://github.com/CodingItWrong/RNTLTestMocha

Component:

import React from 'react';
import { View, Text } from 'react-native';

export default function Hello() {
  return <View>
    <Text>asdf</Text>
  </View>;
}

Test:

import { expect } from 'chai';
import React from 'react';
import { render, fireEvent } from 'react-native-testing-library';

import Hello from '../Hello';

describe('Hello', () => {
  it('displays the message', () => {
    const { debug, getByText } = render(<Hello />);

    debug();

    expect(getByText('asdf')).not.to.be.null;
  });
});

Error:

  1) Hello
       displays the message:
     Error: Cannot find module 'View'
      at require (internal/module.js:11:18)
      at Object.get View [as View] (node_modules/react-native/Libraries/react-native/react-native-implementation.js:167:12)
      at Hello (Hello.js:5:11)
      at mountIndeterminateComponent (node_modules/react-test-renderer/cjs/react-test-renderer.development.js:6889:13)

I have react-test-renderer installed. Does RNTL work with Mocha? Am I missing another dependency? If it's Jest-only I think it would be good to add a note in the README; I can PR that if so.

[thymikee]

I only tested it with Jest, but cannot think of anything that would prevent this working with Mocha 🤔

[thymikee]

I don't see any setup for Haste in your example, which RN still uses. Not sure how that works with Mocha, but that's definitely an issue. Maybe check some articles on making that work? https://blog.addjam.com/testing-react-native-with-mocha-and-enzyme-6b77cd9e52a1

Curious what's your motivation for using Mocha with RN? Curiosity, research or something lacking in Jest?

[CodingItWrong]

I don't have a strong enough preference for Mocha to journey off the beaten path here; using it with Jest would work well enough. So I'm good to go for my own personal project 👍

Using Jest with RN has had some stability issues that Mocha hasn't suffered from; just now installing RN 0.57.8 I ran into facebook/react-native#21241, and around the time of the upgrade to Babel 7 babel-jest had a problem. Also, Mocha not having parallel development actually works out better for me for a TDD flow.

I haven't heard about Haste before; I was able to get Enzyme working without anything like that 🤔

I can't say for sure that it doesn't work with Mocha, so I don't think we would need to say anything that strongly worded in the readme. What do you think about adding a note that it is tested with Jest but should also work with Mocha? That would be a cue to new users for which to try first.

[thymikee]

and around the time of the upgrade to Babel 7 babel-jest had a problem

Honestly, these are mainly issues with React Native preset, not Jest itself. The thing is RN is just not tested well enough, and there's so many setups. Jest is however making its path to use Babel 7 internally, so it should all be smoother with the next major release (v24).

I haven't heard about Haste before; I was able to get Enzyme working without anything like that 🤔

Haste is a module system used by Facebook, Enzyme has nothing to do with it. It's your runtime environment (Metro, Jest, Webpack) that's responsible for understanding it.

What do you think about adding a note that it is tested with Jest but should also work with Mocha? That would be a cue to new users for which to try first.

👍. Would love to accept a PR on that.