Remove React.PropTypes references in favor of prop-types

This commit is contained in:
Brian Vaughn
2017-04-10 22:40:26 -07:00
parent 957fbc92b1
commit 08bd0209a8
34 changed files with 275 additions and 196 deletions
+1
View File
@@ -8,6 +8,7 @@
"dependencies": { "dependencies": {
"classnames": "^2.2.5", "classnames": "^2.2.5",
"query-string": "^4.2.3", "query-string": "^4.2.3",
"prop-types": "^15.5.6",
"react": "^15.4.1", "react": "^15.4.1",
"react-dom": "^15.4.1", "react-dom": "^15.4.1",
"semver": "^5.3.0" "semver": "^5.3.0"
+1
View File
@@ -14,6 +14,7 @@
Learn how to configure a non-root public URL by running `npm run build`. Learn how to configure a non-root public URL by running `npm run build`.
--> -->
<title>React App</title> <title>React App</title>
<script src="https://unpkg.com/prop-types@15.5.6/prop-types.js"></script>
<script src="react-loader.js"></script> <script src="react-loader.js"></script>
</head> </head>
<body> <body>
+2 -1
View File
@@ -1,7 +1,8 @@
const PropTypes = window.PropTypes;
const React = window.React; const React = window.React;
const propTypes = { const propTypes = {
children: React.PropTypes.node.isRequired, children: PropTypes.node.isRequired,
}; };
class Fixture extends React.Component { class Fixture extends React.Component {
+3 -2
View File
@@ -1,8 +1,9 @@
import React from 'react'; import React from 'react';
import PropTypes from 'prop-types';
const propTypes = { const propTypes = {
title: React.PropTypes.node.isRequired, title: PropTypes.node.isRequired,
description: React.PropTypes.node.isRequired, description: PropTypes.node.isRequired,
}; };
class FixtureSet extends React.Component { class FixtureSet extends React.Component {
+5 -4
View File
@@ -1,14 +1,15 @@
import cn from 'classnames'; import cn from 'classnames';
import semver from 'semver'; import semver from 'semver';
import React from 'react'; import React from 'react';
import PropTypes from 'prop-types';
import { parse } from 'query-string'; import { parse } from 'query-string';
import { semverString } from './propTypes' import { semverString } from './propTypes';
const propTypes = { const propTypes = {
children: React.PropTypes.node.isRequired, children: PropTypes.node.isRequired,
title: React.PropTypes.node.isRequired, title: PropTypes.node.isRequired,
resolvedIn: semverString, resolvedIn: semverString,
resolvedBy: React.PropTypes.string resolvedBy: PropTypes.string
}; };
class TestCase extends React.Component { class TestCase extends React.Component {
+2 -1
View File
@@ -1,3 +1,4 @@
import PropTypes from 'prop-types';
import semver from 'semver'; import semver from 'semver';
const React = window.React; const React = window.React;
@@ -5,7 +6,7 @@ const React = window.React;
export function semverString (props, propName, componentName) { export function semverString (props, propName, componentName) {
let version = props[propName]; let version = props[propName];
let error = React.PropTypes.string(...arguments); let error = PropTypes.string(...arguments);
if (!error && version != null && !semver.valid(version)) if (!error && version != null && !semver.valid(version))
error = new Error( error = new Error(
`\`${propName}\` should be a valid "semantic version" matching ` + `\`${propName}\` should be a valid "semantic version" matching ` +
+6
View File
@@ -4239,6 +4239,12 @@ promise@7.1.1, promise@^7.1.1:
dependencies: dependencies:
asap "~2.0.3" asap "~2.0.3"
prop-types@^15.5.6:
version "15.5.6"
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.5.6.tgz#797a915b1714b645ebb7c5d6cc690346205bd2aa"
dependencies:
fbjs "^0.8.9"
proxy-addr@~1.1.2: proxy-addr@~1.1.2:
version "1.1.2" version "1.1.2"
resolved "https://registry.yarnpkg.com/proxy-addr/-/proxy-addr-1.1.2.tgz#b4cc5f22610d9535824c123aef9d3cf73c40ba37" resolved "https://registry.yarnpkg.com/proxy-addr/-/proxy-addr-1.1.2.tgz#b4cc5f22610d9535824c123aef9d3cf73c40ba37"
+1
View File
@@ -73,6 +73,7 @@
"object-assign": "^4.1.1", "object-assign": "^4.1.1",
"platform": "^1.1.0", "platform": "^1.1.0",
"prettier": "^0.22.0", "prettier": "^0.22.0",
"prop-types": "^15.5.6",
"rimraf": "^2.6.1", "rimraf": "^2.6.1",
"rollup": "^0.41.6", "rollup": "^0.41.6",
"rollup-plugin-alias": "^1.2.1", "rollup-plugin-alias": "^1.2.1",
+1 -1
View File
@@ -23,7 +23,7 @@ function compile(content, contentFilename) {
getSourceFile(filename, languageVersion) { getSourceFile(filename, languageVersion) {
var source; var source;
var jestRegex = /jest\.d\.ts/; var jestRegex = /jest\.d\.ts/;
var reactRegex = /(?:React|ReactDOM)(?:\.d)?\.ts$/; var reactRegex = /(?:React|ReactDOM|PropTypes)(?:\.d)?\.ts$/;
// `path.normalize` is used to turn forward slashes in // `path.normalize` is used to turn forward slashes in
// the file path into backslashes on Windows. // the file path into backslashes on Windows.
+6 -3
View File
@@ -68,13 +68,14 @@ const bundles = [
config: { config: {
destDir: 'build/', destDir: 'build/',
globals: { globals: {
'prop-types': 'PropTypes',
react: 'React', react: 'React',
}, },
moduleName: 'ReactDOM', moduleName: 'ReactDOM',
sourceMap: false, sourceMap: false,
}, },
entry: 'src/renderers/dom/ReactDOM.js', entry: 'src/renderers/dom/ReactDOM.js',
externals: [], externals: ['prop-types'],
fbEntry: 'src/fb/ReactDOMFBEntry.js', fbEntry: 'src/fb/ReactDOMFBEntry.js',
hasteName: 'ReactDOMStack', hasteName: 'ReactDOMStack',
isRenderer: true, isRenderer: true,
@@ -96,13 +97,14 @@ const bundles = [
config: { config: {
destDir: 'build/', destDir: 'build/',
globals: { globals: {
'prop-types': 'PropTypes',
react: 'React', react: 'React',
}, },
moduleName: 'ReactDOM', moduleName: 'ReactDOM',
sourceMap: false, sourceMap: false,
}, },
entry: 'src/renderers/dom/fiber/ReactDOMFiber.js', entry: 'src/renderers/dom/fiber/ReactDOMFiber.js',
externals: [], externals: ['prop-types'],
fbEntry: 'src/fb/ReactDOMFiberFBEntry.js', fbEntry: 'src/fb/ReactDOMFiberFBEntry.js',
hasteName: 'ReactDOMFiber', hasteName: 'ReactDOMFiber',
isRenderer: true, isRenderer: true,
@@ -127,13 +129,14 @@ const bundles = [
config: { config: {
destDir: 'build/', destDir: 'build/',
globals: { globals: {
'prop-types': 'PropTypes',
react: 'React', react: 'React',
}, },
moduleName: 'ReactDOMServer', moduleName: 'ReactDOMServer',
sourceMap: false, sourceMap: false,
}, },
entry: 'src/renderers/dom/ReactDOMServer.js', entry: 'src/renderers/dom/ReactDOMServer.js',
externals: [], externals: ['prop-types'],
fbEntry: 'src/renderers/dom/ReactDOMServer.js', fbEntry: 'src/renderers/dom/ReactDOMServer.js',
hasteName: 'ReactDOMServerStack', hasteName: 'ReactDOMServerStack',
isRenderer: true, isRenderer: true,
+45 -45
View File
@@ -1,29 +1,29 @@
{ {
"branch": "bundle-fixes", "branch": null,
"bundleSizes": { "bundleSizes": {
"react.development.js (UMD_DEV)": { "react.development.js (UMD_DEV)": {
"size": 116098, "size": 92740,
"gzip": 29520 "gzip": 23440
}, },
"react.production.min.js (UMD_PROD)": { "react.production.min.js (UMD_PROD)": {
"size": 13707, "size": 10409,
"gzip": 5073 "gzip": 4091
}, },
"react-dom.development.js (UMD_DEV)": { "react-dom.development.js (UMD_DEV)": {
"size": 563844, "size": 563910,
"gzip": 130190 "gzip": 130211
}, },
"react-dom.production.min.js (UMD_PROD)": { "react-dom.production.min.js (UMD_PROD)": {
"size": 120191, "size": 120247,
"gzip": 37860 "gzip": 37891
}, },
"react-dom-server.development.js (UMD_DEV)": { "react-dom-server.development.js (UMD_DEV)": {
"size": 476049, "size": 476115,
"gzip": 115267 "gzip": 115286
}, },
"react-dom-server.production.min.js (UMD_PROD)": { "react-dom-server.production.min.js (UMD_PROD)": {
"size": 106489, "size": 106540,
"gzip": 33035 "gzip": 33071
}, },
"react-art.development.js (UMD_DEV)": { "react-art.development.js (UMD_DEV)": {
"size": 339929, "size": 339929,
@@ -34,68 +34,68 @@
"gzip": 28991 "gzip": 28991
}, },
"react.development.js (NODE_DEV)": { "react.development.js (NODE_DEV)": {
"size": 109110, "size": 85810,
"gzip": 27479 "gzip": 21432
}, },
"react.production.min.js (NODE_PROD)": { "react.production.min.js (NODE_PROD)": {
"size": 12598, "size": 9288,
"gzip": 4649 "gzip": 3659
}, },
"React-dev.js (FB_DEV)": { "React-dev.js (FB_DEV)": {
"size": 110875, "size": 87652,
"gzip": 28140 "gzip": 22071
}, },
"React-prod.js (FB_PROD)": { "React-prod.js (FB_PROD)": {
"size": 56406, "size": 37663,
"gzip": 14416 "gzip": 9519
}, },
"ReactDOMStack-dev.js (FB_DEV)": { "ReactDOMStack-dev.js (FB_DEV)": {
"size": 522626, "size": 522667,
"gzip": 124708 "gzip": 124718
}, },
"ReactDOMStack-prod.js (FB_PROD)": { "ReactDOMStack-prod.js (FB_PROD)": {
"size": 352708, "size": 352737,
"gzip": 84660 "gzip": 84668
}, },
"react-dom.development.js (NODE_DEV)": { "react-dom.development.js (NODE_DEV)": {
"size": 542218, "size": 542259,
"gzip": 125162 "gzip": 125174
}, },
"react-dom.production.min.js (NODE_PROD)": { "react-dom.production.min.js (NODE_PROD)": {
"size": 116858, "size": 116884,
"gzip": 36717 "gzip": 36722
}, },
"ReactDOMFiber-dev.js (FB_DEV)": { "ReactDOMFiber-dev.js (FB_DEV)": {
"size": 797268, "size": 797309,
"gzip": 184134 "gzip": 184144
}, },
"ReactDOMFiber-prod.js (FB_PROD)": { "ReactDOMFiber-prod.js (FB_PROD)": {
"size": 407540, "size": 407569,
"gzip": 93567 "gzip": 93574
}, },
"react-dom-server.development.js (NODE_DEV)": { "react-dom-server.development.js (NODE_DEV)": {
"size": 445452, "size": 445493,
"gzip": 107574 "gzip": 107585
}, },
"react-dom-server.production.min.js (NODE_PROD)": { "react-dom-server.production.min.js (NODE_PROD)": {
"size": 101344, "size": 101370,
"gzip": 31273 "gzip": 31284
}, },
"ReactDOMServerStack-dev.js (FB_DEV)": { "ReactDOMServerStack-dev.js (FB_DEV)": {
"size": 444144, "size": 444185,
"gzip": 107423 "gzip": 107436
}, },
"ReactDOMServerStack-prod.js (FB_PROD)": { "ReactDOMServerStack-prod.js (FB_PROD)": {
"size": 333744, "size": 333773,
"gzip": 80424 "gzip": 80431
}, },
"ReactARTStack-dev.js (FB_DEV)": { "ReactARTStack-dev.js (FB_DEV)": {
"size": 141589, "size": 142890,
"gzip": 32280 "gzip": 32689
}, },
"ReactARTStack-prod.js (FB_PROD)": { "ReactARTStack-prod.js (FB_PROD)": {
"size": 99762, "size": 101099,
"gzip": 22576 "gzip": 22973
}, },
"react-art.development.js (NODE_DEV)": { "react-art.development.js (NODE_DEV)": {
"size": 265123, "size": 265123,
@@ -17,6 +17,7 @@
'use strict'; 'use strict';
var PropTypes;
var React; var React;
var ReactDOM; var ReactDOM;
var ReactTestUtils; var ReactTestUtils;
@@ -29,6 +30,7 @@ describe('ReactContextValidator', () => {
beforeEach(() => { beforeEach(() => {
jest.resetModules(); jest.resetModules();
PropTypes = require('prop-types');
React = require('react'); React = require('react');
ReactDOM = require('react-dom'); ReactDOM = require('react-dom');
ReactTestUtils = require('ReactTestUtils'); ReactTestUtils = require('ReactTestUtils');
@@ -44,7 +46,7 @@ describe('ReactContextValidator', () => {
} }
} }
Component.contextTypes = { Component.contextTypes = {
foo: React.PropTypes.string, foo: PropTypes.string,
}; };
class ComponentInFooBarContext extends React.Component { class ComponentInFooBarContext extends React.Component {
@@ -60,8 +62,8 @@ describe('ReactContextValidator', () => {
} }
} }
ComponentInFooBarContext.childContextTypes = { ComponentInFooBarContext.childContextTypes = {
foo: React.PropTypes.string, foo: PropTypes.string,
bar: React.PropTypes.number, bar: PropTypes.number,
}; };
var instance = ReactTestUtils.renderIntoDocument( var instance = ReactTestUtils.renderIntoDocument(
@@ -88,8 +90,8 @@ describe('ReactContextValidator', () => {
} }
} }
Parent.childContextTypes = { Parent.childContextTypes = {
foo: React.PropTypes.string.isRequired, foo: PropTypes.string.isRequired,
bar: React.PropTypes.string.isRequired, bar: PropTypes.string.isRequired,
}; };
class Component extends React.Component { class Component extends React.Component {
@@ -112,7 +114,7 @@ describe('ReactContextValidator', () => {
} }
} }
Component.contextTypes = { Component.contextTypes = {
foo: React.PropTypes.string, foo: PropTypes.string,
}; };
var container = document.createElement('div'); var container = document.createElement('div');
@@ -139,8 +141,8 @@ describe('ReactContextValidator', () => {
} }
} }
Parent.childContextTypes = { Parent.childContextTypes = {
foo: React.PropTypes.string.isRequired, foo: PropTypes.string.isRequired,
bar: React.PropTypes.string.isRequired, bar: PropTypes.string.isRequired,
}; };
class Component extends React.Component { class Component extends React.Component {
@@ -153,7 +155,7 @@ describe('ReactContextValidator', () => {
} }
} }
Component.contextTypes = { Component.contextTypes = {
foo: React.PropTypes.string, foo: PropTypes.string,
}; };
var container = document.createElement('div'); var container = document.createElement('div');
@@ -171,7 +173,7 @@ describe('ReactContextValidator', () => {
} }
} }
Component.contextTypes = { Component.contextTypes = {
foo: React.PropTypes.string.isRequired, foo: PropTypes.string.isRequired,
}; };
ReactTestUtils.renderIntoDocument(<Component />); ReactTestUtils.renderIntoDocument(<Component />);
@@ -196,7 +198,7 @@ describe('ReactContextValidator', () => {
} }
} }
ComponentInFooStringContext.childContextTypes = { ComponentInFooStringContext.childContextTypes = {
foo: React.PropTypes.string, foo: PropTypes.string,
}; };
ReactTestUtils.renderIntoDocument( ReactTestUtils.renderIntoDocument(
@@ -218,7 +220,7 @@ describe('ReactContextValidator', () => {
} }
} }
ComponentInFooNumberContext.childContextTypes = { ComponentInFooNumberContext.childContextTypes = {
foo: React.PropTypes.number, foo: PropTypes.number,
}; };
ReactTestUtils.renderIntoDocument( ReactTestUtils.renderIntoDocument(
@@ -248,8 +250,8 @@ describe('ReactContextValidator', () => {
} }
} }
Component.childContextTypes = { Component.childContextTypes = {
foo: React.PropTypes.string.isRequired, foo: PropTypes.string.isRequired,
bar: React.PropTypes.number, bar: PropTypes.number,
}; };
ReactTestUtils.renderIntoDocument(<Component testContext={{bar: 123}} />); ReactTestUtils.renderIntoDocument(<Component testContext={{bar: 123}} />);
@@ -288,7 +290,7 @@ describe('ReactContextValidator', () => {
class ComponentA extends React.Component { class ComponentA extends React.Component {
static childContextTypes = { static childContextTypes = {
foo: React.PropTypes.string.isRequired, foo: PropTypes.string.isRequired,
}; };
render() { render() {
return <div />; return <div />;
@@ -296,7 +298,7 @@ describe('ReactContextValidator', () => {
} }
class ComponentB extends React.Component { class ComponentB extends React.Component {
static childContextTypes = { static childContextTypes = {
foo: React.PropTypes.string.isRequired, foo: PropTypes.string.isRequired,
}; };
render() { render() {
return <div />; return <div />;
@@ -330,7 +332,7 @@ describe('ReactContextValidator', () => {
class ParentContextProvider extends React.Component { class ParentContextProvider extends React.Component {
static childContextTypes = { static childContextTypes = {
foo: React.PropTypes.number, foo: PropTypes.number,
}; };
getChildContext() { getChildContext() {
return { return {
@@ -344,7 +346,7 @@ describe('ReactContextValidator', () => {
class MiddleMissingContext extends React.Component { class MiddleMissingContext extends React.Component {
static childContextTypes = { static childContextTypes = {
bar: React.PropTypes.string.isRequired, bar: PropTypes.string.isRequired,
}; };
render() { render() {
return <ChildContextConsumer />; return <ChildContextConsumer />;
@@ -359,8 +361,8 @@ describe('ReactContextValidator', () => {
} }
} }
ChildContextConsumer.contextTypes = { ChildContextConsumer.contextTypes = {
bar: React.PropTypes.string.isRequired, bar: PropTypes.string.isRequired,
foo: React.PropTypes.string.isRequired, foo: PropTypes.string.isRequired,
}; };
ReactTestUtils.renderIntoDocument(<ParentContextProvider />); ReactTestUtils.renderIntoDocument(<ParentContextProvider />);
@@ -11,6 +11,7 @@
'use strict'; 'use strict';
var PropTypes;
var React; var React;
var ReactDOM; var ReactDOM;
var ReactTestUtils; var ReactTestUtils;
@@ -18,8 +19,9 @@ var createReactClass;
describe('create-react-class-integration', () => { describe('create-react-class-integration', () => {
beforeEach(() => { beforeEach(() => {
React = require('React'); PropTypes = require('prop-types');
ReactDOM = require('ReactDOM'); React = require('react');
ReactDOM = require('react-dom');
ReactTestUtils = require('ReactTestUtils'); ReactTestUtils = require('ReactTestUtils');
var createReactClassFactory = require('create-react-class/factory'); var createReactClassFactory = require('create-react-class/factory');
createReactClass = createReactClassFactory( createReactClass = createReactClassFactory(
@@ -188,13 +190,13 @@ describe('create-react-class-integration', () => {
createReactClass({ createReactClass({
mixins: [{}], mixins: [{}],
propTypes: { propTypes: {
foo: React.PropTypes.string, foo: PropTypes.string,
}, },
contextTypes: { contextTypes: {
foo: React.PropTypes.string, foo: PropTypes.string,
}, },
childContextTypes: { childContextTypes: {
foo: React.PropTypes.string, foo: PropTypes.string,
}, },
render: function() { render: function() {
return <div />; return <div />;
@@ -268,7 +270,7 @@ describe('create-react-class-integration', () => {
it('renders based on context getInitialState', () => { it('renders based on context getInitialState', () => {
var Foo = createReactClass({ var Foo = createReactClass({
contextTypes: { contextTypes: {
className: React.PropTypes.string, className: PropTypes.string,
}, },
getInitialState() { getInitialState() {
return {className: this.context.className}; return {className: this.context.className};
@@ -280,7 +282,7 @@ describe('create-react-class-integration', () => {
var Outer = createReactClass({ var Outer = createReactClass({
childContextTypes: { childContextTypes: {
className: React.PropTypes.string, className: PropTypes.string,
}, },
getChildContext() { getChildContext() {
return {className: 'foo'}; return {className: 'foo'};
@@ -11,6 +11,7 @@
'use strict'; 'use strict';
var PropTypes;
var React; var React;
var ReactDOM; var ReactDOM;
var ReactTestUtils; var ReactTestUtils;
@@ -19,6 +20,7 @@ describe('ReactElementClone', () => {
var ComponentClass; var ComponentClass;
beforeEach(() => { beforeEach(() => {
PropTypes = require('prop-types');
React = require('react'); React = require('react');
ReactDOM = require('react-dom'); ReactDOM = require('react-dom');
ReactTestUtils = require('ReactTestUtils'); ReactTestUtils = require('ReactTestUtils');
@@ -288,13 +290,13 @@ describe('ReactElementClone', () => {
it('should check declared prop types after clone', () => { it('should check declared prop types after clone', () => {
spyOn(console, 'error'); spyOn(console, 'error');
class Component extends React.Component { class Component extends React.Component {
static propTypes = {
color: PropTypes.string.isRequired,
};
render() { render() {
return React.createElement('div', null, 'My color is ' + this.color); return React.createElement('div', null, 'My color is ' + this.color);
} }
} }
Component.propTypes = {
color: React.PropTypes.string.isRequired,
};
class Parent extends React.Component { class Parent extends React.Component {
render() { render() {
return React.cloneElement(this.props.child, {color: 123}); return React.cloneElement(this.props.child, {color: 123});
@@ -14,6 +14,7 @@
// NOTE: We're explicitly not using JSX in this file. This is intended to test // NOTE: We're explicitly not using JSX in this file. This is intended to test
// classic JS without JSX. // classic JS without JSX.
var PropTypes;
var React; var React;
var ReactDOM; var ReactDOM;
var ReactTestUtils; var ReactTestUtils;
@@ -28,6 +29,7 @@ describe('ReactElementValidator', () => {
beforeEach(() => { beforeEach(() => {
jest.resetModules(); jest.resetModules();
PropTypes = require('prop-types');
React = require('react'); React = require('react');
ReactDOM = require('react-dom'); ReactDOM = require('react-dom');
ReactTestUtils = require('ReactTestUtils'); ReactTestUtils = require('ReactTestUtils');
@@ -247,7 +249,7 @@ describe('ReactElementValidator', () => {
return React.createElement('div', null, 'My color is ' + props.color); return React.createElement('div', null, 'My color is ' + props.color);
} }
MyComp.propTypes = { MyComp.propTypes = {
color: React.PropTypes.string, color: PropTypes.string,
}; };
function ParentComp() { function ParentComp() {
return React.createElement(MyComp, {color: 123}); return React.createElement(MyComp, {color: 123});
@@ -332,12 +334,12 @@ describe('ReactElementValidator', () => {
spyOn(console, 'error'); spyOn(console, 'error');
class Component extends React.Component { class Component extends React.Component {
static propTypes = {prop: PropTypes.string.isRequired};
static defaultProps = {prop: null};
render() { render() {
return React.createElement('span', null, this.props.prop); return React.createElement('span', null, this.props.prop);
} }
} }
Component.propTypes = {prop: React.PropTypes.string.isRequired};
Component.defaultProps = {prop: null};
ReactTestUtils.renderIntoDocument(React.createElement(Component)); ReactTestUtils.renderIntoDocument(React.createElement(Component));
@@ -353,12 +355,12 @@ describe('ReactElementValidator', () => {
spyOn(console, 'error'); spyOn(console, 'error');
class Component extends React.Component { class Component extends React.Component {
static propTypes = {prop: PropTypes.string.isRequired};
static defaultProps = {prop: 'text'};
render() { render() {
return React.createElement('span', null, this.props.prop); return React.createElement('span', null, this.props.prop);
} }
} }
Component.propTypes = {prop: React.PropTypes.string.isRequired};
Component.defaultProps = {prop: 'text'};
ReactTestUtils.renderIntoDocument( ReactTestUtils.renderIntoDocument(
React.createElement(Component, {prop: null}), React.createElement(Component, {prop: null}),
@@ -376,13 +378,13 @@ describe('ReactElementValidator', () => {
spyOn(console, 'error'); spyOn(console, 'error');
class Component extends React.Component { class Component extends React.Component {
static propTypes = {
prop: PropTypes.string.isRequired,
};
render() { render() {
return React.createElement('span', null, this.props.prop); return React.createElement('span', null, this.props.prop);
} }
} }
Component.propTypes = {
prop: React.PropTypes.string.isRequired,
};
ReactTestUtils.renderIntoDocument(React.createElement(Component)); ReactTestUtils.renderIntoDocument(React.createElement(Component));
ReactTestUtils.renderIntoDocument( ReactTestUtils.renderIntoDocument(
@@ -416,13 +418,13 @@ describe('ReactElementValidator', () => {
spyOn(console, 'error'); spyOn(console, 'error');
class Component extends React.Component { class Component extends React.Component {
static propTypes = {
myProp: PropTypes.shape,
};
render() { render() {
return React.createElement('span', null, this.props.myProp.value); return React.createElement('span', null, this.props.myProp.value);
} }
} }
Component.propTypes = {
myProp: React.PropTypes.shape,
};
ReactTestUtils.renderIntoDocument( ReactTestUtils.renderIntoDocument(
React.createElement(Component, {myProp: {value: 'hi'}}), React.createElement(Component, {myProp: {value: 'hi'}}),
+19
View File
@@ -0,0 +1,19 @@
/*!
* Copyright 2015-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*/
/**
* TypeScript Definition File for React.
*
* Full type definitions are not yet officially supported. These are mostly
* just helpers for the unit test.
*/
declare module 'prop-types' {
export var string : any;
}
@@ -9,6 +9,7 @@ of patent rights can be found in the PATENTS file in the same directory.
React = null React = null
ReactDOM = null ReactDOM = null
PropTypes = null
describe 'ReactCoffeeScriptClass', -> describe 'ReactCoffeeScriptClass', ->
div = null div = null
@@ -21,6 +22,7 @@ describe 'ReactCoffeeScriptClass', ->
beforeEach -> beforeEach ->
React = require 'react' React = require 'react'
ReactDOM = require 'react-dom' ReactDOM = require 'react-dom'
PropTypes = require 'prop-types'
container = document.createElement 'div' container = document.createElement 'div'
attachedListener = null attachedListener = null
renderedName = null renderedName = null
@@ -102,8 +104,8 @@ describe 'ReactCoffeeScriptClass', ->
it 'renders based on context in the constructor', -> it 'renders based on context in the constructor', ->
class Foo extends React.Component class Foo extends React.Component
@contextTypes: @contextTypes:
tag: React.PropTypes.string tag: PropTypes.string
className: React.PropTypes.string className: PropTypes.string
constructor: (props, context) -> constructor: (props, context) ->
super props, context super props, context
@@ -118,8 +120,8 @@ describe 'ReactCoffeeScriptClass', ->
class Outer extends React.Component class Outer extends React.Component
@childContextTypes: @childContextTypes:
tag: React.PropTypes.string tag: PropTypes.string
className: React.PropTypes.string className: PropTypes.string
getChildContext: -> getChildContext: ->
tag: 'span' tag: 'span'
@@ -393,13 +395,13 @@ describe 'ReactCoffeeScriptClass', ->
it 'supports this.context passed via getChildContext', -> it 'supports this.context passed via getChildContext', ->
class Bar extends React.Component class Bar extends React.Component
@contextTypes: @contextTypes:
bar: React.PropTypes.string bar: PropTypes.string
render: -> render: ->
div className: @context.bar div className: @context.bar
class Foo extends React.Component class Foo extends React.Component
@childContextTypes: @childContextTypes:
bar: React.PropTypes.string bar: PropTypes.string
getChildContext: -> getChildContext: ->
bar: 'bar-through-context' bar: 'bar-through-context'
render: -> render: ->
@@ -11,6 +11,7 @@
'use strict'; 'use strict';
var PropTypes;
var React; var React;
var ReactDOM; var ReactDOM;
@@ -25,6 +26,7 @@ describe('ReactES6Class', () => {
var renderedName = null; var renderedName = null;
beforeEach(() => { beforeEach(() => {
PropTypes = require('prop-types');
React = require('react'); React = require('react');
ReactDOM = require('react-dom'); ReactDOM = require('react-dom');
container = document.createElement('div'); container = document.createElement('div');
@@ -123,8 +125,8 @@ describe('ReactES6Class', () => {
} }
} }
Foo.contextTypes = { Foo.contextTypes = {
tag: React.PropTypes.string, tag: PropTypes.string,
className: React.PropTypes.string, className: PropTypes.string,
}; };
class Outer extends React.Component { class Outer extends React.Component {
@@ -136,8 +138,8 @@ describe('ReactES6Class', () => {
} }
} }
Outer.childContextTypes = { Outer.childContextTypes = {
tag: React.PropTypes.string, tag: PropTypes.string,
className: React.PropTypes.string, className: PropTypes.string,
}; };
test(<Outer />, 'SPAN', 'foo'); test(<Outer />, 'SPAN', 'foo');
}); });
@@ -419,7 +421,7 @@ describe('ReactES6Class', () => {
return <div className={this.context.bar} />; return <div className={this.context.bar} />;
} }
} }
Bar.contextTypes = {bar: React.PropTypes.string}; Bar.contextTypes = {bar: PropTypes.string};
class Foo extends React.Component { class Foo extends React.Component {
getChildContext() { getChildContext() {
return {bar: 'bar-through-context'}; return {bar: 'bar-through-context'};
@@ -428,7 +430,7 @@ describe('ReactES6Class', () => {
return <Bar />; return <Bar />;
} }
} }
Foo.childContextTypes = {bar: React.PropTypes.string}; Foo.childContextTypes = {bar: PropTypes.string};
test(<Foo />, 'DIV', 'bar-through-context'); test(<Foo />, 'DIV', 'bar-through-context');
}); });
@@ -1,3 +1,4 @@
/// <reference path="../PropTypes.d.ts" />
/// <reference path="../React.d.ts" /> /// <reference path="../React.d.ts" />
/// <reference path="../ReactDOM.d.ts" /> /// <reference path="../ReactDOM.d.ts" />
@@ -12,6 +13,7 @@
import React = require('react'); import React = require('react');
import ReactDOM = require('react-dom'); import ReactDOM = require('react-dom');
import PropTypes = require('prop-types');
// Before Each // Before Each
@@ -85,8 +87,8 @@ class StateBasedOnProps extends React.Component {
// it renders based on context in the constructor // it renders based on context in the constructor
class StateBasedOnContext extends React.Component { class StateBasedOnContext extends React.Component {
static contextTypes = { static contextTypes = {
tag: React.PropTypes.string, tag: PropTypes.string,
className: React.PropTypes.string className: PropTypes.string
}; };
state = { state = {
tag: this.context.tag, tag: this.context.tag,
@@ -100,8 +102,8 @@ class StateBasedOnContext extends React.Component {
class ProvideChildContextTypes extends React.Component { class ProvideChildContextTypes extends React.Component {
static childContextTypes = { static childContextTypes = {
tag: React.PropTypes.string, tag: PropTypes.string,
className: React.PropTypes.string className: PropTypes.string
}; };
getChildContext() { getChildContext() {
return { tag: 'span', className: 'foo' }; return { tag: 'span', className: 'foo' };
@@ -278,13 +280,13 @@ class MisspelledComponent2 extends React.Component {
// it supports this.context passed via getChildContext // it supports this.context passed via getChildContext
class ReadContext extends React.Component { class ReadContext extends React.Component {
static contextTypes = { bar: React.PropTypes.string }; static contextTypes = { bar: PropTypes.string };
render() { render() {
return React.createElement('div', { className: this.context.bar }); return React.createElement('div', { className: this.context.bar });
} }
} }
class ProvideContext extends React.Component { class ProvideContext extends React.Component {
static childContextTypes = { bar: React.PropTypes.string }; static childContextTypes = { bar: PropTypes.string };
getChildContext() { getChildContext() {
return { bar: 'bar-through-context' }; return { bar: 'bar-through-context' };
} }
@@ -17,6 +17,7 @@
var React; var React;
var ReactDOM; var ReactDOM;
var ReactTestUtils; var ReactTestUtils;
var PropTypes;
describe('ReactJSXElementValidator', () => { describe('ReactJSXElementValidator', () => {
function normalizeCodeLocInfo(str) { function normalizeCodeLocInfo(str) {
@@ -29,6 +30,7 @@ describe('ReactJSXElementValidator', () => {
beforeEach(() => { beforeEach(() => {
jest.resetModules(); jest.resetModules();
PropTypes = require('prop-types');
React = require('react'); React = require('react');
ReactDOM = require('react-dom'); ReactDOM = require('react-dom');
ReactTestUtils = require('ReactTestUtils'); ReactTestUtils = require('ReactTestUtils');
@@ -45,7 +47,7 @@ describe('ReactJSXElementValidator', () => {
} }
}; };
RequiredPropComponent.displayName = 'RequiredPropComponent'; RequiredPropComponent.displayName = 'RequiredPropComponent';
RequiredPropComponent.propTypes = {prop: React.PropTypes.string.isRequired}; RequiredPropComponent.propTypes = {prop: PropTypes.string.isRequired};
}); });
it('warns for keys for arrays of elements in children position', () => { it('warns for keys for arrays of elements in children position', () => {
@@ -188,7 +190,7 @@ describe('ReactJSXElementValidator', () => {
} }
} }
MyComp.propTypes = { MyComp.propTypes = {
color: React.PropTypes.string, color: PropTypes.string,
}; };
class ParentComp extends React.Component { class ParentComp extends React.Component {
render() { render() {
@@ -211,7 +213,7 @@ describe('ReactJSXElementValidator', () => {
return null; return null;
} }
MyComp.propTypes = { MyComp.propTypes = {
color: React.PropTypes.string, color: PropTypes.string,
}; };
function MiddleComp(props) { function MiddleComp(props) {
return <MyComp color={props.color} />; return <MyComp color={props.color} />;
@@ -14,6 +14,7 @@
var React; var React;
var ReactDOM; var ReactDOM;
var ReactTestUtils; var ReactTestUtils;
var PropTypes;
var clone = function(o) { var clone = function(o) {
return JSON.parse(JSON.stringify(o)); return JSON.parse(JSON.stringify(o));
@@ -91,6 +92,7 @@ describe('ReactComponentLifeCycle', () => {
React = require('react'); React = require('react');
ReactDOM = require('react-dom'); ReactDOM = require('react-dom');
ReactTestUtils = require('ReactTestUtils'); ReactTestUtils = require('ReactTestUtils');
PropTypes = require('prop-types');
}); });
it('should not reuse an instance when it has been unmounted', () => { it('should not reuse an instance when it has been unmounted', () => {
@@ -605,14 +607,14 @@ describe('ReactComponentLifeCycle', () => {
}; };
} }
Parent.childContextTypes = { Parent.childContextTypes = {
x: React.PropTypes.number, x: PropTypes.number,
}; };
function Child(props, context) { function Child(props, context) {
expect(context.x).toBe(2); expect(context.x).toBe(2);
return <div />; return <div />;
} }
Child.contextTypes = { Child.contextTypes = {
x: React.PropTypes.number, x: PropTypes.number,
}; };
const div = document.createElement('div'); const div = document.createElement('div');
@@ -29,10 +29,12 @@ describeStack('ReactComponentTreeHook', () => {
var View; var View;
var Image; var Image;
var Text; var Text;
var PropTypes;
beforeEach(() => { beforeEach(() => {
jest.resetModules(); jest.resetModules();
PropTypes = require('prop-types');
React = require('react'); React = require('react');
ReactNative = require('ReactNative'); ReactNative = require('ReactNative');
ReactInstanceMap = require('ReactInstanceMap'); ReactInstanceMap = require('ReactInstanceMap');
@@ -50,7 +52,7 @@ describeStack('ReactComponentTreeHook', () => {
}); });
Text = class extends React.Component { Text = class extends React.Component {
static childContextTypes = { static childContextTypes = {
isInAParentText: React.PropTypes.bool, isInAParentText: PropTypes.bool,
}; };
getChildContext() { getChildContext() {
@@ -13,6 +13,7 @@
var ReactDOMFeatureFlags = require('ReactDOMFeatureFlags'); var ReactDOMFeatureFlags = require('ReactDOMFeatureFlags');
var PropTypes;
var React; var React;
var ReactDOM; var ReactDOM;
@@ -37,6 +38,7 @@ describe('ReactErrorBoundaries', () => {
var Normal; var Normal;
beforeEach(() => { beforeEach(() => {
PropTypes = require('prop-types');
ReactDOM = require('react-dom'); ReactDOM = require('react-dom');
React = require('react'); React = require('react');
@@ -737,7 +739,7 @@ describe('ReactErrorBoundaries', () => {
it('renders an error state if context provider throws in componentWillMount', () => { it('renders an error state if context provider throws in componentWillMount', () => {
class BrokenComponentWillMountWithContext extends React.Component { class BrokenComponentWillMountWithContext extends React.Component {
static childContextTypes = {foo: React.PropTypes.number}; static childContextTypes = {foo: PropTypes.number};
getChildContext() { getChildContext() {
return {foo: 42}; return {foo: 42};
} }
@@ -774,7 +776,7 @@ describe('ReactErrorBoundaries', () => {
}; };
} }
BrokenComponentWillMountWithContext.childContextTypes = { BrokenComponentWillMountWithContext.childContextTypes = {
foo: React.PropTypes.number, foo: PropTypes.number,
}; };
var container = document.createElement('div'); var container = document.createElement('div');
@@ -11,6 +11,7 @@
'use strict'; 'use strict';
var PropTypes;
var React; var React;
var ReactDOM; var ReactDOM;
var ReactTestUtils; var ReactTestUtils;
@@ -28,6 +29,7 @@ describe('ReactStatelessComponent', () => {
beforeEach(() => { beforeEach(() => {
jest.resetModuleRegistry(); jest.resetModuleRegistry();
PropTypes = require('prop-types');
React = require('react'); React = require('react');
ReactDOM = require('react-dom'); ReactDOM = require('react-dom');
ReactTestUtils = require('ReactTestUtils'); ReactTestUtils = require('ReactTestUtils');
@@ -68,7 +70,7 @@ describe('ReactStatelessComponent', () => {
it('should pass context thru stateless component', () => { it('should pass context thru stateless component', () => {
class Child extends React.Component { class Child extends React.Component {
static contextTypes = { static contextTypes = {
test: React.PropTypes.string.isRequired, test: PropTypes.string.isRequired,
}; };
render() { render() {
@@ -82,7 +84,7 @@ describe('ReactStatelessComponent', () => {
class GrandParent extends React.Component { class GrandParent extends React.Component {
static childContextTypes = { static childContextTypes = {
test: React.PropTypes.string.isRequired, test: PropTypes.string.isRequired,
}; };
getChildContext() { getChildContext() {
@@ -111,7 +113,7 @@ describe('ReactStatelessComponent', () => {
} }
StatelessComponentWithChildContext.childContextTypes = { StatelessComponentWithChildContext.childContextTypes = {
foo: React.PropTypes.string, foo: PropTypes.string,
}; };
var container = document.createElement('div'); var container = document.createElement('div');
@@ -355,7 +357,7 @@ describe('ReactStatelessComponent', () => {
return <div>{props.test}</div>; return <div>{props.test}</div>;
} }
Child.defaultProps = {test: 2}; Child.defaultProps = {test: 2};
Child.propTypes = {test: React.PropTypes.string}; Child.propTypes = {test: PropTypes.string};
spyOn(console, 'error'); spyOn(console, 'error');
ReactTestUtils.renderIntoDocument(<Child />); ReactTestUtils.renderIntoDocument(<Child />);
@@ -372,7 +374,7 @@ describe('ReactStatelessComponent', () => {
it('should receive context', () => { it('should receive context', () => {
class Parent extends React.Component { class Parent extends React.Component {
static childContextTypes = { static childContextTypes = {
lang: React.PropTypes.string, lang: PropTypes.string,
}; };
getChildContext() { getChildContext() {
@@ -387,7 +389,7 @@ describe('ReactStatelessComponent', () => {
function Child(props, context) { function Child(props, context) {
return <div>{context.lang}</div>; return <div>{context.lang}</div>;
} }
Child.contextTypes = {lang: React.PropTypes.string}; Child.contextTypes = {lang: PropTypes.string};
var el = document.createElement('div'); var el = document.createElement('div');
ReactDOM.render(<Parent />, el); ReactDOM.render(<Parent />, el);
@@ -15,6 +15,7 @@ var React = require('react');
var ReactDOM = require('react-dom'); var ReactDOM = require('react-dom');
var ReactDOMFeatureFlags = require('ReactDOMFeatureFlags'); var ReactDOMFeatureFlags = require('ReactDOMFeatureFlags');
var ReactTestUtils = require('ReactTestUtils'); var ReactTestUtils = require('ReactTestUtils');
var PropTypes = require('prop-types');
describe('ReactDOMFiber', () => { describe('ReactDOMFiber', () => {
var container; var container;
@@ -683,7 +684,7 @@ describe('ReactDOMFiber', () => {
class Component extends React.Component { class Component extends React.Component {
static contextTypes = { static contextTypes = {
foo: React.PropTypes.string.isRequired, foo: PropTypes.string.isRequired,
}; };
render() { render() {
@@ -693,7 +694,7 @@ describe('ReactDOMFiber', () => {
class Parent extends React.Component { class Parent extends React.Component {
static childContextTypes = { static childContextTypes = {
foo: React.PropTypes.string.isRequired, foo: PropTypes.string.isRequired,
}; };
getChildContext() { getChildContext() {
@@ -717,8 +718,8 @@ describe('ReactDOMFiber', () => {
class Component extends React.Component { class Component extends React.Component {
static contextTypes = { static contextTypes = {
foo: React.PropTypes.string.isRequired, foo: PropTypes.string.isRequired,
getFoo: React.PropTypes.func.isRequired, getFoo: PropTypes.func.isRequired,
}; };
render() { render() {
@@ -728,8 +729,8 @@ describe('ReactDOMFiber', () => {
class Parent extends React.Component { class Parent extends React.Component {
static childContextTypes = { static childContextTypes = {
foo: React.PropTypes.string.isRequired, foo: PropTypes.string.isRequired,
getFoo: React.PropTypes.func.isRequired, getFoo: PropTypes.func.isRequired,
}; };
state = { state = {
@@ -761,8 +762,8 @@ describe('ReactDOMFiber', () => {
class Component extends React.Component { class Component extends React.Component {
static contextTypes = { static contextTypes = {
foo: React.PropTypes.string.isRequired, foo: PropTypes.string.isRequired,
getFoo: React.PropTypes.func.isRequired, getFoo: PropTypes.func.isRequired,
}; };
render() { render() {
@@ -772,8 +773,8 @@ describe('ReactDOMFiber', () => {
class Parent extends React.Component { class Parent extends React.Component {
static childContextTypes = { static childContextTypes = {
foo: React.PropTypes.string.isRequired, foo: PropTypes.string.isRequired,
getFoo: React.PropTypes.func.isRequired, getFoo: PropTypes.func.isRequired,
}; };
getChildContext() { getChildContext() {
@@ -12,6 +12,7 @@
'use strict'; 'use strict';
let ExecutionEnvironment; let ExecutionEnvironment;
let PropTypes;
let React; let React;
let ReactDOM; let ReactDOM;
let ReactDOMServer; let ReactDOMServer;
@@ -206,6 +207,7 @@ function expectMarkupMismatch(serverElement, clientElement) {
// To get around this, we must reload React modules in between server and client render. // To get around this, we must reload React modules in between server and client render.
function resetModules() { function resetModules() {
jest.resetModuleRegistry(); jest.resetModuleRegistry();
PropTypes = require('prop-types');
React = require('React'); React = require('React');
ReactDOM = require('ReactDOM'); ReactDOM = require('ReactDOM');
ReactDOMServer = require('ReactDOMServer'); ReactDOMServer = require('ReactDOMServer');
@@ -1585,7 +1587,7 @@ describe('ReactDOMServerIntegration', () => {
return this.props.children; return this.props.children;
} }
} }
Parent.childContextTypes = {text: React.PropTypes.string}; Parent.childContextTypes = {text: PropTypes.string};
PurpleContext = props => <Parent text="purple">{props.children}</Parent>; PurpleContext = props => <Parent text="purple">{props.children}</Parent>;
RedContext = props => <Parent text="red">{props.children}</Parent>; RedContext = props => <Parent text="red">{props.children}</Parent>;
@@ -1597,7 +1599,7 @@ describe('ReactDOMServerIntegration', () => {
return <div>{this.context.text}</div>; return <div>{this.context.text}</div>;
} }
} }
ClassChildWithContext.contextTypes = {text: React.PropTypes.string}; ClassChildWithContext.contextTypes = {text: PropTypes.string};
const e = await render( const e = await render(
<PurpleContext><ClassChildWithContext /></PurpleContext>, <PurpleContext><ClassChildWithContext /></PurpleContext>,
@@ -1609,7 +1611,7 @@ describe('ReactDOMServerIntegration', () => {
function StatelessChildWithContext(props, context) { function StatelessChildWithContext(props, context) {
return <div>{context.text}</div>; return <div>{context.text}</div>;
} }
StatelessChildWithContext.contextTypes = {text: React.PropTypes.string}; StatelessChildWithContext.contextTypes = {text: PropTypes.string};
const e = await render( const e = await render(
<PurpleContext><StatelessChildWithContext /></PurpleContext>, <PurpleContext><StatelessChildWithContext /></PurpleContext>,
@@ -1650,7 +1652,7 @@ describe('ReactDOMServerIntegration', () => {
return <div id="classWrongChild">{this.context.text}</div>; return <div id="classWrongChild">{this.context.text}</div>;
} }
} }
ClassChildWithWrongContext.contextTypes = {foo: React.PropTypes.string}; ClassChildWithWrongContext.contextTypes = {foo: PropTypes.string};
const e = await render( const e = await render(
<PurpleContext><ClassChildWithWrongContext /></PurpleContext>, <PurpleContext><ClassChildWithWrongContext /></PurpleContext>,
@@ -1664,7 +1666,7 @@ describe('ReactDOMServerIntegration', () => {
return <div id="statelessWrongChild">{context.text}</div>; return <div id="statelessWrongChild">{context.text}</div>;
} }
StatelessChildWithWrongContext.contextTypes = { StatelessChildWithWrongContext.contextTypes = {
foo: React.PropTypes.string, foo: PropTypes.string,
}; };
const e = await render( const e = await render(
@@ -1677,7 +1679,7 @@ describe('ReactDOMServerIntegration', () => {
function Grandchild(props, context) { function Grandchild(props, context) {
return <div>{context.text}</div>; return <div>{context.text}</div>;
} }
Grandchild.contextTypes = {text: React.PropTypes.string}; Grandchild.contextTypes = {text: PropTypes.string};
const Child = props => <Grandchild />; const Child = props => <Grandchild />;
@@ -1689,7 +1691,7 @@ describe('ReactDOMServerIntegration', () => {
const Grandchild = (props, context) => { const Grandchild = (props, context) => {
return <div>{context.text}</div>; return <div>{context.text}</div>;
}; };
Grandchild.contextTypes = {text: React.PropTypes.string}; Grandchild.contextTypes = {text: PropTypes.string};
const e = await render( const e = await render(
<PurpleContext><RedContext><Grandchild /></RedContext></PurpleContext>, <PurpleContext><RedContext><Grandchild /></RedContext></PurpleContext>,
@@ -1706,7 +1708,7 @@ describe('ReactDOMServerIntegration', () => {
return <Child />; return <Child />;
} }
} }
Parent.childContextTypes = {text1: React.PropTypes.string}; Parent.childContextTypes = {text1: PropTypes.string};
class Child extends React.Component { class Child extends React.Component {
getChildContext() { getChildContext() {
@@ -1716,7 +1718,7 @@ describe('ReactDOMServerIntegration', () => {
return <Grandchild />; return <Grandchild />;
} }
} }
Child.childContextTypes = {text2: React.PropTypes.string}; Child.childContextTypes = {text2: PropTypes.string};
const Grandchild = (props, context) => { const Grandchild = (props, context) => {
return ( return (
@@ -1727,8 +1729,8 @@ describe('ReactDOMServerIntegration', () => {
); );
}; };
Grandchild.contextTypes = { Grandchild.contextTypes = {
text1: React.PropTypes.string, text1: PropTypes.string,
text2: React.PropTypes.string, text2: PropTypes.string,
}; };
const e = await render(<Parent />); const e = await render(<Parent />);
@@ -1750,12 +1752,12 @@ describe('ReactDOMServerIntegration', () => {
return <Child />; return <Child />;
} }
} }
WillMountContext.childContextTypes = {text: React.PropTypes.string}; WillMountContext.childContextTypes = {text: PropTypes.string};
const Child = (props, context) => { const Child = (props, context) => {
return <div>{context.text}</div>; return <div>{context.text}</div>;
}; };
Child.contextTypes = {text: React.PropTypes.string}; Child.contextTypes = {text: PropTypes.string};
const e = await render(<WillMountContext />); const e = await render(<WillMountContext />);
expect(e.textContent).toBe('foo'); expect(e.textContent).toBe('foo');
@@ -1788,7 +1790,7 @@ describe('ReactDOMServerIntegration', () => {
return {value1: 'foo', value2: 'bar'}; return {value1: 'foo', value2: 'bar'};
} }
} }
Component.childContextTypes = {value1: React.PropTypes.string}; Component.childContextTypes = {value1: PropTypes.string};
return render(<Component />); return render(<Component />);
}, },
); );
@@ -12,6 +12,7 @@
'use strict'; 'use strict';
var React = require('react'); var React = require('react');
var PropTypes = require('prop-types');
var ReactDOM = require('react-dom'); var ReactDOM = require('react-dom');
var ReactTestUtils = require('ReactTestUtils'); var ReactTestUtils = require('ReactTestUtils');
var renderSubtreeIntoContainer = require('renderSubtreeIntoContainer'); var renderSubtreeIntoContainer = require('renderSubtreeIntoContainer');
@@ -22,7 +23,7 @@ describe('renderSubtreeIntoContainer', () => {
class Component extends React.Component { class Component extends React.Component {
static contextTypes = { static contextTypes = {
foo: React.PropTypes.string.isRequired, foo: PropTypes.string.isRequired,
}; };
render() { render() {
@@ -32,7 +33,7 @@ describe('renderSubtreeIntoContainer', () => {
class Parent extends React.Component { class Parent extends React.Component {
static childContextTypes = { static childContextTypes = {
foo: React.PropTypes.string.isRequired, foo: PropTypes.string.isRequired,
}; };
getChildContext() { getChildContext() {
@@ -63,7 +64,7 @@ describe('renderSubtreeIntoContainer', () => {
class Component extends React.Component { class Component extends React.Component {
static contextTypes = { static contextTypes = {
foo: React.PropTypes.string.isRequired, foo: PropTypes.string.isRequired,
}; };
render() { render() {
@@ -76,7 +77,7 @@ describe('renderSubtreeIntoContainer', () => {
// eslint-disable-next-line no-unused-vars // eslint-disable-next-line no-unused-vars
class Parent extends React.Component { class Parent extends React.Component {
static childContextTypes = { static childContextTypes = {
foo: React.PropTypes.string.isRequired, foo: PropTypes.string.isRequired,
}; };
getChildContext() { getChildContext() {
@@ -104,8 +105,8 @@ describe('renderSubtreeIntoContainer', () => {
class Component extends React.Component { class Component extends React.Component {
static contextTypes = { static contextTypes = {
foo: React.PropTypes.string.isRequired, foo: PropTypes.string.isRequired,
getFoo: React.PropTypes.func.isRequired, getFoo: PropTypes.func.isRequired,
}; };
render() { render() {
@@ -115,8 +116,8 @@ describe('renderSubtreeIntoContainer', () => {
class Parent extends React.Component { class Parent extends React.Component {
static childContextTypes = { static childContextTypes = {
foo: React.PropTypes.string.isRequired, foo: PropTypes.string.isRequired,
getFoo: React.PropTypes.func.isRequired, getFoo: PropTypes.func.isRequired,
}; };
state = { state = {
@@ -156,8 +157,8 @@ describe('renderSubtreeIntoContainer', () => {
class Component extends React.Component { class Component extends React.Component {
static contextTypes = { static contextTypes = {
foo: React.PropTypes.string.isRequired, foo: PropTypes.string.isRequired,
getFoo: React.PropTypes.func.isRequired, getFoo: PropTypes.func.isRequired,
}; };
render() { render() {
@@ -167,8 +168,8 @@ describe('renderSubtreeIntoContainer', () => {
class Parent extends React.Component { class Parent extends React.Component {
static childContextTypes = { static childContextTypes = {
foo: React.PropTypes.string.isRequired, foo: PropTypes.string.isRequired,
getFoo: React.PropTypes.func.isRequired, getFoo: PropTypes.func.isRequired,
}; };
getChildContext() { getChildContext() {
@@ -229,7 +230,7 @@ describe('renderSubtreeIntoContainer', () => {
return {value: this.props.value}; return {value: this.props.value};
} }
static childContextTypes = { static childContextTypes = {
value: React.PropTypes.string.isRequired, value: PropTypes.string.isRequired,
}; };
} }
@@ -244,7 +245,7 @@ describe('renderSubtreeIntoContainer', () => {
class Child extends React.Component { class Child extends React.Component {
static contextTypes = { static contextTypes = {
value: React.PropTypes.string.isRequired, value: PropTypes.string.isRequired,
}; };
render() { render() {
return <div>{this.context.value}</div>; return <div>{this.context.value}</div>;
@@ -272,7 +273,7 @@ describe('renderSubtreeIntoContainer', () => {
renderSubtreeIntoContainer(this, <Middle />, portal1); renderSubtreeIntoContainer(this, <Middle />, portal1);
} }
static childContextTypes = { static childContextTypes = {
value: React.PropTypes.string.isRequired, value: PropTypes.string.isRequired,
}; };
} }
@@ -287,7 +288,7 @@ describe('renderSubtreeIntoContainer', () => {
class Child extends React.Component { class Child extends React.Component {
static contextTypes = { static contextTypes = {
value: React.PropTypes.string.isRequired, value: PropTypes.string.isRequired,
}; };
render() { render() {
return <div>{this.context.value}</div>; return <div>{this.context.value}</div>;
@@ -11,7 +11,7 @@
'use strict'; 'use strict';
var React = require('react'); var PropTypes = require('prop-types');
var ReactPropTypesSecret = require('ReactPropTypesSecret'); var ReactPropTypesSecret = require('ReactPropTypesSecret');
var warning = require('fbjs/lib/warning'); var warning = require('fbjs/lib/warning');
@@ -57,7 +57,7 @@ var propTypes = {
'set either `onChange` or `readOnly`.', 'set either `onChange` or `readOnly`.',
); );
}, },
onChange: React.PropTypes.func, onChange: PropTypes.func,
}; };
var loggedTypeFailures = {}; var loggedTypeFailures = {};
@@ -11,6 +11,7 @@
'use strict'; 'use strict';
var PropTypes;
var RCTEventEmitter; var RCTEventEmitter;
var React; var React;
var ReactNative; var ReactNative;
@@ -21,6 +22,7 @@ var createReactNativeComponentClass;
beforeEach(() => { beforeEach(() => {
jest.resetModules(); jest.resetModules();
PropTypes = require('prop-types');
RCTEventEmitter = require('RCTEventEmitter'); RCTEventEmitter = require('RCTEventEmitter');
React = require('react'); React = require('react');
ReactNative = require('ReactNative'); ReactNative = require('ReactNative');
@@ -97,7 +99,7 @@ it('handles events on text nodes', () => {
}); });
class ContextHack extends React.Component { class ContextHack extends React.Component {
static childContextTypes = {isInAParentText: React.PropTypes.bool}; static childContextTypes = {isInAParentText: PropTypes.bool};
getChildContext() { getChildContext() {
return {isInAParentText: true}; return {isInAParentText: true};
} }
@@ -14,12 +14,14 @@
var React; var React;
var ReactNoop; var ReactNoop;
var ReactFeatureFlags; var ReactFeatureFlags;
var PropTypes;
describe('ReactIncremental', () => { describe('ReactIncremental', () => {
beforeEach(() => { beforeEach(() => {
jest.resetModules(); jest.resetModules();
React = require('react'); React = require('react');
ReactNoop = require('ReactNoop'); ReactNoop = require('ReactNoop');
PropTypes = require('prop-types');
ReactFeatureFlags = require('ReactFeatureFlags'); ReactFeatureFlags = require('ReactFeatureFlags');
ReactFeatureFlags.disableNewFiberFeatures = false; ReactFeatureFlags.disableNewFiberFeatures = false;
@@ -1592,7 +1594,7 @@ describe('ReactIncremental', () => {
class Intl extends React.Component { class Intl extends React.Component {
static childContextTypes = { static childContextTypes = {
locale: React.PropTypes.string, locale: PropTypes.string,
}; };
getChildContext() { getChildContext() {
return { return {
@@ -1607,7 +1609,7 @@ describe('ReactIncremental', () => {
class Router extends React.Component { class Router extends React.Component {
static childContextTypes = { static childContextTypes = {
route: React.PropTypes.string, route: PropTypes.string,
}; };
getChildContext() { getChildContext() {
return { return {
@@ -1622,7 +1624,7 @@ describe('ReactIncremental', () => {
class ShowLocale extends React.Component { class ShowLocale extends React.Component {
static contextTypes = { static contextTypes = {
locale: React.PropTypes.string, locale: PropTypes.string,
}; };
render() { render() {
ops.push('ShowLocale ' + JSON.stringify(this.context)); ops.push('ShowLocale ' + JSON.stringify(this.context));
@@ -1632,7 +1634,7 @@ describe('ReactIncremental', () => {
class ShowRoute extends React.Component { class ShowRoute extends React.Component {
static contextTypes = { static contextTypes = {
route: React.PropTypes.string, route: PropTypes.string,
}; };
render() { render() {
ops.push('ShowRoute ' + JSON.stringify(this.context)); ops.push('ShowRoute ' + JSON.stringify(this.context));
@@ -1645,8 +1647,8 @@ describe('ReactIncremental', () => {
return `${context.route} in ${context.locale}`; return `${context.route} in ${context.locale}`;
} }
ShowBoth.contextTypes = { ShowBoth.contextTypes = {
locale: React.PropTypes.string, locale: PropTypes.string,
route: React.PropTypes.string, route: PropTypes.string,
}; };
class ShowNeither extends React.Component { class ShowNeither extends React.Component {
@@ -1745,10 +1747,10 @@ describe('ReactIncremental', () => {
var ops = []; var ops = [];
class Recurse extends React.Component { class Recurse extends React.Component {
static contextTypes = { static contextTypes = {
n: React.PropTypes.number, n: PropTypes.number,
}; };
static childContextTypes = { static childContextTypes = {
n: React.PropTypes.number, n: PropTypes.number,
}; };
getChildContext() { getChildContext() {
return {n: (this.context.n || 3) - 1}; return {n: (this.context.n || 3) - 1};
@@ -1777,7 +1779,7 @@ describe('ReactIncremental', () => {
class Intl extends React.Component { class Intl extends React.Component {
static childContextTypes = { static childContextTypes = {
locale: React.PropTypes.string, locale: PropTypes.string,
}; };
getChildContext() { getChildContext() {
return { return {
@@ -1792,7 +1794,7 @@ describe('ReactIncremental', () => {
class ShowLocale extends React.Component { class ShowLocale extends React.Component {
static contextTypes = { static contextTypes = {
locale: React.PropTypes.string, locale: PropTypes.string,
}; };
render() { render() {
ops.push('ShowLocale ' + JSON.stringify(this.context)); ops.push('ShowLocale ' + JSON.stringify(this.context));
@@ -1835,7 +1837,7 @@ describe('ReactIncremental', () => {
class Intl extends React.Component { class Intl extends React.Component {
static childContextTypes = { static childContextTypes = {
locale: React.PropTypes.string, locale: PropTypes.string,
}; };
getChildContext() { getChildContext() {
const childContext = { const childContext = {
@@ -1852,7 +1854,7 @@ describe('ReactIncremental', () => {
class ShowLocaleClass extends React.Component { class ShowLocaleClass extends React.Component {
static contextTypes = { static contextTypes = {
locale: React.PropTypes.string, locale: PropTypes.string,
}; };
render() { render() {
ops.push('ShowLocaleClass:read ' + JSON.stringify(this.context)); ops.push('ShowLocaleClass:read ' + JSON.stringify(this.context));
@@ -1865,7 +1867,7 @@ describe('ReactIncremental', () => {
return context.locale; return context.locale;
} }
ShowLocaleFn.contextTypes = { ShowLocaleFn.contextTypes = {
locale: React.PropTypes.string, locale: PropTypes.string,
}; };
class Stateful extends React.Component { class Stateful extends React.Component {
@@ -1925,7 +1927,7 @@ describe('ReactIncremental', () => {
class Intl extends React.Component { class Intl extends React.Component {
static childContextTypes = { static childContextTypes = {
locale: React.PropTypes.string, locale: PropTypes.string,
}; };
getChildContext() { getChildContext() {
const childContext = { const childContext = {
@@ -1942,7 +1944,7 @@ describe('ReactIncremental', () => {
class ShowLocaleClass extends React.Component { class ShowLocaleClass extends React.Component {
static contextTypes = { static contextTypes = {
locale: React.PropTypes.string, locale: PropTypes.string,
}; };
render() { render() {
ops.push('ShowLocaleClass:read ' + JSON.stringify(this.context)); ops.push('ShowLocaleClass:read ' + JSON.stringify(this.context));
@@ -1955,7 +1957,7 @@ describe('ReactIncremental', () => {
return context.locale; return context.locale;
} }
ShowLocaleFn.contextTypes = { ShowLocaleFn.contextTypes = {
locale: React.PropTypes.string, locale: PropTypes.string,
}; };
function IndirectionFn(props, context) { function IndirectionFn(props, context) {
@@ -11,6 +11,7 @@
'use strict'; 'use strict';
var PropTypes;
var React; var React;
var ReactNoop; var ReactNoop;
var ReactFeatureFlags; var ReactFeatureFlags;
@@ -18,6 +19,7 @@ var ReactFeatureFlags;
describe('ReactIncrementalErrorHandling', () => { describe('ReactIncrementalErrorHandling', () => {
beforeEach(() => { beforeEach(() => {
jest.resetModules(); jest.resetModules();
PropTypes = require('prop-types');
React = require('react'); React = require('react');
ReactNoop = require('ReactNoop'); ReactNoop = require('ReactNoop');
ReactFeatureFlags = require('ReactFeatureFlags'); ReactFeatureFlags = require('ReactFeatureFlags');
@@ -679,8 +681,8 @@ describe('ReactIncrementalErrorHandling', () => {
it('unwinds the context stack correctly on error', () => { it('unwinds the context stack correctly on error', () => {
class Provider extends React.Component { class Provider extends React.Component {
static childContextTypes = {message: React.PropTypes.string}; static childContextTypes = {message: PropTypes.string};
static contextTypes = {message: React.PropTypes.string}; static contextTypes = {message: PropTypes.string};
getChildContext() { getChildContext() {
return { return {
message: (this.context.message || '') + this.props.message, message: (this.context.message || '') + this.props.message,
@@ -696,7 +698,7 @@ describe('ReactIncrementalErrorHandling', () => {
} }
Connector.contextTypes = { Connector.contextTypes = {
message: React.PropTypes.string, message: PropTypes.string,
}; };
function BadRender() { function BadRender() {
@@ -17,6 +17,7 @@ describe('ReactDebugFiberPerf', () => {
let ReactFeatureFlags; let ReactFeatureFlags;
let ReactNoop; let ReactNoop;
let ReactPortal; let ReactPortal;
let PropTypes;
let root; let root;
let activeMeasure; let activeMeasure;
@@ -119,6 +120,7 @@ describe('ReactDebugFiberPerf', () => {
ReactNoop = require('ReactNoop'); ReactNoop = require('ReactNoop');
ReactPortal = require('ReactPortal'); ReactPortal = require('ReactPortal');
ReactFeatureFlags.disableNewFiberFeatures = false; ReactFeatureFlags.disableNewFiberFeatures = false;
PropTypes = require('prop-types');
}); });
afterEach(() => { afterEach(() => {
@@ -245,7 +247,7 @@ describe('ReactDebugFiberPerf', () => {
it('captures all lifecycles', () => { it('captures all lifecycles', () => {
class AllLifecycles extends React.Component { class AllLifecycles extends React.Component {
static childContextTypes = { static childContextTypes = {
foo: React.PropTypes.any, foo: PropTypes.any,
}; };
shouldComponentUpdate() { shouldComponentUpdate() {
return true; return true;
+5 -3
View File
@@ -11,6 +11,7 @@
'use strict'; 'use strict';
var PropTypes;
var React; var React;
var ReactDOM; var ReactDOM;
var ReactDOMServer; var ReactDOMServer;
@@ -18,6 +19,7 @@ var ReactTestUtils;
describe('ReactTestUtils', () => { describe('ReactTestUtils', () => {
beforeEach(() => { beforeEach(() => {
PropTypes = require('prop-types');
React = require('react'); React = require('react');
ReactDOM = require('react-dom'); ReactDOM = require('react-dom');
ReactDOMServer = require('react-dom/server'); ReactDOMServer = require('react-dom/server');
@@ -195,7 +197,7 @@ describe('ReactTestUtils', () => {
it('can shallowly render components with contextTypes', () => { it('can shallowly render components with contextTypes', () => {
class SimpleComponent extends React.Component { class SimpleComponent extends React.Component {
static contextTypes = { static contextTypes = {
name: React.PropTypes.string, name: PropTypes.string,
}; };
render() { render() {
@@ -258,7 +260,7 @@ describe('ReactTestUtils', () => {
it('can pass context when shallowly rendering', () => { it('can pass context when shallowly rendering', () => {
class SimpleComponent extends React.Component { class SimpleComponent extends React.Component {
static contextTypes = { static contextTypes = {
name: React.PropTypes.string, name: PropTypes.string,
}; };
render() { render() {
@@ -278,7 +280,7 @@ describe('ReactTestUtils', () => {
class SimpleComponent extends React.Component { class SimpleComponent extends React.Component {
static contextTypes = { static contextTypes = {
name: React.PropTypes.string.isRequired, name: PropTypes.string.isRequired,
}; };
render() { render() {
+6
View File
@@ -3929,6 +3929,12 @@ promise@^7.1.1:
dependencies: dependencies:
asap "~2.0.3" asap "~2.0.3"
prop-types@^15.5.6:
version "15.5.6"
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.5.6.tgz#797a915b1714b645ebb7c5d6cc690346205bd2aa"
dependencies:
fbjs "^0.8.9"
prr@~0.0.0: prr@~0.0.0:
version "0.0.0" version "0.0.0"
resolved "https://registry.yarnpkg.com/prr/-/prr-0.0.0.tgz#1a84b85908325501411853d0081ee3fa86e2926a" resolved "https://registry.yarnpkg.com/prr/-/prr-0.0.0.tgz#1a84b85908325501411853d0081ee3fa86e2926a"