PropTypes: distinguish nullable from optional object field #7291
Conversation
ghost
added
|
cc @spicyj @keyanzhang realized this confusion during the codemod. |
| null, | ||
| ReactPropTypesSecret | ||
| ); | ||
| expect(error2 instanceof Error).toBe(true); |
There was a problem hiding this comment.
Nit but I guess you’d want to do the instanceof check for error1 too?
There was a problem hiding this comment.
Nice catch, corrected, thanks.
|
To be clear, this distinguishes null from undefined, but does not distinguish undefined from an absent field – right? |
|
Right, I don't tackle that. |
|
@spicyj is this good for merging? |
| @@ -144,6 +144,12 @@ function createChainableTypeChecker(validate) { | |||
| if (props[propName] == null) { | |||
| var locationName = ReactPropTypeLocationNames[location]; | |||
| if (isRequired) { | |||
| if (props[propName] === null) { | |||
| return new Error( | |||
| `Required ${locationName} \`${propFullName}\` was specified in ` + | |||
There was a problem hiding this comment.
Can we do
The ${locationName} `${propFullName}` is required in ${componentName}, but its value is null.
and replace the other message with "…its value is undefined."?
lgtm. Can you send me a diff internally to html/shared/core/createWarning.js adding the new wording so we don't forget?
|
I'd like the wording to be clearer and more accurate as noted inline, but after you fix that feel free to squash and merge. |
This gives a more precise message (no type semantics change) to the case of passing a field in an object, but whose value is `null`:
Before:
```js
propTypes: {
foo: React.PropTypes.number.isRequired
}
```
Would scream "Required prop `foo` was not specified in `MyComp`".
Now it'll be "Required prop `foo` was specified in `MyComp`, but its value is `null`.".
Works as expected in nested objects.
This fixes the issue of a component transitively passing a `null`, specifying the correct field to the child but have the child tell it that it didn't provide the prop.
Optional field and nullable are two different things anyway.
* PropTypes: distinguish nullable from optional object field
This gives a more precise message (no type semantics change) to the case of passing a field in an object, but whose value is `null`:
Before:
```js
propTypes: {
foo: React.PropTypes.number.isRequired
}
```
Would scream "Required prop `foo` was not specified in `MyComp`".
Now it'll be "Required prop `foo` was specified in `MyComp`, but its value is `null`.".
Works as expected in nested objects.
This fixes the issue of a component transitively passing a `null`, specifying the correct field to the child but have the child tell it that it didn't provide the prop.
Optional field and nullable are two different things anyway.
* Add missing test case.
* Reword messages.
(cherry picked from commit 0292d34)
This gives a more precise message (no type semantics change) to the case of passing a field in an object, but whose value is
null:Before:
Would scream "Required prop
foowas not specified inMyComp".Now it'll be "Required prop
foowas specified inMyComp, but its value isnull.".Works as expected in nested objects.
This fixes the issue of a component transitively passing a
null, specifying the correct field to the child but have the child tell it that it didn't provide the prop.Optional field and nullable are two different things anyway.