Warn when Using DefaultProps on Function Components #16210
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
gaearon
reviewed
Jul 25, 2019
| @@ -365,7 +386,11 @@ describe('ReactFunctionComponent', () => { | |||
| ); | |||
| }); | |||
|
|
|||
| // TODO: deprecate default props support after we remove defaultProps | |||
| // from function components | |||
There was a problem hiding this comment.
Didn't we plan to keep them for classes forever?
There was a problem hiding this comment.
Oh sorry, poor phrasing. I just meant that I need to change this test at some point. Will rephrase!
| @@ -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; | |||
There was a problem hiding this comment.
s/warnAbouDefaultPropsOnFunctionComponents/warnAboutDefaultPropsOnFunctionComponents (note the extra t at the end of About)
| @@ -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; | |||
| }); | |||
|
|
|||
There was a problem hiding this comment.
Suggested change
| afterEach(() => { | |
| ReactFeatureFlags.warnAboutDefaultPropsOnFunctionComponents = false; | |
| }) |
ljharb
reviewed
Jul 25, 2019
| expect(() => | ||
| ReactTestUtils.renderIntoDocument(<FunctionalComponent />), | ||
| ).toWarnDev( | ||
| 'Warning: FunctionalComponent: Function components do not support defaultProps. ' + |
There was a problem hiding this comment.
do not, or will not in a future version?
ljharb
reviewed
Jul 25, 2019
| warningWithoutStack( | ||
| false, | ||
| '%s: Function components do not support defaultProps. ' + | ||
| 'Use Javascript default arguments instead.', |
There was a problem hiding this comment.
Suggested change
| 'Use Javascript default arguments instead.', | |
| 'Use JavaScript default arguments instead.', |
ljharb
reviewed
Jul 25, 2019
| ReactTestUtils.renderIntoDocument(<FunctionalComponent />), | ||
| ).toWarnDev( | ||
| 'Warning: FunctionalComponent: Function components do not support defaultProps. ' + | ||
| 'Use Javascript default arguments instead.', |
There was a problem hiding this comment.
Suggested change
| 'Use Javascript default arguments instead.', | |
| 'Use JavaScript default arguments instead.', |
|
Tests suites that modify feature flags need an The reason is that we have a CI job that runs our unit tests against the actual npm packages. |
|
Need to update all the feature flag files to include the new one you added. E.g. |
…eactFeatureFlag files to include new flag
|
ReactDOM: size: 0.0%, gzip: -0.0% Details of bundled changes.Comparing: 121bfb0...9c7d282 react-art
react-dom
react-test-renderer
react-reconciler
react-native-renderer
Generated by 🚫 dangerJS |
danielkcz
reviewed
Jul 25, 2019
| warningWithoutStack( | ||
| false, | ||
| '%s: Function components will not support defaultProps. ' + | ||
| 'Use JavaScript default arguments instead.', |
There was a problem hiding this comment.
Might be worth mentioning it's ES2015 feature ... or not. 🤷♂
acdlite
reviewed
Jul 25, 2019
| ReactTestUtils.renderIntoDocument(<FunctionalComponent />), | ||
| ).toWarnDev( | ||
| 'Warning: FunctionalComponent: Function components will not support defaultProps. ' + | ||
| 'Use JavaScript default arguments instead.', |
There was a problem hiding this comment.
Alt suggestion for first sentence: "Support for defaultProps will be removed from function components in a future release."
There was a problem hiding this comment.
ideally, a future major release
There was a problem hiding this comment.
Right, I assumed that was implied but should probably be specific
acdlite
approved these changes
Jul 25, 2019
12 tasks
This was referenced May 8, 2024
Closed
1 task
1 task
gkielwasser
added a commit
to gkielwasser/react-lines-ellipsis
that referenced
this pull request
Jul 13, 2024
Replace usage of defaultProps. This is deprecated and will be removed in future React versions (see facebook/react#16210)
This was referenced Oct 8, 2024
nickspaargaren
pushed a commit
to nickspaargaren/react-focus-lock
that referenced
this pull request
Dec 11, 2024
As default props on function components are going to be deprecated in future release in favor of default function parameters (see: facebook/react#16210), I followed the recommendation. Note that default function parameters were actually already used (see `lockProps` for example)!
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
As part of the process to deprecate defaultProps on function components (as per a larger proposal outlined here), add a warning whenever someone does this.