;\n- },\n- });\n-\n- var ComponentInFooBarContext = React.createClass({\n- childContextTypes: {\n- foo: React.PropTypes.string,\n- bar: React.PropTypes.number,\n- },\n+ }\n+ }\n+ Component.contextTypes = {\n+ foo: React.PropTypes.string,\n+ };\n \n- getChildContext: function() {\n+ class ComponentInFooBarContext extends React.Component {\n+ getChildContext() {\n return {\n foo: 'abc',\n bar: 123,\n };\n- },\n+ }\n \n- render: function() {\n+ render() {\n return ;\n- },\n- });\n+ }\n+ }\n+ ComponentInFooBarContext.childContextTypes = {\n+ foo: React.PropTypes.string,\n+ bar: React.PropTypes.number,\n+ };\n \n var instance = ReactTestUtils.renderIntoDocument(\n ,\n@@ -77,47 +75,45 @@ describe('ReactContextValidator', () => {\n var actualShouldComponentUpdate;\n var actualComponentWillUpdate;\n \n- var Parent = React.createClass({\n- childContextTypes: {\n- foo: React.PropTypes.string.isRequired,\n- bar: React.PropTypes.string.isRequired,\n- },\n-\n- getChildContext: function() {\n+ class Parent extends React.Component {\n+ getChildContext() {\n return {\n foo: this.props.foo,\n bar: 'bar',\n };\n- },\n+ }\n \n- render: function() {\n+ render() {\n return ;\n- },\n- });\n-\n- var Component = React.createClass({\n- contextTypes: {\n- foo: React.PropTypes.string,\n- },\n+ }\n+ }\n+ Parent.childContextTypes = {\n+ foo: React.PropTypes.string.isRequired,\n+ bar: React.PropTypes.string.isRequired,\n+ };\n \n- componentWillReceiveProps: function(nextProps, nextContext) {\n+ class Component extends React.Component {\n+ componentWillReceiveProps(nextProps, nextContext) {\n actualComponentWillReceiveProps = nextContext;\n return true;\n- },\n+ }\n \n- shouldComponentUpdate: function(nextProps, nextState, nextContext) {\n+ shouldComponentUpdate(nextProps, nextState, nextContext) {\n actualShouldComponentUpdate = nextContext;\n return true;\n- },\n+ }\n \n- componentWillUpdate: function(nextProps, nextState, nextContext) {\n+ componentWillUpdate(nextProps, nextState, nextContext) {\n actualComponentWillUpdate = nextContext;\n- },\n+ }\n \n- render: function() {\n+ render() {\n return

;\n- },\n- });\n+ }\n+ }\n+ Component.contextTypes = {\n+ foo: React.PropTypes.string,\n+ };\n \n var container = document.createElement('div');\n ReactDOM.render(, container);\n@@ -130,37 +126,36 @@ describe('ReactContextValidator', () => {\n it('should pass previous context to lifecycles', () => {\n var actualComponentDidUpdate;\n \n- var Parent = React.createClass({\n- childContextTypes: {\n- foo: React.PropTypes.string.isRequired,\n- bar: React.PropTypes.string.isRequired,\n- },\n-\n- getChildContext: function() {\n+ class Parent extends React.Component {\n+ getChildContext() {\n return {\n foo: this.props.foo,\n bar: 'bar',\n };\n- },\n+ }\n \n- render: function() {\n+ render() {\n return ;\n- },\n- });\n-\n- var Component = React.createClass({\n- contextTypes: {\n- foo: React.PropTypes.string,\n- },\n+ }\n+ }\n+ Parent.childContextTypes = {\n+ foo: React.PropTypes.string.isRequired,\n+ bar: React.PropTypes.string.isRequired,\n+ };\n \n- componentDidUpdate: function(prevProps, prevState, prevContext) {\n+ class Component extends React.Component {\n+ componentDidUpdate(prevProps, prevState, prevContext) {\n actualComponentDidUpdate = prevContext;\n- },\n+ }\n \n- render: function() {\n+ render() {\n return

;\n- },\n- });\n+ }\n+ }\n+ Component.contextTypes = {\n+ foo: React.PropTypes.string,\n+ };\n+\n \n var container = document.createElement('div');\n ReactDOM.render(, container);\n@@ -171,15 +166,14 @@ describe('ReactContextValidator', () => {\n it('should check context types', () => {\n spyOn(console, 'error');\n \n- var Component = React.createClass({\n- contextTypes: {\n- foo: React.PropTypes.string.isRequired,\n- },\n-\n- render: function() {\n+ class Component extends React.Component {\n+ render() {\n return

;\n- },\n- });\n+ }\n+ }\n+ Component.contextTypes = {\n+ foo: React.PropTypes.string.isRequired,\n+ };\n \n ReactTestUtils.renderIntoDocument();\n \n@@ -191,21 +185,20 @@ describe('ReactContextValidator', () => {\n ' in Component (at **)',\n );\n \n- var ComponentInFooStringContext = React.createClass({\n- childContextTypes: {\n- foo: React.PropTypes.string,\n- },\n-\n- getChildContext: function() {\n+ class ComponentInFooStringContext extends React.Component {\n+ getChildContext() {\n return {\n foo: this.props.fooValue,\n };\n- },\n+ }\n \n- render: function() {\n+ render() {\n return ;\n- },\n- });\n+ }\n+ }\n+ ComponentInFooStringContext.childContextTypes = {\n+ foo: React.PropTypes.string,\n+ };\n \n ReactTestUtils.renderIntoDocument(\n ,\n@@ -214,21 +207,20 @@ describe('ReactContextValidator', () => {\n \/\/ Previous call should not error\n expectDev(console.error.calls.count()).toBe(1);\n \n- var ComponentInFooNumberContext = React.createClass({\n- childContextTypes: {\n- foo: React.PropTypes.number,\n- },\n-\n- getChildContext: function() {\n+ class ComponentInFooNumberContext extends React.Component {\n+ getChildContext() {\n return {\n foo: this.props.fooValue,\n };\n- },\n+ }\n \n- render: function() {\n+ render() {\n return ;\n- },\n- });\n+ }\n+ }\n+ ComponentInFooNumberContext.childContextTypes = {\n+ foo: React.PropTypes.number,\n+ };\n \n ReactTestUtils.renderIntoDocument(\n ,\n@@ -247,20 +239,19 @@ describe('ReactContextValidator', () => {\n it('should check child context types', () => {\n spyOn(console, 'error');\n \n- var Component = React.createClass({\n- childContextTypes: {\n- foo: React.PropTypes.string.isRequired,\n- bar: React.PropTypes.number,\n- },\n-\n- getChildContext: function() {\n+ class Component extends React.Component {\n+ getChildContext() {\n return this.props.testContext;\n- },\n+ }\n \n- render: function() {\n+ render() {\n return

;\n- },\n- });\n+ }\n+ }\n+ Component.childContextTypes = {\n+ foo: React.PropTypes.string.isRequired,\n+ bar: React.PropTypes.number,\n+ };\n \n ReactTestUtils.renderIntoDocument();\n expectDev(console.error.calls.count()).toBe(1);\n@@ -362,16 +353,16 @@ describe('ReactContextValidator', () => {\n }\n \n var childContext;\n- var ChildContextConsumer = React.createClass({\n- contextTypes: {\n- bar: React.PropTypes.string.isRequired,\n- foo: React.PropTypes.string.isRequired,\n- },\n- render: function() {\n+ class ChildContextConsumer extends React.Component {\n+ render() {\n childContext = this.context;\n return

;\n- },\n- });\n+ }\n+ }\n+ ChildContextConsumer.contextTypes = {\n+ bar: React.PropTypes.string.isRequired,\n+ foo: React.PropTypes.string.isRequired,\n+ };\n \n ReactTestUtils.renderIntoDocument();\n expect(childContext.bar).toBeUndefined();\ndiff --git a\/src\/isomorphic\/classic\/element\/__tests__\/ReactElement-test.js b\/src\/isomorphic\/classic\/element\/__tests__\/ReactElement-test.js\nindex 27bd222be8..d03f176ba6 100644\n--- a\/src\/isomorphic\/classic\/element\/__tests__\/ReactElement-test.js\n+++ b\/src\/isomorphic\/classic\/element\/__tests__\/ReactElement-test.js\n@@ -34,11 +34,11 @@ describe('ReactElement', () => {\n ReactDOMFeatureFlags = require('ReactDOMFeatureFlags');\n \/\/ NOTE: We're explicitly not using JSX here. This is intended to test\n \/\/ classic JS without JSX.\n- ComponentClass = React.createClass({\n- render: function() {\n+ ComponentClass = class extends React.Component {\n+ render() {\n return React.createElement('div');\n- },\n- });\n+ }\n+ };\n });\n \n afterEach(() => {\n@@ -59,37 +59,7 @@ describe('ReactElement', () => {\n expect(element.props).toEqual({});\n });\n \n- it('should warn when `key` is being accessed on createClass element', () => {\n- spyOn(console, 'error');\n- var container = document.createElement('div');\n- var Child = React.createClass({\n- render: function() {\n- return

{this.props.key} <\/div>;\n- },\n- });\n- var Parent = React.createClass({\n- render: function() {\n- return (\n-

\n- \n- \n- \n- <\/div>\n- );\n- },\n- });\n- expectDev(console.error.calls.count()).toBe(0);\n- ReactDOM.render(, container);\n- expectDev(console.error.calls.count()).toBe(1);\n- expectDev(console.error.calls.argsFor(0)[0]).toContain(\n- 'Child: `key` is not a prop. Trying to access it will result ' +\n- 'in `undefined` being returned. If you need to access the same ' +\n- 'value within the child component, you should pass it as a different ' +\n- 'prop. (https:\/\/fb.me\/react-special-props)',\n- );\n- });\n-\n- it('should warn when `key` is being accessed on ES class element', () => {\n+ it('should warn when `key` is being accessed on composite element', () => {\n spyOn(console, 'error');\n var container = document.createElement('div');\n class Child extends React.Component {\n@@ -97,8 +67,8 @@ describe('ReactElement', () => {\n return

{this.props.key} <\/div>;\n }\n }\n- var Parent = React.createClass({\n- render: function() {\n+ class Parent extends React.Component {\n+ render() {\n return (\n

\n \n@@ -106,9 +76,9 @@ describe('ReactElement', () => {\n \n <\/div>\n );\n- },\n- });\n- expectDev(console.error.calls.count()).toBe(0);\n+ }\n+ }\n+ expect(console.error.calls.count()).toBe(0);\n ReactDOM.render(, container);\n expectDev(console.error.calls.count()).toBe(1);\n expectDev(console.error.calls.argsFor(0)[0]).toContain(\n@@ -136,21 +106,21 @@ describe('ReactElement', () => {\n it('should warn when `ref` is being accessed', () => {\n spyOn(console, 'error');\n var container = document.createElement('div');\n- var Child = React.createClass({\n- render: function() {\n+ class Child extends React.Component {\n+ render() {\n return

{this.props.ref} <\/div>;\n- },\n- });\n- var Parent = React.createClass({\n- render: function() {\n+ }\n+ }\n+ class Parent extends React.Component {\n+ render() {\n return (\n

\n \n <\/div>\n );\n- },\n- });\n- expectDev(console.error.calls.count()).toBe(0);\n+ }\n+ }\n+ expect(console.error.calls.count()).toBe(0);\n ReactDOM.render(, container);\n expectDev(console.error.calls.count()).toBe(1);\n expectDev(console.error.calls.argsFor(0)[0]).toContain(\n@@ -257,12 +227,12 @@ describe('ReactElement', () => {\n var Component = React.createFactory(ComponentClass);\n var element;\n \n- var Wrapper = React.createClass({\n- render: function() {\n+ class Wrapper extends React.Component {\n+ render() {\n element = Component();\n return element;\n- },\n- });\n+ }\n+ }\n \n var instance = ReactTestUtils.renderIntoDocument(\n React.createElement(Wrapper),\n@@ -324,19 +294,12 @@ describe('ReactElement', () => {\n it('allows static methods to be called using the type property', () => {\n spyOn(console, 'error');\n \n- var StaticMethodComponentClass = React.createClass({\n- statics: {\n- someStaticMethod: function() {\n- return 'someReturnValue';\n- },\n- },\n- getInitialState: function() {\n- return {valueToReturn: 'hi'};\n- },\n- render: function() {\n+ class StaticMethodComponentClass extends React.Component {\n+ render() {\n return React.createElement('div');\n- },\n- });\n+ }\n+ }\n+ StaticMethodComponentClass.someStaticMethod = () => 'someReturnValue';\n \n var element = React.createElement(StaticMethodComponentClass);\n expect(element.type.someStaticMethod()).toBe('someReturnValue');\n@@ -346,11 +309,11 @@ describe('ReactElement', () => {\n \/\/ NOTE: We're explicitly not using JSX here. This is intended to test\n \/\/ classic JS without JSX.\n it('identifies valid elements', () => {\n- var Component = React.createClass({\n- render: function() {\n+ class Component extends React.Component {\n+ render() {\n return React.createElement('div');\n- },\n- });\n+ }\n+ }\n \n expect(React.isValidElement(React.createElement('div'))).toEqual(true);\n expect(React.isValidElement(React.createElement(Component))).toEqual(true);\n@@ -367,21 +330,6 @@ describe('ReactElement', () => {\n expect(React.isValidElement(JSON.parse(jsonElement))).toBe(true);\n });\n \n- it('allows the use of PropTypes validators in statics', () => {\n- \/\/ TODO: This test was added to cover a special case where we proxied\n- \/\/ methods. However, we don't do that any more so this test can probably\n- \/\/ be removed. Leaving it in classic as a safety precaution.\n- var Component = React.createClass({\n- render: () => null,\n- statics: {\n- specialType: React.PropTypes.shape({monkey: React.PropTypes.any}),\n- },\n- });\n-\n- expect(typeof Component.specialType).toBe('function');\n- expect(typeof Component.specialType.isRequired).toBe('function');\n- });\n-\n \/\/ NOTE: We're explicitly not using JSX here. This is intended to test\n \/\/ classic JS without JSX.\n it('is indistinguishable from a plain object', () => {\n@@ -393,14 +341,12 @@ describe('ReactElement', () => {\n \/\/ NOTE: We're explicitly not using JSX here. This is intended to test\n \/\/ classic JS without JSX.\n it('should use default prop value when removing a prop', () => {\n- var Component = React.createClass({\n- getDefaultProps: function() {\n- return {fruit: 'persimmon'};\n- },\n- render: function() {\n+ class Component extends React.Component {\n+ render() {\n return React.createElement('span');\n- },\n- });\n+ }\n+ }\n+ Component.defaultProps = {fruit: 'persimmon'};\n \n var container = document.createElement('div');\n var instance = ReactDOM.render(\n@@ -416,14 +362,12 @@ describe('ReactElement', () => {\n \/\/ NOTE: We're explicitly not using JSX here. This is intended to test\n \/\/ classic JS without JSX.\n it('should normalize props with default values', () => {\n- var Component = React.createClass({\n- getDefaultProps: function() {\n- return {prop: 'testKey'};\n- },\n- render: function() {\n+ class Component extends React.Component {\n+ render() {\n return React.createElement('span', null, this.props.prop);\n- },\n- });\n+ }\n+ }\n+ Component.defaultProps = {prop: 'testKey'};\n \n var instance = ReactTestUtils.renderIntoDocument(\n React.createElement(Component),\n@@ -437,8 +381,8 @@ describe('ReactElement', () => {\n });\n \n it('throws when changing a prop (in dev) after element creation', () => {\n- var Outer = React.createClass({\n- render: function() {\n+ class Outer extends React.Component {\n+ render() {\n var el =

;\n \n expect(function() {\n@@ -447,17 +391,16 @@ describe('ReactElement', () => {\n expect(el.props.className).toBe('moo');\n \n return el;\n- },\n- });\n+ }\n+ }\n var outer = ReactTestUtils.renderIntoDocument();\n expect(ReactDOM.findDOMNode(outer).className).toBe('moo');\n });\n \n it('throws when adding a prop (in dev) after element creation', () => {\n var container = document.createElement('div');\n- var Outer = React.createClass({\n- getDefaultProps: () => ({sound: 'meow'}),\n- render: function() {\n+ class Outer extends React.Component {\n+ render() {\n var el =

{this.props.sound}<\/div>;\n \n expect(function() {\n@@ -467,8 +410,9 @@ describe('ReactElement', () => {\n expect(el.props.className).toBe(undefined);\n \n return el;\n- },\n- });\n+ }\n+ }\n+ Outer.defaultProps = {sound: 'meow'};\n var outer = ReactDOM.render(, container);\n expect(ReactDOM.findDOMNode(outer).textContent).toBe('meow');\n expect(ReactDOM.findDOMNode(outer).className).toBe('');\n@@ -476,11 +420,11 @@ describe('ReactElement', () => {\n \n it('does not warn for NaN props', () => {\n spyOn(console, 'error');\n- var Test = React.createClass({\n- render: function() {\n+ class Test extends React.Component {\n+ render() {\n return

;\n- },\n- });\n+ }\n+ }\n var test = ReactTestUtils.renderIntoDocument();\n expect(test.props.value).toBeNaN();\n expectDev(console.error.calls.count()).toBe(0);\n@@ -508,11 +452,11 @@ describe('ReactElement', () => {\n \n React = require('react');\n \n- var Component = React.createClass({\n- render: function() {\n+ class Component extends React.Component {\n+ render() {\n return React.createElement('div');\n- },\n- });\n+ }\n+ }\n \n expect(React.isValidElement(React.createElement('div'))).toEqual(true);\n expect(React.isValidElement(React.createElement(Component))).toEqual(true);\n@@ -544,16 +488,16 @@ describe('comparing jsx vs .createFactory() vs .createElement()', () => {\n describe('when using jsx only', () => {\n var Parent, instance;\n beforeEach(() => {\n- Parent = React.createClass({\n- render: function() {\n+ Parent = class extends React.Component {\n+ render() {\n return (\n

\n children value<\/Child>\n <\/div>\n );\n- },\n- });\n- instance = ReactTestUtils.renderIntoDocument();\n+ }\n+ };\n+ instance = ReactTestUtils.renderIntoDocument();\n });\n \n it('should scry children but cannot', () => {\n@@ -580,14 +524,11 @@ describe('comparing jsx vs .createFactory() vs .createElement()', () => {\n var factory, instance;\n beforeEach(() => {\n var childFactory = React.createFactory(Child);\n- var Parent = React.createClass({\n- render: function() {\n- return React.DOM.div(\n- {},\n- childFactory({ref: 'child', foo: 'foo value'}, 'children value'),\n- );\n- },\n- });\n+ class Parent extends React.Component {\n+ render() {\n+ return React.DOM.div({}, childFactory({ ref: 'child', foo: 'foo value' }, 'children value'));\n+ }\n+ }\n factory = React.createFactory(Parent);\n instance = ReactTestUtils.renderIntoDocument(factory());\n });\n@@ -615,18 +556,11 @@ describe('comparing jsx vs .createFactory() vs .createElement()', () => {\n describe('when using parent that uses .createElement()', () => {\n var factory, instance;\n beforeEach(() => {\n- var Parent = React.createClass({\n- render: function() {\n- return React.DOM.div(\n- {},\n- React.createElement(\n- Child,\n- {ref: 'child', foo: 'foo value'},\n- 'children value',\n- ),\n- );\n- },\n- });\n+ class Parent extends React.Component {\n+ render() {\n+ return React.DOM.div({}, React.createElement(Child, { ref: 'child', foo: 'foo value' }, 'children value'));\n+ }\n+ }\n factory = React.createFactory(Parent);\n instance = ReactTestUtils.renderIntoDocument(factory());\n });\ndiff --git a\/src\/isomorphic\/classic\/element\/__tests__\/ReactElementClone-test.js b\/src\/isomorphic\/classic\/element\/__tests__\/ReactElementClone-test.js\nindex b4eaaa0765..f1baac684c 100644\n--- a\/src\/isomorphic\/classic\/element\/__tests__\/ReactElementClone-test.js\n+++ b\/src\/isomorphic\/classic\/element\/__tests__\/ReactElementClone-test.js\n@@ -25,52 +25,52 @@ describe('ReactElementClone', () => {\n \n \/\/ NOTE: We're explicitly not using JSX here. This is intended to test\n \/\/ classic JS without JSX.\n- ComponentClass = React.createClass({\n- render: function() {\n+ ComponentClass = class extends React.Component {\n+ render() {\n return React.createElement('div');\n- },\n- });\n+ }\n+ };\n });\n \n it('should clone a DOM component with new props', () => {\n- var Grandparent = React.createClass({\n- render: function() {\n+ class Grandparent extends React.Component {\n+ render() {\n return } \/>;\n- },\n- });\n- var Parent = React.createClass({\n- render: function() {\n+ }\n+ }\n+ class Parent extends React.Component {\n+ render() {\n return (\n

;\n- },\n- });\n- var Grandparent = React.createClass({\n- render: function() {\n+ }\n+ }\n+ class Grandparent extends React.Component {\n+ render() {\n return } \/>;\n- },\n- });\n- var Parent = React.createClass({\n- render: function() {\n+ }\n+ }\n+ class Parent extends React.Component {\n+ render() {\n return (\n

\n {React.cloneElement(this.props.child, {className: 'xyz'})}\n <\/div>\n );\n- },\n- });\n+ }\n+ }\n var component = ReactTestUtils.renderIntoDocument();\n expect(ReactDOM.findDOMNode(component).childNodes[0].className).toBe('xyz');\n });\n@@ -81,43 +81,43 @@ describe('ReactElementClone', () => {\n });\n \n it('should keep the original ref if it is not overridden', () => {\n- var Grandparent = React.createClass({\n- render: function() {\n+ class Grandparent extends React.Component {\n+ render() {\n return } \/>;\n- },\n- });\n+ }\n+ }\n \n- var Parent = React.createClass({\n- render: function() {\n+ class Parent extends React.Component {\n+ render() {\n return (\n

\n {React.cloneElement(this.props.child, {className: 'xyz'})}\n <\/div>\n );\n- },\n- });\n+ }\n+ }\n \n var component = ReactTestUtils.renderIntoDocument();\n expect(component.refs.yolo.tagName).toBe('DIV');\n });\n \n it('should transfer the key property', () => {\n- var Component = React.createClass({\n- render: function() {\n+ class Component extends React.Component {\n+ render() {\n return null;\n- },\n- });\n+ }\n+ }\n var clone = React.cloneElement(, {key: 'xyz'});\n expect(clone.key).toBe('xyz');\n });\n \n it('should transfer children', () => {\n- var Component = React.createClass({\n- render: function() {\n+ class Component extends React.Component {\n+ render() {\n expect(this.props.children).toBe('xyz');\n return

;\n- },\n- });\n+ }\n+ }\n \n ReactTestUtils.renderIntoDocument(\n React.cloneElement(, {children: 'xyz'}),\n@@ -125,12 +125,12 @@ describe('ReactElementClone', () => {\n });\n \n it('should shallow clone children', () => {\n- var Component = React.createClass({\n- render: function() {\n+ class Component extends React.Component {\n+ render() {\n expect(this.props.children).toBe('xyz');\n return

;\n- },\n- });\n+ }\n+ }\n \n ReactTestUtils.renderIntoDocument(\n React.cloneElement(xyz<\/Component>, {}),\n@@ -138,11 +138,11 @@ describe('ReactElementClone', () => {\n });\n \n it('should accept children as rest arguments', () => {\n- var Component = React.createClass({\n- render: function() {\n+ class Component extends React.Component {\n+ render() {\n return null;\n- },\n- });\n+ }\n+ }\n \n var clone = React.cloneElement(\n xyz<\/Component>,\n@@ -175,41 +175,39 @@ describe('ReactElementClone', () => {\n });\n \n it('should support keys and refs', () => {\n- var Parent = React.createClass({\n- render: function() {\n- var clone = React.cloneElement(this.props.children, {\n- key: 'xyz',\n- ref: 'xyz',\n- });\n+ class Parent extends React.Component {\n+ render() {\n+ var clone =\n+ React.cloneElement(this.props.children, {key: 'xyz', ref: 'xyz'});\n expect(clone.key).toBe('xyz');\n expect(clone.ref).toBe('xyz');\n return

{clone}<\/div>;\n- },\n- });\n+ }\n+ }\n \n- var Grandparent = React.createClass({\n- render: function() {\n+ class Grandparent extends React.Component {\n+ render() {\n return <\/Parent>;\n- },\n- });\n+ }\n+ }\n \n var component = ReactTestUtils.renderIntoDocument();\n expect(component.refs.parent.refs.xyz.tagName).toBe('SPAN');\n });\n \n it('should steal the ref if a new ref is specified', () => {\n- var Parent = React.createClass({\n- render: function() {\n+ class Parent extends React.Component {\n+ render() {\n var clone = React.cloneElement(this.props.children, {ref: 'xyz'});\n return

{clone}<\/div>;\n- },\n- });\n+ }\n+ }\n \n- var Grandparent = React.createClass({\n- render: function() {\n+ class Grandparent extends React.Component {\n+ render() {\n return <\/Parent>;\n- },\n- });\n+ }\n+ }\n \n var component = ReactTestUtils.renderIntoDocument();\n expect(component.refs.child).toBeUndefined();\n@@ -217,12 +215,12 @@ describe('ReactElementClone', () => {\n });\n \n it('should overwrite props', () => {\n- var Component = React.createClass({\n- render: function() {\n+ class Component extends React.Component {\n+ render() {\n expect(this.props.myprop).toBe('xyz');\n return

;\n- },\n- });\n+ }\n+ }\n \n ReactTestUtils.renderIntoDocument(\n React.cloneElement(, {myprop: 'xyz'}),\n@@ -230,14 +228,12 @@ describe('ReactElementClone', () => {\n });\n \n it('should normalize props with default values', () => {\n- var Component = React.createClass({\n- getDefaultProps: function() {\n- return {prop: 'testKey'};\n- },\n- render: function() {\n+ class Component extends React.Component {\n+ render() {\n return ;\n- },\n- });\n+ }\n+ }\n+ Component.defaultProps = {prop: 'testKey'};\n \n var instance = React.createElement(Component);\n var clonedInstance = React.cloneElement(instance, {prop: undefined});\n@@ -289,26 +285,27 @@ describe('ReactElementClone', () => {\n \n it('should check declared prop types after clone', () => {\n spyOn(console, 'error');\n- var Component = React.createClass({\n- propTypes: {\n- color: React.PropTypes.string.isRequired,\n- },\n- render: function() {\n+ class Component extends React.Component {\n+ render() {\n return React.createElement('div', null, 'My color is ' + this.color);\n- },\n- });\n- var Parent = React.createClass({\n- render: function() {\n+ }\n+ }\n+ Component.propTypes = {\n+ color: React.PropTypes.string.isRequired,\n+ };\n+ class Parent extends React.Component {\n+ render() {\n return React.cloneElement(this.props.child, {color: 123});\n- },\n- });\n- var GrandParent = React.createClass({\n- render: function() {\n- return React.createElement(Parent, {\n- child: React.createElement(Component, {color: 'red'}),\n- });\n- },\n- });\n+ }\n+ }\n+ class GrandParent extends React.Component {\n+ render() {\n+ return React.createElement(\n+ Parent,\n+ { child: React.createElement(Component, {color: 'red'}) }\n+ );\n+ }\n+ }\n ReactTestUtils.renderIntoDocument(React.createElement(GrandParent));\n expectDev(console.error.calls.count()).toBe(1);\n expectDev(console.error.calls.argsFor(0)[0]).toBe(\ndiff --git a\/src\/isomorphic\/classic\/element\/__tests__\/ReactElementValidator-test.js b\/src\/isomorphic\/classic\/element\/__tests__\/ReactElementValidator-test.js\nindex c9dbf7cc8f..8b88e5a44d 100644\n--- a\/src\/isomorphic\/classic\/element\/__tests__\/ReactElementValidator-test.js\n+++ b\/src\/isomorphic\/classic\/element\/__tests__\/ReactElementValidator-test.js\n@@ -31,11 +31,11 @@ describe('ReactElementValidator', () => {\n React = require('react');\n ReactDOM = require('react-dom');\n ReactTestUtils = require('ReactTestUtils');\n- ComponentClass = React.createClass({\n- render: function() {\n+ ComponentClass = class extends React.Component {\n+ render() {\n return React.createElement('div');\n- },\n- });\n+ }\n+ };\n });\n \n it('warns for keys for arrays of elements in rest args', () => {\n@@ -54,21 +54,19 @@ describe('ReactElementValidator', () => {\n spyOn(console, 'error');\n var Component = React.createFactory(ComponentClass);\n \n- var InnerClass = React.createClass({\n- displayName: 'InnerClass',\n- render: function() {\n+ class InnerClass extends React.Component {\n+ render() {\n return Component(null, this.props.childSet);\n- },\n- });\n+ }\n+ }\n \n var InnerComponent = React.createFactory(InnerClass);\n \n- var ComponentWrapper = React.createClass({\n- displayName: 'ComponentWrapper',\n- render: function() {\n- return InnerComponent({childSet: [Component(), Component()]});\n- },\n- });\n+ class ComponentWrapper extends React.Component {\n+ render() {\n+ return InnerComponent({childSet: [Component(), Component()] });\n+ }\n+ }\n \n ReactTestUtils.renderIntoDocument(React.createElement(ComponentWrapper));\n \n@@ -83,12 +81,10 @@ describe('ReactElementValidator', () => {\n it('warns for keys for arrays with no owner or parent info', () => {\n spyOn(console, 'error');\n \n- var Anonymous = React.createClass({\n- displayName: undefined,\n- render: function() {\n- return

;\n- },\n- });\n+ function Anonymous() {\n+ return

;\n+ }\n+ Object.defineProperty(Anonymous, 'name', { value: undefined });\n \n var divs = [

];\n ReactTestUtils.renderIntoDocument({divs}<\/Anonymous>);\n@@ -119,23 +115,17 @@ describe('ReactElementValidator', () => {\n it('warns for keys with component stack info', () => {\n spyOn(console, 'error');\n \n- var Component = React.createClass({\n- render: function() {\n- return

{[

]}<\/div>;\n- },\n- });\n+ function Component() {\n+ return

{[

]}<\/div>;\n+ }\n \n- var Parent = React.createClass({\n- render: function() {\n- return React.cloneElement(this.props.child);\n- },\n- });\n+ function Parent(props) {\n+ return React.cloneElement(props.child);\n+ }\n \n- var GrandParent = React.createClass({\n- render: function() {\n- return } \/>;\n- },\n- });\n+ function GrandParent() {\n+ return } \/>;\n+ }\n \n ReactTestUtils.renderIntoDocument();\n \n@@ -154,16 +144,14 @@ describe('ReactElementValidator', () => {\n it('does not warn for keys when passing children down', () => {\n spyOn(console, 'error');\n \n- var Wrapper = React.createClass({\n- render: function() {\n- return (\n-

\n- {this.props.children}\n-

dillon1000/react

Files changed