Verify that the component passed to createAnimatedComponent is not functional

Summary:
Stateless functional components don't support refs and we need that for the component to work, it used to crash with this error message: `undefined is not an object (evaluating 'this._component.getScrollableNode')`. This makes it clear what the issue is.

Fixes some of the errors in #10635, not sure if it fixes all the cases described in the issue though.

**Test plan**
Tested that passing a component with createClass or extends Component works but passing a function causes an error.

[GENERAL] [ENHANCEMENT] [Animated] - Verify that the component passed to createAnimatedComponent is not functional
Closes https://github.com/facebook/react-native/pull/15019

Differential Revision: D6988096

Pulled By: sahrens

fbshipit-source-id: ec0ffa763245e786f44b4a1d56c0738876c25782
This commit is contained in:
Janic Duplessis 2018-02-14 07:51:52 -08:00 committed by Facebook Github Bot
parent 7d20de412b
commit 10b642a7af
2 changed files with 15 additions and 3 deletions

View File

@ -10,11 +10,14 @@
*/
'use strict';
const ClassComponentMock = class {};
ClassComponentMock.prototype.isReactComponent = true;
jest
.clearAllMocks()
.setMock('Text', {})
.setMock('View', {})
.setMock('Image', {})
.setMock('Text', ClassComponentMock)
.setMock('View', ClassComponentMock)
.setMock('Image', ClassComponentMock)
.setMock('React', {Component: class {}})
.setMock('NativeModules', {
NativeAnimatedModule: {},

View File

@ -17,7 +17,16 @@ const AnimatedProps = require('./nodes/AnimatedProps');
const React = require('React');
const ViewStylePropTypes = require('ViewStylePropTypes');
const invariant = require('fbjs/lib/invariant');
function createAnimatedComponent(Component: any): any {
invariant(
typeof Component === 'string' ||
(Component.prototype && Component.prototype.isReactComponent),
'`createAnimatedComponent` does not support stateless functional components; ' +
'use a class component instead.',
);
class AnimatedComponent extends React.Component<Object> {
_component: any;
_invokeAnimatedPropsCallbackOnMount: boolean = false;