storybookjs/storybook

[Bug]: Interactions panel fails when stepping through "waitForElementToBeRemoved" as the element's been removed

Ouverte

#21 520 ouverte le 9 mars 2023

 (0 commentaire) (0 réaction) (0 personne assignée)TypeScript (10 058 forks)batch import
addon: interactionsbughelp wantedsev:S3

Métriques du dépôt

Stars
 (89 909 étoiles)
Métriques de merge PR
 (Merge moyen 7j 22h) (184 PRs mergées en 30 j)

Description

Describe the bug

This is tricky.

Suppose there's an element in a page, which gets removed in 500ms (e.g. loading spinner). When writing a play function that asserts for that element to be removed, like so:

play: async ({ canvasElement, step }) => {
    const canvas = within(canvasElement);
    await waitForElementToBeRemoved(await canvas.findByText('loading...'))
    await userEvent.click(getByRole('button')) // button is only visible after spinner is gone!
},

If you click to start on the step debugger, by the time you think of clicking on the next step, the spinner is already gone. This means that stepping through the steps will fail.

I'm not sure what's a solution to this scenario, or even if there is a good solution!

To Reproduce

No response

System

No response

Additional context

No response

Guide contributeur