question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

connect should hoist wrapped component's propTypes if they exist

See original GitHub issue

When using this HOC in development, propTypes warnings will normally appear in the console. This is great! However, if you are using shallow rendering in tests, and rely on propTypes warnings to be surfaced by your test suite, they will not be surfaced because they are not hoisted from the wrapped component.

This is further problematic if you are combining multiple HOCs on the same component, and one of them uses something like forbidExtraProps.

What do you think about adding some logic to connect that copies propTypes (and necessarily defaultProps) if they exist on the wrapped component?

cc @ljharb @barberdt

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Comments:7 (3 by maintainers)

github_iconTop GitHub Comments

3reactions
jimbollacommented, Apr 12, 2017

This seems solvable in userland without needing to modify connect. One could wrap connect and add the desired behavior.

1reaction
ljharbcommented, Apr 12, 2017

+1 on propTypes - copying defaultProps isn’t helpful for warnings, but it is helpful so that MyComponent.defaultProps = { ...InnerComponent.defaultProps }; isn’t a breaking change when InnerComponent changes from unwrapped → wrapped.

In other words, starting to use an HOC, or ceasing to use one, should be utterly transparent to consumers of the wrapped/unwrapped component - and one way to help ensure that is to make sure that statics, including defaultProps and propTypes, are meaningfully similar on the wrapper as on the wrapped.

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to define propTypes for a component wrapped with ...
I don't think you will find a definitive answer to this. Some will argue that if you define one propType you should define...
Read more >
Typechecking With PropTypes - React
To run typechecking on the props for a component, you can assign the special propTypes property: import PropTypes from 'prop-types'; class Greeting extends ......
Read more >
Handle static properties properly with Higher Order Components
In this lesson we'll see a confusing observable behavior of using Higher Order Components and use the hoist-non-react-statics library to avoid ...
Read more >
did not get defaultProps from mapStateToProps params of ...
So I think it would be nice to hoist the defaultProps from the wrapped component and make them available in ownProps of mapStateToProps...
Read more >
How to validate React props using PropTypes - LogRocket Blog
To pass props between components, you can add them when the component is called, just like you would pass arguments when calling on...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found