From 39fee281a922bd415637a14d89ca0a5c042ed325 Mon Sep 17 00:00:00 2001 From: Luna Ruan Date: Mon, 22 Jul 2019 13:10:51 -0700 Subject: [PATCH 1/7] add default props test --- .../__tests__/ReactFunctionComponent-test.js | 25 +++++++++++++++++++ packages/react/src/ReactElement.js | 7 +++++- 2 files changed, 31 insertions(+), 1 deletion(-) diff --git a/packages/react-dom/src/__tests__/ReactFunctionComponent-test.js b/packages/react-dom/src/__tests__/ReactFunctionComponent-test.js index f6359e20190b0..5266c2e6fc51e 100644 --- a/packages/react-dom/src/__tests__/ReactFunctionComponent-test.js +++ b/packages/react-dom/src/__tests__/ReactFunctionComponent-test.js @@ -206,6 +206,31 @@ describe('ReactFunctionComponent', () => { ReactTestUtils.renderIntoDocument(); }); + fit('should warn when given defaultProps', () => { + function FunctionalComponent(props) { + return null; + } + + FunctionalComponent.defaultProps = { + testProp: true, + }; + + class Test extends React.Component { + render() { + return null; + } + } + + Test.defaultProps = { + testProp: true, + }; + + expect(() => ReactTestUtils.renderIntoDocument()).toWarnDev( + 'Warning: defaultProps should only be used on Class Components. ' + + 'For Functional Components, use Javascript default arguments instead.', + ); + }); + it('should warn when given a function ref', () => { function Indirection(props) { return
{props.children}
; diff --git a/packages/react/src/ReactElement.js b/packages/react/src/ReactElement.js index 9416a313b9648..483f80e60aceb 100644 --- a/packages/react/src/ReactElement.js +++ b/packages/react/src/ReactElement.js @@ -301,9 +301,12 @@ export function jsxDEV(type, config, maybeKey, source, self) { * Create and return a new ReactElement of the given type. * See https://reactjs.org/docs/react-api.html#createelement */ +// type: component +// config: props + key + ref export function createElement(type, config, children) { let propName; - + console.log(type, '\n\n', config, '\n\n', children); + console.log('a', type.prototype.isReactComponent()); // Reserved names are extracted const props = {}; @@ -373,6 +376,8 @@ export function createElement(type, config, children) { defineRefPropWarningGetter(props, displayName); } } + // if (type.defaultProps && type.prototype.isReactComponent) { + // } } return ReactElement( type, From d72dbbdc0a7ad9c5ad1b0b4d5d824de56d3d482d Mon Sep 17 00:00:00 2001 From: Luna Ruan Date: Wed, 24 Jul 2019 19:38:39 -0700 Subject: [PATCH 2/7] add code to warn when using default props on function component --- .../__tests__/ReactFunctionComponent-test.js | 28 +++++++++---------- packages/react-reconciler/src/ReactFiber.js | 1 - .../src/ReactFiberBeginWork.js | 21 ++++++++++++++ packages/react/src/ReactElement.js | 4 +-- packages/shared/ReactFeatureFlags.js | 5 ++++ .../forks/ReactFeatureFlags.native-fb.js | 1 + .../shared/forks/ReactFeatureFlags.www.js | 1 + 7 files changed, 44 insertions(+), 17 deletions(-) diff --git a/packages/react-dom/src/__tests__/ReactFunctionComponent-test.js b/packages/react-dom/src/__tests__/ReactFunctionComponent-test.js index 5266c2e6fc51e..a1d12ba384ec4 100644 --- a/packages/react-dom/src/__tests__/ReactFunctionComponent-test.js +++ b/packages/react-dom/src/__tests__/ReactFunctionComponent-test.js @@ -13,6 +13,7 @@ let PropTypes; let React; let ReactDOM; let ReactTestUtils; +let ReactFeatureFlags; function FunctionComponent(props) { return
{props.name}
; @@ -25,6 +26,8 @@ describe('ReactFunctionComponent', () => { React = require('react'); ReactDOM = require('react-dom'); ReactTestUtils = require('react-dom/test-utils'); + ReactFeatureFlags = require('shared/ReactFeatureFlags'); + ReactFeatureFlags.warnAbouDefaultPropsOnFunctionComponents = true; }); it('should render stateless component', () => { @@ -206,7 +209,7 @@ describe('ReactFunctionComponent', () => { ReactTestUtils.renderIntoDocument(); }); - fit('should warn when given defaultProps', () => { + it('should warn when given defaultProps', () => { function FunctionalComponent(props) { return null; } @@ -215,19 +218,12 @@ describe('ReactFunctionComponent', () => { testProp: true, }; - class Test extends React.Component { - render() { - return null; - } - } - - Test.defaultProps = { - testProp: true, - }; - - expect(() => ReactTestUtils.renderIntoDocument()).toWarnDev( - 'Warning: defaultProps should only be used on Class Components. ' + - 'For Functional Components, use Javascript default arguments instead.', + expect(() => + ReactTestUtils.renderIntoDocument(), + ).toWarnDev( + 'Warning: FunctionalComponent: Function components do not support defaultProps. ' + + 'Use Javascript default arguments instead.', + {withoutStack: true}, ); }); @@ -390,7 +386,11 @@ describe('ReactFunctionComponent', () => { ); }); + // TODO: deprecate default props support after we remove defaultProps + // from function components it('should support default props and prop types', () => { + ReactFeatureFlags.warnAbouDefaultPropsOnFunctionComponents = false; + function Child(props) { return
{props.test}
; } diff --git a/packages/react-reconciler/src/ReactFiber.js b/packages/react-reconciler/src/ReactFiber.js index 13c452fb52a39..eb34d0971c5a8 100644 --- a/packages/react-reconciler/src/ReactFiber.js +++ b/packages/react-reconciler/src/ReactFiber.js @@ -717,7 +717,6 @@ export function createFiberFromTypeAndProps( fiber.elementType = type; fiber.type = resolvedType; fiber.expirationTime = expirationTime; - return fiber; } diff --git a/packages/react-reconciler/src/ReactFiberBeginWork.js b/packages/react-reconciler/src/ReactFiberBeginWork.js index df2519a248274..94ab36a070433 100644 --- a/packages/react-reconciler/src/ReactFiberBeginWork.js +++ b/packages/react-reconciler/src/ReactFiberBeginWork.js @@ -63,6 +63,7 @@ import { enableSuspenseServerRenderer, enableFlareAPI, enableFundamentalAPI, + warnAbouDefaultPropsOnFunctionComponents, } from 'shared/ReactFeatureFlags'; import invariant from 'shared/invariant'; import shallowEqual from 'shared/shallowEqual'; @@ -192,6 +193,7 @@ export let didWarnAboutReassigningProps; let didWarnAboutMaxDuration; let didWarnAboutRevealOrder; let didWarnAboutTailOptions; +let didWarnAboutDefaultPropsOnFunctionComponent; if (__DEV__) { didWarnAboutBadClass = {}; @@ -203,6 +205,7 @@ if (__DEV__) { didWarnAboutMaxDuration = false; didWarnAboutRevealOrder = {}; didWarnAboutTailOptions = {}; + didWarnAboutDefaultPropsOnFunctionComponent = {}; } export function reconcileChildren( @@ -1414,6 +1417,24 @@ function validateFunctionComponentInDev(workInProgress: Fiber, Component: any) { } } + // console.log(warnAbouDefaultPropsOnFunctionComponents); + if ( + warnAbouDefaultPropsOnFunctionComponents && + Component.defaultProps !== undefined + ) { + const componentName = getComponentName(Component) || 'Unknown'; + + if (!didWarnAboutDefaultPropsOnFunctionComponent[componentName]) { + warningWithoutStack( + false, + '%s: Function components do not support defaultProps. ' + + 'Use Javascript default arguments instead.', + componentName, + ); + didWarnAboutDefaultPropsOnFunctionComponent[componentName] = true; + } + } + if (typeof Component.getDerivedStateFromProps === 'function') { const componentName = getComponentName(Component) || 'Unknown'; diff --git a/packages/react/src/ReactElement.js b/packages/react/src/ReactElement.js index 483f80e60aceb..b63ecee983d2d 100644 --- a/packages/react/src/ReactElement.js +++ b/packages/react/src/ReactElement.js @@ -305,8 +305,8 @@ export function jsxDEV(type, config, maybeKey, source, self) { // config: props + key + ref export function createElement(type, config, children) { let propName; - console.log(type, '\n\n', config, '\n\n', children); - console.log('a', type.prototype.isReactComponent()); + // console.log(type, '\n\n', config, '\n\n', children); + // console.log('a', type); // Reserved names are extracted const props = {}; diff --git a/packages/shared/ReactFeatureFlags.js b/packages/shared/ReactFeatureFlags.js index 2c87bb1a06efa..4383d12651d9a 100644 --- a/packages/shared/ReactFeatureFlags.js +++ b/packages/shared/ReactFeatureFlags.js @@ -78,3 +78,8 @@ export const revertPassiveEffectsChange = false; // but without making them discrete. The flag exists in case it causes // starvation problems. export const enableUserBlockingEvents = false; + +// Simplifies how React.createElement works so we can eventually move +// from React.createElement to React.jsx +// https://github.com/reactjs/rfcs/blob/createlement-rfc/text/0000-create-element-changes.md +export const warnAbouDefaultPropsOnFunctionComponents = false; diff --git a/packages/shared/forks/ReactFeatureFlags.native-fb.js b/packages/shared/forks/ReactFeatureFlags.native-fb.js index e458937a62af5..759c3c42f94cf 100644 --- a/packages/shared/forks/ReactFeatureFlags.native-fb.js +++ b/packages/shared/forks/ReactFeatureFlags.native-fb.js @@ -37,6 +37,7 @@ export const enableJSXTransformAPI = false; export const warnAboutMissingMockScheduler = true; export const revertPassiveEffectsChange = false; export const enableUserBlockingEvents = false; +export const warnAbouDefaultPropsOnFunctionComponents = false; // Only used in www builds. export function addUserTimingListener() { diff --git a/packages/shared/forks/ReactFeatureFlags.www.js b/packages/shared/forks/ReactFeatureFlags.www.js index a9c01b5417f82..910d4b42c966b 100644 --- a/packages/shared/forks/ReactFeatureFlags.www.js +++ b/packages/shared/forks/ReactFeatureFlags.www.js @@ -21,6 +21,7 @@ export const { warnAboutDeprecatedSetNativeProps, revertPassiveEffectsChange, enableUserBlockingEvents, + warnAbouDefaultPropsOnFunctionComponents, } = require('ReactFeatureFlags'); // In www, we have experimental support for gathering data From e3abfa422dac89d0b0b8780728ada239c4aa36af Mon Sep 17 00:00:00 2001 From: Luna Ruan Date: Wed, 24 Jul 2019 19:46:44 -0700 Subject: [PATCH 3/7] clean up console.logs/random spaces --- packages/react-reconciler/src/ReactFiber.js | 1 + packages/react/src/ReactElement.js | 7 +------ 2 files changed, 2 insertions(+), 6 deletions(-) diff --git a/packages/react-reconciler/src/ReactFiber.js b/packages/react-reconciler/src/ReactFiber.js index 032bafa5088c0..2e1ba80704379 100644 --- a/packages/react-reconciler/src/ReactFiber.js +++ b/packages/react-reconciler/src/ReactFiber.js @@ -712,6 +712,7 @@ export function createFiberFromTypeAndProps( fiber.elementType = type; fiber.type = resolvedType; fiber.expirationTime = expirationTime; + return fiber; } diff --git a/packages/react/src/ReactElement.js b/packages/react/src/ReactElement.js index b63ecee983d2d..9416a313b9648 100644 --- a/packages/react/src/ReactElement.js +++ b/packages/react/src/ReactElement.js @@ -301,12 +301,9 @@ export function jsxDEV(type, config, maybeKey, source, self) { * Create and return a new ReactElement of the given type. * See https://reactjs.org/docs/react-api.html#createelement */ -// type: component -// config: props + key + ref export function createElement(type, config, children) { let propName; - // console.log(type, '\n\n', config, '\n\n', children); - // console.log('a', type); + // Reserved names are extracted const props = {}; @@ -376,8 +373,6 @@ export function createElement(type, config, children) { defineRefPropWarningGetter(props, displayName); } } - // if (type.defaultProps && type.prototype.isReactComponent) { - // } } return ReactElement( type, From a6fd7d5d94925d55e8112d76d0704624e787cadf Mon Sep 17 00:00:00 2001 From: Luna Ruan Date: Wed, 24 Jul 2019 19:48:22 -0700 Subject: [PATCH 4/7] one more console.log --- packages/react-reconciler/src/ReactFiberBeginWork.js | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/react-reconciler/src/ReactFiberBeginWork.js b/packages/react-reconciler/src/ReactFiberBeginWork.js index afd046bcd0ffa..7dabc388452a0 100644 --- a/packages/react-reconciler/src/ReactFiberBeginWork.js +++ b/packages/react-reconciler/src/ReactFiberBeginWork.js @@ -1427,7 +1427,6 @@ function validateFunctionComponentInDev(workInProgress: Fiber, Component: any) { } } - // console.log(warnAbouDefaultPropsOnFunctionComponents); if ( warnAbouDefaultPropsOnFunctionComponents && Component.defaultProps !== undefined From 2395810a3b58c05ff6138d62d94e9f3485101fa6 Mon Sep 17 00:00:00 2001 From: Luna Ruan Date: Thu, 25 Jul 2019 11:28:44 -0700 Subject: [PATCH 5/7] fixed spelling/wording, moved test to new file, and updated all the ReactFeatureFlag files to include new flag --- .../ReactDeprecationWarnings-test.internal.js | 46 +++++++++++++++++++ .../__tests__/ReactFunctionComponent-test.js | 25 +--------- .../src/ReactFiberBeginWork.js | 8 ++-- packages/shared/ReactFeatureFlags.js | 2 +- .../forks/ReactFeatureFlags.native-fb.js | 2 +- .../forks/ReactFeatureFlags.native-oss.js | 1 + .../forks/ReactFeatureFlags.persistent.js | 1 + .../forks/ReactFeatureFlags.test-renderer.js | 1 + .../ReactFeatureFlags.test-renderer.www.js | 1 + .../shared/forks/ReactFeatureFlags.www.js | 2 +- 10 files changed, 58 insertions(+), 31 deletions(-) create mode 100644 packages/react-dom/src/__tests__/ReactDeprecationWarnings-test.internal.js diff --git a/packages/react-dom/src/__tests__/ReactDeprecationWarnings-test.internal.js b/packages/react-dom/src/__tests__/ReactDeprecationWarnings-test.internal.js new file mode 100644 index 0000000000000..1e4e10ddb5a35 --- /dev/null +++ b/packages/react-dom/src/__tests__/ReactDeprecationWarnings-test.internal.js @@ -0,0 +1,46 @@ +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @emails react-core + */ + +'use strict'; + +let React; +let ReactTestUtils; +let ReactFeatureFlags; + +describe('ReactDeprecationWarnings', () => { + beforeEach(() => { + jest.resetModules(); + React = require('react'); + ReactFeatureFlags = require('shared/ReactFeatureFlags'); + ReactTestUtils = require('react-dom/test-utils'); + ReactFeatureFlags.warnAboutDefaultPropsOnFunctionComponents = true; + }); + + afterEach(() => { + ReactFeatureFlags.warnAboutDefaultPropsOnFunctionComponents = false; + }); + + it('should warn when given defaultProps', () => { + function FunctionalComponent(props) { + return null; + } + + FunctionalComponent.defaultProps = { + testProp: true, + }; + + expect(() => + ReactTestUtils.renderIntoDocument(), + ).toWarnDev( + 'Warning: FunctionalComponent: Function components will not support defaultProps. ' + + 'Use JavaScript default arguments instead.', + {withoutStack: true}, + ); + }); +}); diff --git a/packages/react-dom/src/__tests__/ReactFunctionComponent-test.js b/packages/react-dom/src/__tests__/ReactFunctionComponent-test.js index a1d12ba384ec4..6a4d6a5fcb07a 100644 --- a/packages/react-dom/src/__tests__/ReactFunctionComponent-test.js +++ b/packages/react-dom/src/__tests__/ReactFunctionComponent-test.js @@ -13,7 +13,6 @@ let PropTypes; let React; let ReactDOM; let ReactTestUtils; -let ReactFeatureFlags; function FunctionComponent(props) { return
{props.name}
; @@ -26,8 +25,6 @@ describe('ReactFunctionComponent', () => { React = require('react'); ReactDOM = require('react-dom'); ReactTestUtils = require('react-dom/test-utils'); - ReactFeatureFlags = require('shared/ReactFeatureFlags'); - ReactFeatureFlags.warnAbouDefaultPropsOnFunctionComponents = true; }); it('should render stateless component', () => { @@ -209,24 +206,6 @@ describe('ReactFunctionComponent', () => { ReactTestUtils.renderIntoDocument(); }); - it('should warn when given defaultProps', () => { - function FunctionalComponent(props) { - return null; - } - - FunctionalComponent.defaultProps = { - testProp: true, - }; - - expect(() => - ReactTestUtils.renderIntoDocument(), - ).toWarnDev( - 'Warning: FunctionalComponent: Function components do not support defaultProps. ' + - 'Use Javascript default arguments instead.', - {withoutStack: true}, - ); - }); - it('should warn when given a function ref', () => { function Indirection(props) { return
{props.children}
; @@ -386,11 +365,9 @@ describe('ReactFunctionComponent', () => { ); }); - // TODO: deprecate default props support after we remove defaultProps + // TODO: change this test after we deprecate default props support // from function components it('should support default props and prop types', () => { - ReactFeatureFlags.warnAbouDefaultPropsOnFunctionComponents = false; - function Child(props) { return
{props.test}
; } diff --git a/packages/react-reconciler/src/ReactFiberBeginWork.js b/packages/react-reconciler/src/ReactFiberBeginWork.js index 7dabc388452a0..4a156cb611be4 100644 --- a/packages/react-reconciler/src/ReactFiberBeginWork.js +++ b/packages/react-reconciler/src/ReactFiberBeginWork.js @@ -62,7 +62,7 @@ import { enableSuspenseServerRenderer, enableFlareAPI, enableFundamentalAPI, - warnAbouDefaultPropsOnFunctionComponents, + warnAboutDefaultPropsOnFunctionComponents, } from 'shared/ReactFeatureFlags'; import invariant from 'shared/invariant'; import shallowEqual from 'shared/shallowEqual'; @@ -1428,7 +1428,7 @@ function validateFunctionComponentInDev(workInProgress: Fiber, Component: any) { } if ( - warnAbouDefaultPropsOnFunctionComponents && + warnAboutDefaultPropsOnFunctionComponents && Component.defaultProps !== undefined ) { const componentName = getComponentName(Component) || 'Unknown'; @@ -1436,8 +1436,8 @@ function validateFunctionComponentInDev(workInProgress: Fiber, Component: any) { if (!didWarnAboutDefaultPropsOnFunctionComponent[componentName]) { warningWithoutStack( false, - '%s: Function components do not support defaultProps. ' + - 'Use Javascript default arguments instead.', + '%s: Function components will not support defaultProps. ' + + 'Use JavaScript default arguments instead.', componentName, ); didWarnAboutDefaultPropsOnFunctionComponent[componentName] = true; diff --git a/packages/shared/ReactFeatureFlags.js b/packages/shared/ReactFeatureFlags.js index d57422689234d..ac92811f09541 100644 --- a/packages/shared/ReactFeatureFlags.js +++ b/packages/shared/ReactFeatureFlags.js @@ -87,4 +87,4 @@ export const enableSuspenseCallback = false; // Part of the simplification of React.createElement so we can eventually move // from React.createElement to React.jsx // https://github.com/reactjs/rfcs/blob/createlement-rfc/text/0000-create-element-changes.md -export const warnAbouDefaultPropsOnFunctionComponents = false; +export const warnAboutDefaultPropsOnFunctionComponents = false; diff --git a/packages/shared/forks/ReactFeatureFlags.native-fb.js b/packages/shared/forks/ReactFeatureFlags.native-fb.js index c90aa83793fba..08baee4c30ca5 100644 --- a/packages/shared/forks/ReactFeatureFlags.native-fb.js +++ b/packages/shared/forks/ReactFeatureFlags.native-fb.js @@ -38,7 +38,7 @@ export const warnAboutMissingMockScheduler = true; export const revertPassiveEffectsChange = false; export const enableUserBlockingEvents = false; export const enableSuspenseCallback = false; -export const warnAbouDefaultPropsOnFunctionComponents = false; +export const warnAboutDefaultPropsOnFunctionComponents = false; // Only used in www builds. export function addUserTimingListener() { diff --git a/packages/shared/forks/ReactFeatureFlags.native-oss.js b/packages/shared/forks/ReactFeatureFlags.native-oss.js index 4183657076ea7..e1bb4ecae4bfd 100644 --- a/packages/shared/forks/ReactFeatureFlags.native-oss.js +++ b/packages/shared/forks/ReactFeatureFlags.native-oss.js @@ -33,6 +33,7 @@ export const warnAboutMissingMockScheduler = false; export const revertPassiveEffectsChange = false; export const enableUserBlockingEvents = false; export const enableSuspenseCallback = false; +export const warnAboutDefaultPropsOnFunctionComponents = false; // Only used in www builds. export function addUserTimingListener() { diff --git a/packages/shared/forks/ReactFeatureFlags.persistent.js b/packages/shared/forks/ReactFeatureFlags.persistent.js index 568626d09c4b1..c392336fc5188 100644 --- a/packages/shared/forks/ReactFeatureFlags.persistent.js +++ b/packages/shared/forks/ReactFeatureFlags.persistent.js @@ -33,6 +33,7 @@ export const warnAboutMissingMockScheduler = true; export const revertPassiveEffectsChange = false; export const enableUserBlockingEvents = false; export const enableSuspenseCallback = false; +export const warnAboutDefaultPropsOnFunctionComponents = false; // Only used in www builds. export function addUserTimingListener() { diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.js index 80174516fcc83..a38d1f5ff8218 100644 --- a/packages/shared/forks/ReactFeatureFlags.test-renderer.js +++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.js @@ -33,6 +33,7 @@ export const warnAboutMissingMockScheduler = false; export const revertPassiveEffectsChange = false; export const enableUserBlockingEvents = false; export const enableSuspenseCallback = false; +export const warnAboutDefaultPropsOnFunctionComponents = false; // Only used in www builds. export function addUserTimingListener() { diff --git a/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js b/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js index 37a2a80402498..c8f1beb3e6288 100644 --- a/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js +++ b/packages/shared/forks/ReactFeatureFlags.test-renderer.www.js @@ -33,6 +33,7 @@ export const enableJSXTransformAPI = true; export const warnAboutMissingMockScheduler = true; export const enableUserBlockingEvents = false; export const enableSuspenseCallback = true; +export const warnAboutDefaultPropsOnFunctionComponents = false; // Only used in www builds. export function addUserTimingListener() { diff --git a/packages/shared/forks/ReactFeatureFlags.www.js b/packages/shared/forks/ReactFeatureFlags.www.js index 37e92ee110993..284416c8255b2 100644 --- a/packages/shared/forks/ReactFeatureFlags.www.js +++ b/packages/shared/forks/ReactFeatureFlags.www.js @@ -78,7 +78,7 @@ export const warnAboutMissingMockScheduler = true; export const enableSuspenseCallback = true; -export const warnAbouDefaultPropsOnFunctionComponents = false; +export const warnAboutDefaultPropsOnFunctionComponents = false; // Flow magic to verify the exports of this file match the original version. // eslint-disable-next-line no-unused-vars From 079d17ce558623d630fe85ee54aee74418d1efb9 Mon Sep 17 00:00:00 2001 From: Luna Ruan Date: Thu, 25 Jul 2019 11:34:34 -0700 Subject: [PATCH 6/7] changed wording --- packages/react-dom/src/__tests__/ReactFunctionComponent-test.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react-dom/src/__tests__/ReactFunctionComponent-test.js b/packages/react-dom/src/__tests__/ReactFunctionComponent-test.js index 6a4d6a5fcb07a..685a1cffb97e3 100644 --- a/packages/react-dom/src/__tests__/ReactFunctionComponent-test.js +++ b/packages/react-dom/src/__tests__/ReactFunctionComponent-test.js @@ -366,7 +366,7 @@ describe('ReactFunctionComponent', () => { }); // TODO: change this test after we deprecate default props support - // from function components + // for function components it('should support default props and prop types', () => { function Child(props) { return
{props.test}
; From 9c7d282fcd47c5b15aacb2c05b16ab9f9cadd37a Mon Sep 17 00:00:00 2001 From: Luna Ruan Date: Thu, 25 Jul 2019 15:25:19 -0700 Subject: [PATCH 7/7] changed warning wording --- .../src/__tests__/ReactDeprecationWarnings-test.internal.js | 5 +++-- packages/react-reconciler/src/ReactFiberBeginWork.js | 4 ++-- 2 files changed, 5 insertions(+), 4 deletions(-) diff --git a/packages/react-dom/src/__tests__/ReactDeprecationWarnings-test.internal.js b/packages/react-dom/src/__tests__/ReactDeprecationWarnings-test.internal.js index 1e4e10ddb5a35..d4413dd4e8752 100644 --- a/packages/react-dom/src/__tests__/ReactDeprecationWarnings-test.internal.js +++ b/packages/react-dom/src/__tests__/ReactDeprecationWarnings-test.internal.js @@ -38,8 +38,9 @@ describe('ReactDeprecationWarnings', () => { expect(() => ReactTestUtils.renderIntoDocument(), ).toWarnDev( - 'Warning: FunctionalComponent: Function components will not support defaultProps. ' + - 'Use JavaScript default arguments instead.', + 'Warning: FunctionalComponent: Support for defaultProps ' + + 'will be removed from function components in a future major ' + + 'release. Use JavaScript default parameters instead.', {withoutStack: true}, ); }); diff --git a/packages/react-reconciler/src/ReactFiberBeginWork.js b/packages/react-reconciler/src/ReactFiberBeginWork.js index 4a156cb611be4..18c076bd39571 100644 --- a/packages/react-reconciler/src/ReactFiberBeginWork.js +++ b/packages/react-reconciler/src/ReactFiberBeginWork.js @@ -1436,8 +1436,8 @@ function validateFunctionComponentInDev(workInProgress: Fiber, Component: any) { if (!didWarnAboutDefaultPropsOnFunctionComponent[componentName]) { warningWithoutStack( false, - '%s: Function components will not support defaultProps. ' + - 'Use JavaScript default arguments instead.', + '%s: Support for defaultProps will be removed from function components ' + + 'in a future major release. Use JavaScript default parameters instead.', componentName, ); didWarnAboutDefaultPropsOnFunctionComponent[componentName] = true;