Switch Stateless function cannot be given refs when run unit test

[kubens]

Is this a bug report?

Yes

Have you read the Contributing Guidelines?

Yes

Environment

Environment:
OS: macOS High Sierra 10.13
Node: 8.6.0
Yarn: 1.1.0
npm: 5.3.0
Watchman: 4.9.0
Xcode: Xcode 9.0 Build version 9A235
Android Studio: Not Found

Packages: (wanted => installed)
react: 16.0.0-beta.5 => 16.0.0-beta.5
react-native: 0.49.1 => 0.49.1

Target Platform: iOS (11)

Steps to Reproduce

1. react-native init
2. Add Switch component to App.js
3. Run unit test

Expected Behavior

Should run unit test without console.error

Actual Behavior

  console.error node_modules/fbjs/lib/warning.js:33
    Warning: Stateless function components cannot be given refs. Attempts to access this ref will fail.

    Check the render method of `Switch`.
        in Unknown (created by Switch)
        in Switch (created by App)
        in View (created by View)
        in View (created by App)
        in App

Reproducible Demo

App.js file

/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 * @flow
 */

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


export default class App extends Component<{}> {
  render() {
    return (
      <View>
        <Switch />
      </View>
    );
  }
}

__tests__/App.test.js file

import 'react-native';
import React from 'react';
import App from '../App';

// Note: test renderer must be required after react-native.
import renderer from 'react-test-renderer';

it('renders correctly', () => {
  const tree = renderer.create(
    <App />
  );
});

package.json file

{
	"name": "test",
	"version": "0.0.1",
	"private": true,
	"scripts": {
		"start": "node node_modules/react-native/local-cli/cli.js start",
		"test": "jest"
	},
	"dependencies": {
		"react": "16.0.0-beta.5",
		"react-native": "0.49.2"
	},
	"devDependencies": {
		"babel-jest": "21.2.0",
		"babel-preset-react-native": "4.0.0",
		"jest": "21.2.1",
		"react-test-renderer": "16.0.0-beta.5"
	},
	"jest": {
		"preset": "react-native"
	}
}

[8of]

How do you run the test?
What's in the package.json file?

[kubens]

I run test by yarn test. package.json added to first post

[sam-vdp]

Some more detail: The issue is caused by the native RCTSwitch component used by Switch.render:

return (
  <RCTSwitch
    {...props}
    ref={(ref) => { this._rctSwitch = ref; }}
    onChange={this._onChange}
  />
);

As you can see this component is assigned a ref. However, react-test-renderer uses the following code to check if a component is stateless:

if (typeof value === 'object' && value !== null && typeof value.render === 'function') {
  // Proceed under the assumption that this is a class instance

Because RCTSwitch doesn't have a render method, the warning is raised.

See also: https://stackoverflow.com/questions/47058905/using-react-test-renderer-with-switch-causes-stateless-function-components-ca

[djalmaaraujo]

Happening with me.

[idrakimuhamad]

Bump to this too today when running Jest

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Maybe the issue has been fixed in a recent release, or perhaps it is not affecting a lot of people. If you think this issue should definitely remain open, please let us know why. Thank you for your contributions.

[djalmaaraujo]

According to last messages there are useful info. Why closing?

[tinaboyce]

Bump just to inform I have encountered it today.

[stale]

Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as "For Discussion" or "Good first issue" and I will leave it open. Thank you for your contributions.

[react-native-bot]

It looks like your issue may refer to an older version of React Native. Can you reproduce the issue on the latest release, v0.55?