Merge pull request #21517 from Foxhoundn/patch-1

Documentation: Updated TS documentation for re-using play functions
storybookjs · Nov 28, 2023 · dda0507 · dda0507
2 parents 1c943d9 + 7f67fa8
commit dda0507
Show file tree

Hide file tree

Showing 4 changed files with 16 additions and 16 deletions.
diff --git a/docs/snippets/common/my-component-play-function-composition.js.mdx b/docs/snippets/common/my-component-play-function-composition.js.mdx
@@ -30,12 +30,12 @@ export const SecondStory = {
 };
 
 export const CombinedStories = {
-  play: async ({ canvasElement }) => {
-    const canvas = within(canvasElement);
+  play: async (context) => {
+    const canvas = within(context.canvasElement);
 
     // Runs the FirstStory and Second story play function before running this story's play function
-    await FirstStory.play({ canvasElement });
-    await SecondStory.play({ canvasElement });
+    await FirstStory.play(context);
+    await SecondStory.play(context);
     await userEvent.type(canvas.getByTestId('another-element'), 'random value');
   },
 };

diff --git a/docs/snippets/common/my-component-play-function-composition.ts.mdx b/docs/snippets/common/my-component-play-function-composition.ts.mdx
@@ -36,12 +36,12 @@ export const SecondStory: Story = {
 };
 
 export const CombinedStories: Story = {
-  play: async ({ canvasElement }) => {
-    const canvas = within(canvasElement);
+  play: async (context) => {
+    const canvas = within(context.canvasElement);
 
     // Runs the FirstStory and Second story play function before running this story's play function
-    await FirstStory.play({ canvasElement });
-    await SecondStory.play({ canvasElement });
+    await FirstStory.play(context);
+    await SecondStory.play(context);
     await userEvent.type(canvas.getByTestId('another-element'), 'random value');
   },
 };

diff --git a/docs/snippets/web-components/my-component-play-function-composition.js.mdx b/docs/snippets/web-components/my-component-play-function-composition.js.mdx
@@ -28,12 +28,12 @@ export const SecondStory = {
 };
 
 export const CombinedStories = {
-  play: async ({ canvasElement }) => {
-    const canvas = within(canvasElement);
+  play: async (context) => {
+    const canvas = within(context.canvasElement);
 
     // Runs the FirstStory and Second story play function before running this story's play function
-    await FirstStory.play({ canvasElement });
-    await SecondStory.play({ canvasElement });
+    await FirstStory.play(context);
+    await SecondStory.play(context);
     await userEvent.type(canvas.getByTestId('another-element'), 'random value');
   },
 };

diff --git a/docs/snippets/web-components/my-component-play-function-composition.ts.mdx b/docs/snippets/web-components/my-component-play-function-composition.ts.mdx
@@ -32,12 +32,12 @@ export const SecondStory: Story = {
 };
 
 export const CombinedStories: Story = {
-  play: async ({ canvasElement }) => {
-    const canvas = within(canvasElement);
+  play: async (context) => {
+    const canvas = within(context.canvasElement);
 
     // Runs the FirstStory and Second story play function before running this story's play function
-    await FirstStory.play({ canvasElement });
-    await SecondStory.play({ canvasElement });
+    await FirstStory.play(context);
+    await SecondStory.play(context);
     await userEvent.type(canvas.getByTestId('another-element'), 'random value');
   },
 };