Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[guide] [react] HOC WrappedComponent static property #1537

Open
wants to merge 1 commit into
base: master
from

Conversation

@nakhodkin
Copy link

nakhodkin commented Aug 24, 2017

WrappedComponent static property should be added to custom High-Order component to get access to the initial(decorated component). In most cases it would allow to avoid issue import/no-named-as-default


## High-Order Components

- For [Higher-Order Components](https://facebook.github.io/react/docs/higher-order-components.html) define static property `WrappedComponent` as a reference to decorated component.

This comment has been minimized.

Copy link
@ljharb

ljharb Aug 25, 2017

Collaborator

This link doesn't suggest adding this static property. Where is this convention coming from?


- For [Higher-Order Components](https://facebook.github.io/react/docs/higher-order-components.html) define static property `WrappedComponent` as a reference to decorated component.

If your High-Order Components don't provide access to decorated components, you can get faced with issue of [`import/no-named-as-default`](https://github.com/benmosher/eslint-plugin-import/blob/master/docs/rules/no-named-as-default.md)

This comment has been minimized.

Copy link
@ljharb

ljharb Aug 25, 2017

Collaborator

This isn't really a problem due to enzyme's .dive() method - "wrapped" components no longer need to be directly exported for the same of tests.

```jsx
// Title.test.jsx
import Title from './Title';
shallow(<Title.WrappedComponent>Hello, World!</Title.WrappedComponent>

This comment has been minimized.

Copy link
@ljharb

ljharb Aug 25, 2017

Collaborator

specifically, shallow(<Title />).dive() is the proper way to do this.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Linked issues

Successfully merging this pull request may close these issues.

None yet

2 participants
You can’t perform that action at this time.