react: Unhelpful propTypes warning: Invalid prop `0` supplied to `Component`

I use this pattern often:

/** @jsx React.DOM */

var Hello = React.createClass({
    propTypes: {
        modifiers: React.PropTypes.arrayOf(
            React.PropTypes.oneOf(['large', 'colored', 'fill'])
        )
    },
    render: function() {
        return <div>Hello {this.props.name}</div>;
    }
});

It’s useful for flags that change too often and go straight to CSS without imposing any logic onto the component.

Say I pass an unsupported modifier:

React.renderComponent(<Hello name="World" modifiers={['other']} />, document.body);

React spits out an unhelpful warning:

Warning: Invalid prop `0` supplied to `Hello`, expected one of ["fill","colored","large"].

It’s unhelpful because I have no idea what string 0 index corresponds to until I look it up in the code. It would save me a lot of time and hassle to see the actual array value that failed the check.

It there any reason why we don’t show the value? Is it because it may not be serializable? Any workarounds?

About this issue

Original URL
State: closed
Created 10 years ago
Comments: 20 (13 by maintainers)

Most upvoted comments

please don’t remove proptypes.

luisrudge on Feb 9, 2016

Let me also clarify: There is an idea to unify the type system semantics with Flow so that there are equivalent concepts in either direction.

In case people prefer early adoption of the syntax extension that Flow provides (which is being unified with other similar systems so that it can eventually end up on the standardization track) then they could compile those into development time runtime warnings.

However, there would likely be a runtime only alternative without syntax sugar available too. Although it might be less convenient. Compare something like async/await to Promise. If you don’t want to use the syntax extension you don’t have to. There won’t be a requirement to use language extensions to use React. However, all of these are hypothetical ideas and until this becomes real and adopted: PropTypes will remain and be maintained.

It is unlikely that it will evolve in a direction that is incompatible with Flow-unification that is all. If a new unified system does evolve, there will be a suitable upgrade plan.

sebmarkbage on Feb 11, 2016