Skip to content

Test fails after upgrading to 0.56.0 - babel 7 #20141

Closed
@fhadsheikh

Description

@fhadsheikh

Environment

React Native Environment Info:
System:
OS: macOS High Sierra 10.13.3
CPU: x64 Intel(R) Core(TM) i7-4870HQ CPU @ 2.50GHz
Memory: 39.36 MB / 16.00 GB
Shell: 5.3 - /bin/zsh
Binaries:
Node: 8.0.0 - ~/.nvm/versions/node/v8.0.0/bin/node
Yarn: 1.7.0 - ~/.nvm/versions/node/v8.0.0/bin/yarn
npm: 5.4.1 - ~/.nvm/versions/node/v8.0.0/bin/npm
Watchman: 4.7.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 11.4, macOS 10.13, tvOS 11.4, watchOS 4.3
Android SDK:
Build Tools: 26.0.2
IDEs:
Android Studio: 3.1 AI-173.4670197
Xcode: 9.4/9F1027a - /usr/bin/xcodebuild
npmPackages:
react: 16.4.1 => 16.4.1
react-native: 0.56.0 => 0.56.0
npmGlobalPackages:
create-react-native-app: 1.0.0
eslint-plugin-react-native: 3.0.1
react-native-cli: 2.0.1
react-native-git-upgrade: 0.2.7

Description

Tests are failing with:

TypeError: this._instance.render is not a function

Tests only fail when NOT using arrow function.

Package.json

{
  "name": "TestApp56",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },
  "dependencies": {
    "react": "16.4.1",
    "react-native": "0.56.0"
  },
  "devDependencies": {
    "@babel/core": "^7.0.0-beta.52",
    "babel-core": "^7.0.0-0",
    "babel-jest": "^23.4.0",
    "babel-preset-react-native": "^5.0.1",
    "jest": "^23.4.0",
    "react-test-renderer": "16.4.1",
    "regenerator-runtime": "^0.12.0"
  },
  "jest": {
    "preset": "react-native",
    "transformIgnorePatterns": [
      "node_modules/(?!react-native).+\\.js$"
    ]
  }
}

Fails

import React, { Component } from 'react';
import { Text } from 'react-native';
import ShallowRenderer from 'react-test-renderer/shallow';

class Terms extends Component {
    render() {
        return <Text>Hello</Text>
    }
}


describe('Terms', () => {
    let props;
    let renderer;
    const render = () => {
        if (! renderer) {
            renderer = new ShallowRenderer();
            renderer.render(<Terms {...props} />);
        }
        return renderer;
    };

    it('renders when terms ARE required', () => {
        const rendered = render().getRenderOutput();
        expect(rendered).toBeTruthy();
    });
});

Passes

import React, { Component } from 'react';
import { Text } from 'react-native';
import ShallowRenderer from 'react-test-renderer/shallow';

class Terms extends Component {
    render = () => <Text>Hello</Text>
}


describe('Terms', () => {
    let props;
    let renderer;
    const render = () => {
        if (! renderer) {
            renderer = new ShallowRenderer();
            renderer.render(<Terms {...props} />);
        }
        return renderer;
    };

    it('renders when terms ARE required', () => {
        const rendered = render().getRenderOutput();
        expect(rendered).toBeTruthy();
    });
});

Repro repo

link here

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions