-
Notifications
You must be signed in to change notification settings - Fork 1.1k
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
How to use with redux-little-router #47
Comments
Any chance you could try to reproduce this in a codesandbox like this one? Then we could probably help you better. |
No problem, I created one here. Sorry my initial issue was a little scant on details--I wasn't sure if this was the right repo to create it in. I had been thinking that this may be due to running in node vs the browser before submitting the issue, and now I see that it works in codesandbox, which I think confirms those suspicions (it just bundles the code using its crazy magic and then executes that in the browser, right?). I'm going to make a standalone project out of that sandbox, and then I'll share it here. |
What! This makes no sense. So now I'm wondering what the difference is between running tests via react-tests and running them in my project using jest. I see this in the test script from the codesandbox project: |
On a sidenote, I'm once again blown away by how awesome codesandbox is 😄 |
Oh, yes, you definitely need jsdom for this library to work. If you're using Jest, you'll need to set the I'm guessing that's the issue. Feel free to continue asking questions and folks can help when and where they can. But that's probably the problem. Good luck. |
Thanks for your help so far! I tried your suggestion, and I still get issues, but I got closer to what the actual issue is. I'll need to revise my codesandbox and possibly re-open this if that's OK. The problem only happens if I return {pages.map(({ route, Component }) => (
<Fragment key={route} forRoute={route}>
<Component />
</Fragment>
))} Each item in I'm going to make a new codesandbox and see if I can repro this now that I know more about the scenario that causes it. |
Well, I'm at a loss. I updated the codesandbox to reflect this scenario and it works in the browser and locally. I'm going to try to strip down my failing example and discover what the problem is. Sorry for all the noise on this issue. |
No worries. Keep at it. You can do it! |
So the mistake I was making is obvious in hindsight but was hard to spot. I was mounting a subset of my app that is normally (outside of tests) wrapped in a parent route. So when I mapped through those components/routes in the test, they weren't wrapped in their parent route and so their routes never matched any href from any of the Thank you for offering encouragement, by the way! I admire people who can behave that way in a context where it's far easier to be apathetic or annoyed 😄 |
I'm glad you worked it out! If you'd like to add an example to the tests that'd be welcome! |
chore: 🤖 update lint-staged
react-testing-library
version: 1.10.0node
version: 8.9.4npm
(oryarn
) version: 5.6.0Relevant code or config
I used the
renderWithRedux
util from the redux example:What you did:
(Note: I'm not sure if this issue belongs here or in the redux-little-router repo. Also, I tried looking at the react-router example to get ideas of how to work around this.)
I wrote a test that simulates some actions that modify redux state and then clicks on a link that goes to another route. I would like to then verify that the UI on this page is correct per redux state.
What happened:
The component tree reflects that no routing happened (stays on the same page).
Reproduction repository:
Problem description:
Suggested solution:
The text was updated successfully, but these errors were encountered: