-
Notifications
You must be signed in to change notification settings - Fork 8
[Bug] waitFor
is not working when imported from @storybook/testing-library
#9
Comments
I've tried adding addon-interactions, in case somehow storybook was relying on that being available, but it does not solve this issue. |
Could you share the entire play function? |
@ghengeveld sure thing, here's a reproduction: https://github.com/IanVS/vite-testing-example/blob/80886928fca6ad50e06dbbda2a8d105f73513848/src/screens/animals/AnimalsPage.stories.tsx#L26 The only difference in this branch is using |
We are experiencing the same issue |
This seems to be caused by having multiple instances of @testing-library/dom installed.
It will be interesting to see the reason why this causes the issue and if it can be avoided even when multiple instances are installed. In my case hoisting did not work for some weird reason and a reinstall helped. |
Looks like I only have one of them:
|
Ignore my previous comment. |
Ah, I wonder if that helps to explain #8 as well! |
I tried naively changing the return to a throw, but then it enters a loop. I think maybe the call inside |
Any update on this? I find I'm having to avoid writing certain tests as this makes my tests flaky. Sometimes it find the element and other times it errors so I can't rely on it. |
I've been using |
Bump. This is still a problem. It's not reproducible in a non-storybook environment so instrumented versions must be getting activated only in a storybook env. For example see the following 2 tests. They behave the same outside storybook env but behave differently in storybook env. Interactions fail in the first but they pass for the latter. Instrumented
vs.
If this will not be fixed (maybe because a limitation of instrumentation), then we should reeducate ourselves and our teams to use |
BTW upgrading to v7 was far from trivial so we gave up on that for now. |
@anilanar what issues did you have in the 7.0 migration? We're trying to make it as easy as possible, but there are indeed a fair number of changes. |
@IanVS We couldn't get past some build errors, most likely related to native esm support but we didn't analyze too deep. We just looked up if somebody already reported them and nobody did. Could be specific to our setup or could be specific to some libraries we use. e.g. might be a library that uses .mjs or package.json exports wrongly. Also hard to make an educated guess without looking deeper into what changes were done on the webpack builder internally in v7. We also have custom webpack/babel configs and we modify loaders, I guess that's typical for any serious/large web app. |
@IanVS Can you clarify whether if implementation of |
I'm not super familiar, honestly, but I do know that both the storybook addon-interactions and this package use |
@IanVS I analyzed the source code of I wish that was documented in the first place when interactions addon first emerged; then we wouldn't have adopted this tool, or we would have adopted it in a different manner. That would have saved us tremendous amount of time from debugging flaky/broken tests. For now, we decided to stop using |
@anilanar can you explain what you mean with changed semantics? What is it about those functions that Storybook changes in a way that you can't use them? We can tweak and fix things to be more compatible, but right now we don't have sufficient information. By the way, you can totally use the non-Storybook version of those packages in your play functions. You just won't be able to use the interactions panel. |
@ghengeveld Sure. testing-library's Based on those semantics, we have additional internal testing utility functions: e.g. one that waits for a button to become enabled, In comparison, instrumented |
I'm not seeing this as a problem anymore, is anyone else still having issues with current versions? |
storybookjs/storybook@501b7e1 might be the fix. |
Describe the bug
I have a story which is testing a validation error. It triggers the error, waits for an element with a role of
alert
, and then tabs out of the field so I can snapshot a red border on the input. This works fine if I import directly from@testing-library
, but I get an error ofUnable to find role="alert"
, and the DOM it prints out sure enough does not include the alert. But it occurs almost immediately, even if I try to add a large timeout, such asawait waitFor(() => screen.getByRole('alert'), { timeout: 6000 });
.Steps to reproduce the behavior
Trigger an action that takes a moment to add an element, and use
waitFor
to proceed only after that element is found.Expected behavior
The behavior should match that of waitFor from
@testing-library/react
.Screenshots and/or logs
N/A
Environment
Additional context
Let me know if I should create a reproduction for this.
The text was updated successfully, but these errors were encountered: