Interactions: Fix waitFor behavior while debugging

[ghengeveld]

Issue: #16872

What I did

Don't intercept calls inside callbacks, and bubble exceptions inside callbacks up to the parent rather than forwarding it to the next interceptable call. Show child interactions in log and display errors in the appropriate place. I got rid of the forwardedException concept entirely because it didn't (and can't) work with chained interactions (a().b()). Instead, any interaction that raises an exception will now appear in the log, even if it's not interceptable.

How to test

1 - Install @storybook/testing-library0.0.14--canary.23.ac6b056.0 in the oficcial-example project
2 - Run yarn start

• Is this testable with Jest or Chromatic screenshots? Yes
• Does this need a new example in the kitchen sink apps? No

If your answer is yes to any of these, please make sure to include it in your PR.

[nx-cloud]

☁️ Nx Cloud Report

CI is running/has finished running commands for commit 73416f7. As they complete they will appear below. Click to see the status, the terminal output, and the build insights.

📂 See all runs for this branch

---

✅ Successfully ran 1 target

• nx run-many --target=prepare --all --parallel=2 --max-parallel=15 -- --optimized

---

Sent with 💌 from NxCloud.

[yannbf]

Edit: Disregard this comment. Tested with wrong setup.

Awesome stuff @ghengeveld !

I noticed a possible issue in this story

Issue:

1 - waitFor is not visible, so it looks like the two last steps are child of userEvent
2 - when interacting, it fails

Steps to reproduce

1 - Click on Go to Start
2 - Click on Go forward 2x

[ghengeveld]

@yannbf you need storybookjs/testing-library#23 as well.

[yannbf]

@yannbf you need storybookjs/testing-library#23 as well.

Thanks! I updated the "How to test" section to reflect that.

[yannbf]

I just tested many scenarios and they all were pretty good, awesome work @ghengeveld 🙌

[ghengeveld]

@shilman This is ready to merge. I'll leave that up to your discretion.

[IanVS]

Will this be picked into 6.5 as well, or does it rely on 7.0 changes?

[yannbf]

Will this be picked into 6.5 as well, or does it rely on 7.0 changes?

This was just released in 7.0.0-alpha.3 and the corresponding fix of testing-library was released in 14.0.0-next.0 and the idea is to test it out enough to see if we bring it back to 6.5!

[IanVS]

Awesome, I was able to hack it into my 6.5 vite project, and it seems like it's working great. I did find one potential bug, though:

await expect(newRoles).toEqual(expect.arrayContaining([expect.objectContaining({ name: 'New role' })]));

crashes the whole storybook app (white screen of death) with the following error in the console:

Encountered two children with the same key, `[object Object]`.

[ghengeveld]

That looks like a key prop warming, but I doubt fixing it will resolve the white screen of death. Will investigate anyway.

[ghengeveld]

Awesome, I was able to hack it into my 6.5 vite project, and it seems like it's working great. I did find one potential bug, though:
...

Fixed here: #18499

[ghengeveld]

This should be backported to 6.5 along with #18499 in order to support storybookjs/testing-library#23