From 52875287be20c95eb1561fa8b6238d9b41335082 Mon Sep 17 00:00:00 2001 From: Michael Shilman Date: Tue, 1 Feb 2022 07:52:57 +0800 Subject: [PATCH] Merge pull request #17376 from jonbeller/patch-1 Update interaction-testing.md --- docs/writing-tests/interaction-testing.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/writing-tests/interaction-testing.md b/docs/writing-tests/interaction-testing.md index 5d663d10c50f..2fb63362a629 100644 --- a/docs/writing-tests/interaction-testing.md +++ b/docs/writing-tests/interaction-testing.md @@ -2,9 +2,9 @@ title: 'Interaction tests' --- -As you build more complex UIs like pages, components become responsible for more than just rendering the UI. They fetch data and manage state. Interaction tests allow you to verify these functional aspects of UI. +As you build more complex UIs like pages, components become responsible for more than just rendering the UI. They fetch data and manage state. Interaction tests allow you to verify these functional aspects of UIs. -In a nutshell, you start by supplying the appropriate props for the initial state of a component. Then simulate user behavior such as clicks and form entries. Finally, test expectations to check whether the UI and component state update correctly. +In a nutshell, you start by supplying the appropriate props for the initial state of a component. Then simulate user behavior such as clicks and form entries. Finally, check whether the UI and component state update correctly. ![Storybook interaction testing](./storybook-interaction-tests.gif) @@ -12,7 +12,7 @@ In a nutshell, you start by supplying the appropriate props for the initial stat You can set up interaction testing in Storybook using the `play` function and [`@storybook/addon-interactions`](https://storybook.js.org/addons/@storybook/addon-interactions/). -- [`play`](../writing-stories/play-function.md) function is a convenient helper method to help test use cases that would otherwise require manual interaction from a user. They are small snippets of code that run after the story finishes rendering. +- The [`play`](../writing-stories/play-function.md) function is a small snippet of code that runs after a story finishes rendering. You can use this to test user workflows. - [`@storybook/addon-interactions`](/addons/@storybook/addon-interactions/) includes helper utilities and a playback interface that simulates user behavior in the browser. It’s powered Testing Library and includes convenient instrumentation for debugging.