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

Context is read by components regardless of contextTypes definition #1590

Closed
2 of 10 tasks
wojtekmaj opened this issue Mar 22, 2018 · 2 comments · Fixed by #1968
Closed
2 of 10 tasks

Context is read by components regardless of contextTypes definition #1590

wojtekmaj opened this issue Mar 22, 2018 · 2 comments · Fixed by #1968

Comments

@wojtekmaj
Copy link

wojtekmaj commented Mar 22, 2018

Consider the following, simplified example:

class NotGonnaRead extends Component {
  render() {
    return (
      <p>My favorite color is {this.context.favoriteColor}</p>
    );
  }
}

class WillRead extends Component {
  render() {
    return (
      <p>My favorite color is {this.context.favoriteColor}</p>
    );
  }
}

WillRead.contextTypes = {
  favoriteColor: PropTypes.string,
}

class FavoriteColorProvider extends Component {
  getChildContext() {
    return {
      favoriteColor: 'purple',
    };
  }
}

If we render it like so:

<FavoriteColorProvider>
    <NotGonnaRead />
</FavoriteColorProvider>

then the output is going to be My favorite color is .

Rendering this, however:

If we render it like so:

<FavoriteColorProvider>
    <WillRead />
</FavoriteColorProvider>

will correctly output My favorite color is purple.

Current behavior

If we would like to test if NotGonnaRead component is behaving properly (which it isn't), we would need to do something along the lines:

shallow(
  <NotGonnaRead />,
  { context: { favoriteColor: 'purple' } }
);

This will render <p>My favorite color is purple</p>.

Expected behavior

This example should render <p>My favorite color is </p> as contextTypes are not correctly defined.

Your environment

API

  • shallow
  • mount
  • render

Version

library version
Enzyme 3.3.0
React 16.2.0

Adapter

  • enzyme-adapter-react-16 1.1.1
  • enzyme-adapter-react-15
  • enzyme-adapter-react-15.4
  • enzyme-adapter-react-14
  • enzyme-adapter-react-13
  • enzyme-adapter-react-helper
  • others ( )
@ljharb
Copy link
Member

ljharb commented Mar 23, 2018

This is probably related to #664 - but may also be distinct.

It's possible that enzyme isn't filtering context by contextTypes, but I'd also expect React to do that for us. Can you check in react 15, and see if the same thing occurs? (also in mount on both 15 and 16)

@minznerjosh
Copy link
Contributor

This was fixed in facebook/react#11922. It was released in react-test-renderer v16.3. So I'm going to open a PR shortly that will fix it on enzyme's side for react@<16.3.

ljharb pushed a commit to trialspark/enzyme that referenced this issue Jan 14, 2019
ljharb pushed a commit to trialspark/enzyme that referenced this issue Jan 14, 2019
context interaction automation moved this from To do / needs triage to Done / Closed Jan 14, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
context interaction
  
Done / Closed
Development

Successfully merging a pull request may close this issue.

3 participants