diff --git a/src/isomorphic/classic/element/__tests__/ReactElement-test.js b/src/isomorphic/classic/element/__tests__/ReactElement-test.js index 4700c6b406..955902d34c 100644 --- a/src/isomorphic/classic/element/__tests__/ReactElement-test.js +++ b/src/isomorphic/classic/element/__tests__/ReactElement-test.js @@ -170,7 +170,7 @@ describe('ReactElement', function() { expect(element.props).toEqual(expectation); }); - it('extracts null key and ref values when creating an element', function() { + it('extracts null key and ref', function() { var element = React.createFactory(ComponentClass)({ key: null, ref: null, @@ -184,7 +184,7 @@ describe('ReactElement', function() { expect(element.props).toEqual(expectation); }); - it('ignores undefined key and ref when creating an element', function() { + it('ignores undefined key and ref', function() { var props = { foo: '56', key: undefined, @@ -199,7 +199,7 @@ describe('ReactElement', function() { expect(element.props).toEqual(expectation); }); - it('ignores key and ref getters when creating an element', function() { + it('ignores key and ref getters', function() { var props = { foo: '56', }; @@ -222,74 +222,6 @@ describe('ReactElement', function() { expect(element.props).toEqual(expectation); }); - it('ignores key and ref getters when cloning an element', function() { - var element = React.createFactory(ComponentClass)({ - key: '12', - ref: '34', - foo: '56', - }); - var props = { - foo: 'ef', - }; - Object.defineProperty(props, 'key', { - get: function() { - return 'ab'; - }, - }); - Object.defineProperty(props, 'ref', { - get: function() { - return 'cd'; - }, - }); - var clone = React.cloneElement(element, props); - expect(clone.type).toBe(ComponentClass); - expect(clone.key).toBe('12'); - expect(clone.ref).toBe('34'); - var expectation = {foo: 'ef'}; - Object.freeze(expectation); - expect(clone.props).toEqual(expectation); - }); - - it('ignores undefined key and ref values when cloning an element', function() { - var element = React.createFactory(ComponentClass)({ - key: '12', - ref: '34', - foo: '56', - }); - var props = { - key: undefined, - ref: undefined, - foo: 'ef', - }; - var clone = React.cloneElement(element, props); - expect(clone.type).toBe(ComponentClass); - expect(clone.key).toBe('12'); - expect(clone.ref).toBe('34'); - var expectation = {foo: 'ef'}; - Object.freeze(expectation); - expect(clone.props).toEqual(expectation); - }); - - it('extracts null key and ref values when cloning an element', function() { - var element = React.createFactory(ComponentClass)({ - key: '12', - ref: '34', - foo: '56', - }); - var props = { - key: null, - ref: null, - foo: 'ef', - }; - var clone = React.cloneElement(element, props); - expect(clone.type).toBe(ComponentClass); - expect(clone.key).toBe('null'); - expect(clone.ref).toBe(null); - var expectation = {foo: 'ef'}; - Object.freeze(expectation); - expect(clone.props).toEqual(expectation); - }); - it('coerces the key to a string', function() { var element = React.createFactory(ComponentClass)({ key: 12, @@ -349,18 +281,6 @@ describe('ReactElement', function() { expect(console.error.calls.count()).toBe(0); }); - it('overrides children if undefined is provided as an argument', function() { - var element = React.createElement(ComponentClass, { - children: 'text', - }, undefined); - expect(element.props.children).toBe(undefined); - - var element2 = React.cloneElement(React.createElement(ComponentClass, { - children: 'text', - }), {}, undefined); - expect(element2.props.children).toBe(undefined); - }); - it('merges rest arguments onto the children prop in an array', function() { spyOn(console, 'error'); var a = 1; @@ -490,29 +410,6 @@ describe('ReactElement', function() { expect(inst2.props.prop).toBe(null); }); - it('should normalize props with default values in cloning', function() { - var Component = React.createClass({ - getDefaultProps: function() { - return {prop: 'testKey'}; - }, - render: function() { - return ; - }, - }); - - var instance = React.createElement(Component); - var clonedInstance = React.cloneElement(instance, {prop: undefined}); - expect(clonedInstance.props.prop).toBe('testKey'); - var clonedInstance2 = React.cloneElement(instance, {prop: null}); - expect(clonedInstance2.props.prop).toBe(null); - - var instance2 = React.createElement(Component, {prop: 'newTestKey'}); - var cloneInstance3 = React.cloneElement(instance2, {prop: undefined}); - expect(cloneInstance3.props.prop).toBe('testKey'); - var cloneInstance4 = React.cloneElement(instance2, {}); - expect(cloneInstance4.props.prop).toBe('newTestKey'); - }); - it('throws when changing a prop (in dev) after element creation', function() { var Outer = React.createClass({ render: function() { @@ -703,4 +600,5 @@ describe('comparing jsx vs .createFactory() vs .createElement()', function() { expect(Child.mock.calls[0][0]).toEqual({ foo: 'foo value', children: 'children value' }); }); }); + }); diff --git a/src/isomorphic/classic/element/__tests__/ReactElementClone-test.js b/src/isomorphic/classic/element/__tests__/ReactElementClone-test.js index ab57c8cae2..2c05d7e0f1 100644 --- a/src/isomorphic/classic/element/__tests__/ReactElementClone-test.js +++ b/src/isomorphic/classic/element/__tests__/ReactElementClone-test.js @@ -16,11 +16,20 @@ var ReactDOM; var ReactTestUtils; describe('ReactElementClone', function() { + var ComponentClass; beforeEach(function() { React = require('React'); ReactDOM = require('ReactDOM'); ReactTestUtils = require('ReactTestUtils'); + + // NOTE: We're explicitly not using JSX here. This is intended to test + // classic JS without JSX. + ComponentClass = React.createClass({ + render: function() { + return React.createElement('div'); + }, + }); }); it('should clone a DOM component with new props', function() { @@ -155,6 +164,18 @@ describe('ReactElementClone', function() { ]); }); + it('should override children if undefined is provided as an argument', function() { + var element = React.createElement(ComponentClass, { + children: 'text', + }, undefined); + expect(element.props.children).toBe(undefined); + + var element2 = React.cloneElement(React.createElement(ComponentClass, { + children: 'text', + }), {}, undefined); + expect(element2.props.children).toBe(undefined); + }); + it('should support keys and refs', function() { var Parent = React.createClass({ render: function() { @@ -208,6 +229,29 @@ describe('ReactElementClone', function() { ); }); + it('should normalize props with default values', function() { + var Component = React.createClass({ + getDefaultProps: function() { + return {prop: 'testKey'}; + }, + render: function() { + return ; + }, + }); + + var instance = React.createElement(Component); + var clonedInstance = React.cloneElement(instance, {prop: undefined}); + expect(clonedInstance.props.prop).toBe('testKey'); + var clonedInstance2 = React.cloneElement(instance, {prop: null}); + expect(clonedInstance2.props.prop).toBe(null); + + var instance2 = React.createElement(Component, {prop: 'newTestKey'}); + var cloneInstance3 = React.cloneElement(instance2, {prop: undefined}); + expect(cloneInstance3.props.prop).toBe('testKey'); + var cloneInstance4 = React.cloneElement(instance2, {}); + expect(cloneInstance4.props.prop).toBe('newTestKey'); + }); + it('warns for keys for arrays of elements in rest args', function() { spyOn(console, 'error'); @@ -278,4 +322,72 @@ describe('ReactElementClone', function() { ); }); + it('should ignore key and ref getters', function() { + var element = React.createFactory(ComponentClass)({ + key: '12', + ref: '34', + foo: '56', + }); + var props = { + foo: 'ef', + }; + Object.defineProperty(props, 'key', { + get: function() { + return 'ab'; + }, + }); + Object.defineProperty(props, 'ref', { + get: function() { + return 'cd'; + }, + }); + var clone = React.cloneElement(element, props); + expect(clone.type).toBe(ComponentClass); + expect(clone.key).toBe('12'); + expect(clone.ref).toBe('34'); + var expectation = {foo: 'ef'}; + Object.freeze(expectation); + expect(clone.props).toEqual(expectation); + }); + + it('should ignore undefined key and ref', function() { + var element = React.createFactory(ComponentClass)({ + key: '12', + ref: '34', + foo: '56', + }); + var props = { + key: undefined, + ref: undefined, + foo: 'ef', + }; + var clone = React.cloneElement(element, props); + expect(clone.type).toBe(ComponentClass); + expect(clone.key).toBe('12'); + expect(clone.ref).toBe('34'); + var expectation = {foo: 'ef'}; + Object.freeze(expectation); + expect(clone.props).toEqual(expectation); + }); + + it('should extract null key and ref', function() { + var element = React.createFactory(ComponentClass)({ + key: '12', + ref: '34', + foo: '56', + }); + var props = { + key: null, + ref: null, + foo: 'ef', + }; + var clone = React.cloneElement(element, props); + expect(clone.type).toBe(ComponentClass); + expect(clone.key).toBe('null'); + expect(clone.ref).toBe(null); + var expectation = {foo: 'ef'}; + Object.freeze(expectation); + expect(clone.props).toEqual(expectation); + }); + });