storybookjs / storybook

Storybook is the industry standard workshop for building, documenting, and testing UI components in isolation
https://storybook.js.org
MIT License
83.77k stars 9.18k forks source link

[Bug]: await calls not properly grouped in step functions (Angular 17) #26909

Open fadler82 opened 3 months ago

fadler82 commented 3 months ago

Describe the bug

When using **findBy*** in a step of a story, all following assertions are being excluded from the step and are shown as own steps.

export const StepBugReproduction: Story = {
  play: async ({ canvasElement, step }) => {
    const canvas = within(canvasElement);

    await step('Working step with getBy', async () => {
      const btn = canvas.getByRole('button', { name: 'Button' });
      expect(btn).toBeInTheDocument();

      await userEvent.click(btn);
    });

    await step('Not working step with findBy', async () => {
      const btn = await canvas.findByRole('button', { name: 'Button' });
      expect(btn).toBeInTheDocument();

      await userEvent.click(btn);
    });
  },

Bildschirmfoto 2024-04-22 um 14 10 02

Discord thread: https://discord.com/channels/486522875931656193/1106615915321229372/1231895876335833139

To Reproduce

https://stackblitz.com/edit/github-nc9jjn?file=src%2Fstories%2Fbutton.stories.ts

System

Storybook Environment Info:

  System:
    OS: macOS 14.4.1
    CPU: (8) arm64 Apple M3
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.12.2 - ~/.nvm/versions/node/v20.12.2/bin/node
    npm: 10.5.0 - ~/.nvm/versions/node/v20.12.2/bin/npm <----- active
  Browsers:
    Chrome: 124.0.6367.60
    Safari: 17.4.1
  npmPackages:
    @storybook/addon-coverage: ^1.0.1 => 1.0.1 
    @storybook/addon-docs: ^8.0.8 => 8.0.8 
    @storybook/addon-essentials: ^8.0.8 => 8.0.8 
    @storybook/addon-interactions: ^8.0.8 => 8.0.8 
    @storybook/addon-links: ^8.0.8 => 8.0.8 
    @storybook/angular: ^8.0.8 => 8.0.8 
    @storybook/blocks: ^8.0.8 => 8.0.8 
    @storybook/test: ^8.0.8 => 8.0.8 
    @storybook/test-runner: ^0.17.0 => 0.17.0 
    chromatic: ^11.3.0 => 11.3.0 
    msw-storybook-addon: ^2.0.0 => 2.0.0 
    storybook: ^8.0.8 => 8.0.8

Additional context

No response

fadler82 commented 3 months ago

I guess this not only applies to findBy but all awaited calls inside a step, like userEvents and expect