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)