Skip to content

react-test-renderer update method does not rerender component with new props #530

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

Closed
joshuaellis opened this issue Jan 8, 2021 · 7 comments
Labels
bug Something isn't working

Comments

@joshuaellis
Copy link
Member

  • react-hooks-testing-library version: 4.0.0
  • react-test-renderer version: 17.0.1
  • react version: 17.0.1
  • node version: 14.0.0
  • npm (or yarn) version: 1.22.5 (yarn)

Reproduction:

https://github.com/joshuaellis/react-test-renderer-update-issue

Problem description:

@testing-library/react-hooks rerender function uses react-test-renderer update under the hood. The props are correctly passed to update function but the hook does not re-render with the new props so the test fails.

image

Suggested solution:

I think this has something to do with react-test-renderer so i've raised it with them here but also want to keep an eye on it.

The expected behavior

the last two logs (in the image above) should say:
"using func func2"
"im func 2"

@joshuaellis joshuaellis added the bug Something isn't working label Jan 8, 2021
@joshuaellis
Copy link
Member Author

may be related to #525

@joshuaellis
Copy link
Member Author

Okay, after recreating it all in react-test-renderer not using RHTL, it passes. This is the branch with the code & passing test, must be something wrong with our async utils I suppose.... Or maybe I fluked the branch – https://github.com/joshuaellis/react-test-renderer-update-issue/tree/only-use-test-renderer

@mpeyper
Copy link
Member

mpeyper commented Jan 8, 2021

Try making it

const { result, rerender } = renderHook(({ func }) =>
      usePolling({
        func,
        interval: 1000
      }),
      {
        initialProps: {
          func: func1
        }
      }
    )

@joshuaellis
Copy link
Member Author

Ah stupid me. Although I am going to ask, out of my own curiousity, why do we have to do it this way? It seems in my opinion a little counter intuitive. Because if I want to add a new prop down the line that wasn't defined in the original render, it passes through correctly. Hence why I was confused.

Do you think we could/should remove it?

@joshuaellis
Copy link
Member Author

Doesn't matter, i've had a deep look, it all makes sense, I now have an even further understanding of the engine we're using 🧠 I just realised the rtl way I built even uses that pattern! 🤕

@mpeyper
Copy link
Member

mpeyper commented Jan 9, 2021

If you're interested, #56 is mostly about how much I hate how we deal with changing props.

@joshuaellis
Copy link
Member Author

I'll take a look, i've been trying to make my way through the issues we've got open and understand them properly 👍🏼

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

2 participants