search

facebook / prop-types

Runtime type checking for React props and similar objects
MIT License
4.48k stars 356 forks source link

How does isNode typecheking work with boolean types? #199

Closed ottodevs closed 6 years ago

ottodevs commented 6 years ago

https://github.com/facebook/prop-types/blob/cfc7f43af3d74978ec82052fe6bb8212f09daca0/factoryWithTypeCheckers.js#L433

If a boolean prop is passed it is a valid node if it is false, but invalid node if it is true, is it correct or is a bug? It has no sense since is the same type. Could anyone explain this please?

Also if the typeof prop is a function, then it will fall into default switch case (therefore invalid node), but should be a valid node if the function returns a node.

ljharb commented 6 years ago

That means false is a node but true is not; sounds right to me.

ljharb commented 6 years ago

Also no, a function isn’t a node regardless of what it returns.

ottodevs commented 6 years ago

The documentation says "Anything that can be rendered", how can a boolean false be rendered whilst a boolean true not?

I don't get it from the documentation, can you explain better please? Sorry for my confusion

ljharb commented 6 years ago

false means “nothing”; true means “you have a bug”.

ottodevs commented 6 years ago

Understood, thanks.

nmifsud-r7 commented 6 years ago

I just came across this issue and found this in the docs: https://reactjs.org/docs/jsx-in-depth.html#booleans-null-and-undefined-are-ignored

false, null, undefined, and true are valid children.

This seems to be at odds with the above implementation and explanation?

ljharb commented 6 years ago

Interesting, seems like either the docs or the propType is wrong. What happens if you actually render true?

nmifsud-r7 commented 5 years ago

A little late to reply to this - my apologies. 🙈

I rustled up an example: https://codesandbox.io/s/jjq6138my9

The output from this in the console is: 

Warning: Failed prop type: Invalid prop `children` supplied to `TrueContent`, expected a ReactNode.
    in TrueContent (created by Example)
    in Example
Warning: Failed prop type: The prop `children` is marked as required in `NullContent`, but its value is `null`.
    in NullContent (created by Example)
    in Example

So, {null} is a ReactNode but is null and fails the isRequired check, {false} is a ReactNode, {true} is not a ReactNode.

ljharb commented 5 years ago

Seems like the react docs need to be updated, then - that's a different repo, so please file an issue/PR there :-)