diff --git a/src/isomorphic/classic/__tests__/ReactContextValidator-test.js b/src/isomorphic/classic/__tests__/ReactContextValidator-test.js
index 56ba39cc480ca..37e77d7de8f11 100644
--- a/src/isomorphic/classic/__tests__/ReactContextValidator-test.js
+++ b/src/isomorphic/classic/__tests__/ReactContextValidator-test.js
@@ -41,33 +41,33 @@ describe('ReactContextValidator', function() {
// ensure that this is not required for ES6 classes with Flow.
it('should filter out context not in contextTypes', function() {
- class Component extends React.Component {
- static contextTypes = {
+ var Component = React.createClass({
+ contextTypes: {
foo: React.PropTypes.string,
- };
+ },
- render() {
+ render: function() {
return
;
- }
- }
+ },
+ });
- class ComponentInFooBarContext extends React.Component {
- static childContextTypes = {
+ var ComponentInFooBarContext = React.createClass({
+ childContextTypes: {
foo: React.PropTypes.string,
bar: React.PropTypes.number,
- };
+ },
- getChildContext() {
+ getChildContext: function() {
return {
foo: 'abc',
bar: 123,
};
- }
+ },
- render() {
+ render: function() {
return ;
- }
- }
+ },
+ });
var instance = ReactTestUtils.renderIntoDocument();
reactComponentExpect(instance).expectRenderedChild().scalarContextEqual({foo: 'abc'});
@@ -79,51 +79,51 @@ describe('ReactContextValidator', function() {
var actualComponentWillUpdate;
var actualComponentDidUpdate;
- class Parent extends React.Component {
- static childContextTypes = {
+ var Parent = React.createClass({
+ childContextTypes: {
foo: React.PropTypes.string.isRequired,
bar: React.PropTypes.string.isRequired,
- };
+ },
- getChildContext() {
+ getChildContext: function() {
return {
foo: this.props.foo,
bar: 'bar',
};
- }
+ },
- render() {
+ render: function() {
return ;
- }
- }
+ },
+ });
- class Component extends React.Component {
- static contextTypes = {
+ var Component = React.createClass({
+ contextTypes: {
foo: React.PropTypes.string,
- };
+ },
- componentWillReceiveProps(nextProps, nextContext) {
+ componentWillReceiveProps: function(nextProps, nextContext) {
actualComponentWillReceiveProps = nextContext;
return true;
- }
+ },
- shouldComponentUpdate(nextProps, nextState, nextContext) {
+ shouldComponentUpdate: function(nextProps, nextState, nextContext) {
actualShouldComponentUpdate = nextContext;
return true;
- }
+ },
- componentWillUpdate(nextProps, nextState, nextContext) {
+ componentWillUpdate: function(nextProps, nextState, nextContext) {
actualComponentWillUpdate = nextContext;
- }
+ },
- componentDidUpdate(prevProps, prevState, prevContext) {
+ componentDidUpdate: function(prevProps, prevState, prevContext) {
actualComponentDidUpdate = prevContext;
- }
+ },
- render() {
+ render: function() {
return ;
- }
- }
+ },
+ });
var container = document.createElement('div');
ReactDOM.render(, container);
@@ -137,15 +137,15 @@ describe('ReactContextValidator', function() {
it('should check context types', function() {
spyOn(console, 'error');
- class Component extends React.Component {
- static contextTypes = {
+ var Component = React.createClass({
+ contextTypes: {
foo: React.PropTypes.string.isRequired,
- };
+ },
- render() {
+ render: function() {
return ;
- }
- }
+ },
+ });
ReactTestUtils.renderIntoDocument();
@@ -156,21 +156,21 @@ describe('ReactContextValidator', function() {
' in Component (at **)'
);
- class ComponentInFooStringContext extends React.Component {
- static childContextTypes = {
+ var ComponentInFooStringContext = React.createClass({
+ childContextTypes: {
foo: React.PropTypes.string,
- };
+ },
- getChildContext() {
+ getChildContext: function() {
return {
foo: this.props.fooValue,
};
- }
+ },
- render() {
+ render: function() {
return ;
- }
- }
+ },
+ });
ReactTestUtils.renderIntoDocument(
@@ -179,21 +179,21 @@ describe('ReactContextValidator', function() {
// Previous call should not error
expect(console.error.calls.count()).toBe(1);
- class ComponentInFooNumberContext extends React.Component {
- static childContextTypes = {
+ var ComponentInFooNumberContext = React.createClass({
+ childContextTypes: {
foo: React.PropTypes.number,
- };
+ },
- getChildContext() {
+ getChildContext: function() {
return {
foo: this.props.fooValue,
};
- }
+ },
- render() {
+ render: function() {
return ;
- }
- }
+ },
+ });
ReactTestUtils.renderIntoDocument();
@@ -210,20 +210,20 @@ describe('ReactContextValidator', function() {
it('should check child context types', function() {
spyOn(console, 'error');
- class Component extends React.Component {
- static childContextTypes = {
+ var Component = React.createClass({
+ childContextTypes: {
foo: React.PropTypes.string.isRequired,
bar: React.PropTypes.number,
- };
+ },
- getChildContext() {
+ getChildContext: function() {
return this.props.testContext;
- }
+ },
- render() {
+ render: function() {
return ;
- }
- }
+ },
+ });
ReactTestUtils.renderIntoDocument();
expect(console.error.calls.count()).toBe(1);
diff --git a/src/isomorphic/classic/element/__tests__/ReactElement-test.js b/src/isomorphic/classic/element/__tests__/ReactElement-test.js
index c0a9609bc3732..353989ad6b089 100644
--- a/src/isomorphic/classic/element/__tests__/ReactElement-test.js
+++ b/src/isomorphic/classic/element/__tests__/ReactElement-test.js
@@ -32,11 +32,11 @@ describe('ReactElement', function() {
ReactTestUtils = require('ReactTestUtils');
// NOTE: We're explicitly not using JSX here. This is intended to test
// classic JS without JSX.
- ComponentClass = class extends React.Component {
- render() {
+ ComponentClass = React.createClass({
+ render: function() {
return React.createElement('div');
- }
- };
+ },
+ });
});
afterEach(function() {
@@ -60,15 +60,13 @@ describe('ReactElement', function() {
it('should warn when `key` is being accessed on createClass element', function() {
spyOn(console, 'error');
var container = document.createElement('div');
-
- class Child extends React.Component {
- render() {
+ var Child = React.createClass({
+ render: function() {
return {this.props.key}
;
- }
- }
-
- class Parent extends React.Component {
- render() {
+ },
+ });
+ var Parent = React.createClass({
+ render: function() {
return (
@@ -76,9 +74,8 @@ describe('ReactElement', function() {
);
- }
- }
-
+ },
+ });
expect(console.error.calls.count()).toBe(0);
ReactDOM.render(, container);
expect(console.error.calls.count()).toBe(1);
@@ -98,9 +95,8 @@ describe('ReactElement', function() {
return {this.props.key}
;
}
}
-
- class Parent extends React.Component {
- render() {
+ var Parent = React.createClass({
+ render: function() {
return (
@@ -108,9 +104,8 @@ describe('ReactElement', function() {
);
- }
- }
-
+ },
+ });
expect(console.error.calls.count()).toBe(0);
ReactDOM.render(, container);
expect(console.error.calls.count()).toBe(1);
@@ -139,23 +134,20 @@ describe('ReactElement', function() {
it('should warn when `ref` is being accessed', function() {
spyOn(console, 'error');
var container = document.createElement('div');
-
- class Child extends React.Component {
- render() {
+ var Child = React.createClass({
+ render: function() {
return {this.props.ref}
;
- }
- }
-
- class Parent extends React.Component {
- render() {
+ },
+ });
+ var Parent = React.createClass({
+ render: function() {
return (
);
- }
- }
-
+ },
+ });
expect(console.error.calls.count()).toBe(0);
ReactDOM.render(, container);
expect(console.error.calls.count()).toBe(1);
@@ -275,12 +267,12 @@ describe('ReactElement', function() {
var Component = React.createFactory(ComponentClass);
var element;
- class Wrapper extends React.Component {
- render() {
+ var Wrapper = React.createClass({
+ render: function() {
element = Component();
return element;
- }
- }
+ },
+ });
var instance = ReactTestUtils.renderIntoDocument(
React.createElement(Wrapper)
@@ -332,17 +324,19 @@ describe('ReactElement', function() {
it('allows static methods to be called using the type property', function() {
spyOn(console, 'error');
- class StaticMethodComponentClass extends React.Component {
- static someStaticMethod() {
- return 'someReturnValue';
- }
-
- state = {valueToReturn: 'hi'};
-
- render() {
+ var StaticMethodComponentClass = React.createClass({
+ statics: {
+ someStaticMethod: function() {
+ return 'someReturnValue';
+ },
+ },
+ getInitialState: function() {
+ return {valueToReturn: 'hi'};
+ },
+ render: function() {
return React.createElement('div');
- }
- }
+ },
+ });
var element = React.createElement(StaticMethodComponentClass);
expect(element.type.someStaticMethod()).toBe('someReturnValue');
@@ -352,11 +346,11 @@ describe('ReactElement', function() {
// NOTE: We're explicitly not using JSX here. This is intended to test
// classic JS without JSX.
it('identifies valid elements', function() {
- class Component extends React.Component {
- render() {
+ var Component = React.createClass({
+ render: function() {
return React.createElement('div');
- }
- }
+ },
+ });
expect(React.isValidElement(React.createElement('div')))
.toEqual(true);
@@ -401,13 +395,14 @@ describe('ReactElement', function() {
// NOTE: We're explicitly not using JSX here. This is intended to test
// classic JS without JSX.
it('should use default prop value when removing a prop', function() {
- class Component extends React.Component {
- static defaultProps = {fruit: 'persimmon'};
-
- render() {
+ var Component = React.createClass({
+ getDefaultProps: function() {
+ return {fruit: 'persimmon'};
+ },
+ render: function() {
return React.createElement('span');
- }
- }
+ },
+ });
var container = document.createElement('div');
var instance = ReactDOM.render(
@@ -423,13 +418,14 @@ describe('ReactElement', function() {
// NOTE: We're explicitly not using JSX here. This is intended to test
// classic JS without JSX.
it('should normalize props with default values', function() {
- class Component extends React.Component {
- static defaultProps = {prop: 'testKey'};
-
- render() {
+ var Component = React.createClass({
+ getDefaultProps: function() {
+ return {prop: 'testKey'};
+ },
+ render: function() {
return React.createElement('span', null, this.props.prop);
- }
- }
+ },
+ });
var instance = ReactTestUtils.renderIntoDocument(
React.createElement(Component)
@@ -443,8 +439,8 @@ describe('ReactElement', function() {
});
it('throws when changing a prop (in dev) after element creation', function() {
- class Outer extends React.Component {
- render() {
+ var Outer = React.createClass({
+ render: function() {
var el = ;
expect(function() {
@@ -453,22 +449,17 @@ describe('ReactElement', function() {
expect(el.props.className).toBe('moo');
return el;
- }
- }
-
+ },
+ });
var outer = ReactTestUtils.renderIntoDocument();
expect(ReactDOM.findDOMNode(outer).className).toBe('moo');
});
it('throws when adding a prop (in dev) after element creation', function() {
var container = document.createElement('div');
-
- class Outer extends React.Component {
- static defaultProps = (() => ({
- sound: 'meow',
- }))();
-
- render() {
+ var Outer = React.createClass({
+ getDefaultProps: () => ({sound: 'meow'}),
+ render: function() {
var el = {this.props.sound}
;
expect(function() {
@@ -478,9 +469,8 @@ describe('ReactElement', function() {
expect(el.props.className).toBe(undefined);
return el;
- }
- }
-
+ },
+ });
var outer = ReactDOM.render(, container);
expect(ReactDOM.findDOMNode(outer).textContent).toBe('meow');
expect(ReactDOM.findDOMNode(outer).className).toBe('');
@@ -488,13 +478,11 @@ describe('ReactElement', function() {
it('does not warn for NaN props', function() {
spyOn(console, 'error');
-
- class Test extends React.Component {
- render() {
+ var Test = React.createClass({
+ render: function() {
return ;
- }
- }
-
+ },
+ });
var test = ReactTestUtils.renderIntoDocument();
expect(test.props.value).toBeNaN();
expect(console.error.calls.count()).toBe(0);
@@ -522,11 +510,11 @@ describe('ReactElement', function() {
React = require('React');
- class Component extends React.Component {
- render() {
+ var Component = React.createClass({
+ render: function() {
return React.createElement('div');
- }
- }
+ },
+ });
expect(React.isValidElement(React.createElement('div')))
.toEqual(true);
@@ -562,15 +550,15 @@ describe('comparing jsx vs .createFactory() vs .createElement()', function() {
describe('when using jsx only', function() {
var Parent, instance;
beforeEach(function() {
- Parent = class extends React.Component {
- render() {
+ Parent = React.createClass({
+ render: function() {
return (
children value
);
- }
- };
+ },
+ });
instance = ReactTestUtils.renderIntoDocument();
});
@@ -592,13 +580,11 @@ describe('comparing jsx vs .createFactory() vs .createElement()', function() {
var factory, instance;
beforeEach(function() {
var childFactory = React.createFactory(Child);
-
- class Parent extends React.Component {
- render() {
+ var Parent = React.createClass({
+ render: function() {
return React.DOM.div({}, childFactory({ ref: 'child', foo: 'foo value' }, 'children value'));
- }
- }
-
+ },
+ });
factory = React.createFactory(Parent);
instance = ReactTestUtils.renderIntoDocument(factory());
});
@@ -620,12 +606,11 @@ describe('comparing jsx vs .createFactory() vs .createElement()', function() {
describe('when using parent that uses .createElement()', function() {
var factory, instance;
beforeEach(function() {
- class Parent extends React.Component {
- render() {
+ var Parent = React.createClass({
+ render: function() {
return React.DOM.div({}, React.createElement(Child, { ref: 'child', foo: 'foo value' }, 'children value'));
- }
- }
-
+ },
+ });
factory = React.createFactory(Parent);
instance = ReactTestUtils.renderIntoDocument(factory());
});
diff --git a/src/isomorphic/classic/element/__tests__/ReactElementClone-test.js b/src/isomorphic/classic/element/__tests__/ReactElementClone-test.js
index 8d79b6d8ea0ad..df62052aeedda 100644
--- a/src/isomorphic/classic/element/__tests__/ReactElementClone-test.js
+++ b/src/isomorphic/classic/element/__tests__/ReactElementClone-test.js
@@ -25,57 +25,52 @@ describe('ReactElementClone', function() {
// NOTE: We're explicitly not using JSX here. This is intended to test
// classic JS without JSX.
- ComponentClass = class extends React.Component {
- render() {
+ ComponentClass = React.createClass({
+ render: function() {
return React.createElement('div');
- }
- };
+ },
+ });
});
it('should clone a DOM component with new props', function() {
- class Grandparent extends React.Component {
- render() {
+ var Grandparent = React.createClass({
+ render: function() {
return } />;
- }
- }
-
- class Parent extends React.Component {
- render() {
+ },
+ });
+ var Parent = React.createClass({
+ render: function() {
return (
{React.cloneElement(this.props.child, { className: 'xyz' })}
);
- }
- }
-
+ },
+ });
var component = ReactTestUtils.renderIntoDocument();
expect(ReactDOM.findDOMNode(component).childNodes[0].className).toBe('xyz');
});
it('should clone a composite component with new props', function() {
- class Child extends React.Component {
- render() {
+ var Child = React.createClass({
+ render: function() {
return ;
- }
- }
-
- class Grandparent extends React.Component {
- render() {
+ },
+ });
+ var Grandparent = React.createClass({
+ render: function() {
return } />;
- }
- }
-
- class Parent extends React.Component {
- render() {
+ },
+ });
+ var Parent = React.createClass({
+ render: function() {
return (
{React.cloneElement(this.props.child, { className: 'xyz' })}
);
- }
- }
-
+ },
+ });
var component = ReactTestUtils.renderIntoDocument();
expect(ReactDOM.findDOMNode(component).childNodes[0].className).toBe('xyz');
});
@@ -98,44 +93,43 @@ describe('ReactElementClone', function() {
});
it('should keep the original ref if it is not overridden', function() {
- class Grandparent extends React.Component {
- render() {
+ var Grandparent = React.createClass({
+ render: function() {
return } />;
- }
- }
+ },
+ });
- class Parent extends React.Component {
- render() {
+ var Parent = React.createClass({
+ render: function() {
return (
{React.cloneElement(this.props.child, { className: 'xyz' })}
);
- }
- }
+ },
+ });
var component = ReactTestUtils.renderIntoDocument();
expect(component.refs.yolo.tagName).toBe('DIV');
});
it('should transfer the key property', function() {
- class Component extends React.Component {
- render() {
+ var Component = React.createClass({
+ render: function() {
return null;
- }
- }
-
+ },
+ });
var clone = React.cloneElement(, {key: 'xyz'});
expect(clone.key).toBe('xyz');
});
it('should transfer children', function() {
- class Component extends React.Component {
- render() {
+ var Component = React.createClass({
+ render: function() {
expect(this.props.children).toBe('xyz');
return ;
- }
- }
+ },
+ });
ReactTestUtils.renderIntoDocument(
React.cloneElement(, {children: 'xyz'})
@@ -143,12 +137,12 @@ describe('ReactElementClone', function() {
});
it('should shallow clone children', function() {
- class Component extends React.Component {
- render() {
+ var Component = React.createClass({
+ render: function() {
expect(this.props.children).toBe('xyz');
return ;
- }
- }
+ },
+ });
ReactTestUtils.renderIntoDocument(
React.cloneElement(xyz, {})
@@ -156,11 +150,11 @@ describe('ReactElementClone', function() {
});
it('should accept children as rest arguments', function() {
- class Component extends React.Component {
- render() {
+ var Component = React.createClass({
+ render: function() {
return null;
- }
- }
+ },
+ });
var clone = React.cloneElement(
xyz,
@@ -188,39 +182,39 @@ describe('ReactElementClone', function() {
});
it('should support keys and refs', function() {
- class Parent extends React.Component {
- render() {
+ var Parent = React.createClass({
+ render: function() {
var clone =
React.cloneElement(this.props.children, {key: 'xyz', ref: 'xyz'});
expect(clone.key).toBe('xyz');
expect(clone.ref).toBe('xyz');
return {clone}
;
- }
- }
+ },
+ });
- class Grandparent extends React.Component {
- render() {
+ var Grandparent = React.createClass({
+ render: function() {
return ;
- }
- }
+ },
+ });
var component = ReactTestUtils.renderIntoDocument();
expect(component.refs.parent.refs.xyz.tagName).toBe('SPAN');
});
it('should steal the ref if a new ref is specified', function() {
- class Parent extends React.Component {
- render() {
+ var Parent = React.createClass({
+ render: function() {
var clone = React.cloneElement(this.props.children, {ref: 'xyz'});
return {clone}
;
- }
- }
+ },
+ });
- class Grandparent extends React.Component {
- render() {
+ var Grandparent = React.createClass({
+ render: function() {
return ;
- }
- }
+ },
+ });
var component = ReactTestUtils.renderIntoDocument();
expect(component.refs.child).toBeUndefined();
@@ -228,12 +222,12 @@ describe('ReactElementClone', function() {
});
it('should overwrite props', function() {
- class Component extends React.Component {
- render() {
+ var Component = React.createClass({
+ render: function() {
expect(this.props.myprop).toBe('xyz');
return ;
- }
- }
+ },
+ });
ReactTestUtils.renderIntoDocument(
React.cloneElement(, {myprop: 'xyz'})
@@ -241,13 +235,14 @@ describe('ReactElementClone', function() {
});
it('should normalize props with default values', function() {
- class Component extends React.Component {
- static defaultProps = {prop: 'testKey'};
-
- render() {
+ var Component = React.createClass({
+ getDefaultProps: function() {
+ return {prop: 'testKey'};
+ },
+ render: function() {
return ;
- }
- }
+ },
+ });
var instance = React.createElement(Component);
var clonedInstance = React.cloneElement(instance, {prop: undefined});
@@ -299,32 +294,27 @@ describe('ReactElementClone', function() {
it('should check declared prop types after clone', function() {
spyOn(console, 'error');
-
- class Component extends React.Component {
- static propTypes = {
+ var Component = React.createClass({
+ propTypes: {
color: React.PropTypes.string.isRequired,
- };
-
- render() {
+ },
+ render: function() {
return React.createElement('div', null, 'My color is ' + this.color);
- }
- }
-
- class Parent extends React.Component {
- render() {
+ },
+ });
+ var Parent = React.createClass({
+ render: function() {
return React.cloneElement(this.props.child, {color: 123});
- }
- }
-
- class GrandParent extends React.Component {
- render() {
+ },
+ });
+ var GrandParent = React.createClass({
+ render: function() {
return React.createElement(
Parent,
{ child: React.createElement(Component, {color: 'red'}) }
);
- }
- }
-
+ },
+ });
ReactTestUtils.renderIntoDocument(React.createElement(GrandParent));
expect(console.error.calls.count()).toBe(1);
expect(console.error.calls.argsFor(0)[0]).toBe(
diff --git a/src/isomorphic/classic/element/__tests__/ReactElementValidator-test.js b/src/isomorphic/classic/element/__tests__/ReactElementValidator-test.js
index 4b2cf01f9ca04..fe7acf3e60930 100644
--- a/src/isomorphic/classic/element/__tests__/ReactElementValidator-test.js
+++ b/src/isomorphic/classic/element/__tests__/ReactElementValidator-test.js
@@ -31,11 +31,11 @@ describe('ReactElementValidator', function() {
React = require('React');
ReactDOM = require('ReactDOM');
ReactTestUtils = require('ReactTestUtils');
- ComponentClass = class extends React.Component {
- render() {
+ ComponentClass = React.createClass({
+ render: function() {
return React.createElement('div');
- }
- };
+ },
+ });
});
it('warns for keys for arrays of elements in rest args', function() {
@@ -54,23 +54,21 @@ describe('ReactElementValidator', function() {
spyOn(console, 'error');
var Component = React.createFactory(ComponentClass);
- class InnerClass extends React.Component {
- static displayName = 'InnerClass';
-
- render() {
+ var InnerClass = React.createClass({
+ displayName: 'InnerClass',
+ render: function() {
return Component(null, this.props.childSet);
- }
- }
+ },
+ });
var InnerComponent = React.createFactory(InnerClass);
- class ComponentWrapper extends React.Component {
- static displayName = 'ComponentWrapper';
-
- render() {
+ var ComponentWrapper = React.createClass({
+ displayName: 'ComponentWrapper',
+ render: function() {
return InnerComponent({childSet: [Component(), Component()] });
- }
- }
+ },
+ });
ReactTestUtils.renderIntoDocument(
React.createElement(ComponentWrapper)
@@ -87,13 +85,12 @@ describe('ReactElementValidator', function() {
it('warns for keys for arrays with no owner or parent info', function() {
spyOn(console, 'error');
- class Anonymous extends React.Component {
- static displayName = undefined;
-
- render() {
+ var Anonymous = React.createClass({
+ displayName: undefined,
+ render: function() {
return ;
- }
- }
+ },
+ });
var divs = [
,
@@ -104,8 +101,7 @@ describe('ReactElementValidator', function() {
expect(console.error.calls.count()).toBe(1);
expect(normalizeCodeLocInfo(console.error.calls.argsFor(0)[0])).toBe(
'Warning: Each child in an array or iterator should have a unique ' +
- '"key" prop. Check the top-level render call using . ' +
- 'See https://fb.me/react-warning-keys for more information.\n' +
+ '"key" prop. See https://fb.me/react-warning-keys for more information.\n' +
' in div (at **)'
);
});
@@ -131,23 +127,23 @@ describe('ReactElementValidator', function() {
it('warns for keys with component stack info', function() {
spyOn(console, 'error');
- class Component extends React.Component {
- render() {
+ var Component = React.createClass({
+ render: function() {
return ;
- }
- }
+ },
+ });
- class Parent extends React.Component {
- render() {
+ var Parent = React.createClass({
+ render: function() {
return React.cloneElement(this.props.child);
- }
- }
+ },
+ });
- class GrandParent extends React.Component {
- render() {
+ var GrandParent = React.createClass({
+ render: function() {
return } />;
- }
- }
+ },
+ });
ReactTestUtils.renderIntoDocument();
@@ -166,16 +162,16 @@ describe('ReactElementValidator', function() {
it('does not warn for keys when passing children down', function() {
spyOn(console, 'error');
- class Wrapper extends React.Component {
- render() {
+ var Wrapper = React.createClass({
+ render: function() {
return (
{this.props.children}
);
- }
- }
+ },
+ });
ReactTestUtils.renderIntoDocument(
@@ -270,23 +266,19 @@ describe('ReactElementValidator', function() {
// component, we give a small hint as to which parent instantiated that
// component as per warnings about key usage in ReactElementValidator.
spyOn(console, 'error');
-
- class MyComp extends React.Component {
- static propTypes = {
+ var MyComp = React.createClass({
+ propTypes: {
color: React.PropTypes.string,
- };
-
- render() {
+ },
+ render: function() {
return React.createElement('div', null, 'My color is ' + this.color);
- }
- }
-
- class ParentComp extends React.Component {
- render() {
+ },
+ });
+ var ParentComp = React.createClass({
+ render: function() {
return React.createElement(MyComp, {color: 123});
- }
- }
-
+ },
+ });
ReactTestUtils.renderIntoDocument(React.createElement(ParentComp));
expect(console.error.calls.argsFor(0)[0]).toBe(
'Warning: Failed prop type: ' +
@@ -330,13 +322,11 @@ describe('ReactElementValidator', function() {
it('includes the owner name when passing null, undefined, boolean, or number', function() {
spyOn(console, 'error');
-
- class ParentComp extends React.Component {
- render() {
+ var ParentComp = React.createClass({
+ render: function() {
return React.createElement(null);
- }
- }
-
+ },
+ });
expect(function() {
ReactTestUtils.renderIntoDocument(React.createElement(ParentComp));
}).toThrowError(
@@ -356,14 +346,15 @@ describe('ReactElementValidator', function() {
it('should check default prop values', function() {
spyOn(console, 'error');
- class Component extends React.Component {
- static propTypes = {prop: React.PropTypes.string.isRequired};
- static defaultProps = {prop: null};
-
- render() {
+ var Component = React.createClass({
+ propTypes: {prop: React.PropTypes.string.isRequired},
+ getDefaultProps: function() {
+ return {prop: null};
+ },
+ render: function() {
return React.createElement('span', null, this.props.prop);
- }
- }
+ },
+ });
ReactTestUtils.renderIntoDocument(React.createElement(Component));
@@ -378,14 +369,15 @@ describe('ReactElementValidator', function() {
it('should not check the default for explicit null', function() {
spyOn(console, 'error');
- class Component extends React.Component {
- static propTypes = {prop: React.PropTypes.string.isRequired};
- static defaultProps = {prop: 'text'};
-
- render() {
+ var Component = React.createClass({
+ propTypes: {prop: React.PropTypes.string.isRequired},
+ getDefaultProps: function() {
+ return {prop: 'text'};
+ },
+ render: function() {
return React.createElement('span', null, this.props.prop);
- }
- }
+ },
+ });
ReactTestUtils.renderIntoDocument(
React.createElement(Component, {prop:null})
@@ -402,15 +394,14 @@ describe('ReactElementValidator', function() {
it('should check declared prop types', function() {
spyOn(console, 'error');
- class Component extends React.Component {
- static propTypes = {
+ var Component = React.createClass({
+ propTypes: {
prop: React.PropTypes.string.isRequired,
- };
-
- render() {
+ },
+ render: function() {
return React.createElement('span', null, this.props.prop);
- }
- }
+ },
+ });
ReactTestUtils.renderIntoDocument(
React.createElement(Component)
@@ -444,15 +435,14 @@ describe('ReactElementValidator', function() {
it('should warn if a PropType creator is used as a PropType', function() {
spyOn(console, 'error');
- class Component extends React.Component {
- static propTypes = {
+ var Component = React.createClass({
+ propTypes: {
myProp: React.PropTypes.shape,
- };
-
- render() {
+ },
+ render: function() {
return React.createElement('span', null, this.props.myProp.value);
- }
- }
+ },
+ });
ReactTestUtils.renderIntoDocument(
React.createElement(Component, {myProp: {value: 'hi'}})
@@ -470,13 +460,11 @@ describe('ReactElementValidator', function() {
it('should warn when accessing .type on an element factory', function() {
spyOn(console, 'error');
-
- class TestComponent extends React.Component {
- render() {
+ var TestComponent = React.createClass({
+ render: function() {
return ;
- }
- }
-
+ },
+ });
var TestFactory = React.createFactory(TestComponent);
expect(TestFactory.type).toBe(TestComponent);
expect(console.error.calls.count()).toBe(1);
@@ -491,16 +479,14 @@ describe('ReactElementValidator', function() {
it('does not warn when using DOM node as children', function() {
spyOn(console, 'error');
-
- class DOMContainer extends React.Component {
- render() {
+ var DOMContainer = React.createClass({
+ render: function() {
return ;
- }
-
- componentDidMount() {
+ },
+ componentDidMount: function() {
ReactDOM.findDOMNode(this).appendChild(this.props.children);
- }
- }
+ },
+ });
var node = document.createElement('div');
// This shouldn't cause a stack overflow or any other problems (#3883)