Skip to content

Latest commit

 

History

History
39 lines (26 loc) · 1.61 KB

await-interactions.md

File metadata and controls

39 lines (26 loc) · 1.61 KB
Raw

await-interactions

Included in these configurations:

  • addon-interactions
  • flat/addon-interactions
  • recommended
  • flat/recommended

Rule Details

Storybook provides an instrumented version of testing library in the @storybook/test library (formerly available in @storybook/testing-library library). When writing interactions, make sure to await them, so that addon-interactions can intercept these helper functions and allow you to step through them when debugging.

Examples of incorrect code for this rule:

import { within, userEvent } from '@storybook/test' // or from the legacy package "@storybook/testing-library";

MyStory.play = (context) => {
  const canvas = within(context.canvasElement)
  // not awaited!
  userEvent.click(canvas.getByRole('button'))
}

Examples of correct code for this rule:

import { within, userEvent } from '@storybook/test' // or from the legacy package "@storybook/testing-library";

MyStory.play = async (context) => {
  const canvas = within(context.canvasElement)
  // awaited 👍
  await userEvent.click(canvas.getByRole('button'))
}

When Not To Use It

This rule should not be applied in test files. Please ensure you are defining the storybook rules only for story files. You can see more details here.