From 9d1a1fbdeb746a15c147bf4e65cc8d2c4a0ecc18 Mon Sep 17 00:00:00 2001 From: Foxhoundn <8861481+Foxhoundn@users.noreply.github.com> Date: Thu, 9 Mar 2023 14:45:39 +0100 Subject: [PATCH 1/2] Updated TS documentation for re-using play functions The current documentation introduces typescript errors when the rest of the context object is not passed to the re-used play functions. --- .../common/my-component-play-function-composition.ts.mdx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/snippets/common/my-component-play-function-composition.ts.mdx b/docs/snippets/common/my-component-play-function-composition.ts.mdx index 2d03468daae2..5345eabaca5f 100644 --- a/docs/snippets/common/my-component-play-function-composition.ts.mdx +++ b/docs/snippets/common/my-component-play-function-composition.ts.mdx @@ -37,12 +37,12 @@ export const SecondStory: Story = { }; export const CombinedStories: Story = { - play: async ({ canvasElement }) => { + play: async ({ canvasElement, ...rest }) => { const canvas = within(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({ canvasElement, ...rest }); + await SecondStory.play({ canvasElement, ...rest }); await userEvent.type(canvas.getByTestId('another-element'), 'random value'); }, }; From 3b88fbfd85186cdcc162589049424dfdae8c0a5d Mon Sep 17 00:00:00 2001 From: Foxhoundn <8861481+Foxhoundn@users.noreply.github.com> Date: Thu, 9 Mar 2023 14:57:13 +0100 Subject: [PATCH 2/2] Updated also JS & Web-components documentaitons. Using full `context` instead of destruct. --- .../common/my-component-play-function-composition.js.mdx | 8 ++++---- .../common/my-component-play-function-composition.ts.mdx | 8 ++++---- .../my-component-play-function-composition.js.mdx | 8 ++++---- .../my-component-play-function-composition.ts.mdx | 8 ++++---- 4 files changed, 16 insertions(+), 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 index 9fbff54177bc..18b14413c1a9 100644 --- a/docs/snippets/common/my-component-play-function-composition.js.mdx +++ b/docs/snippets/common/my-component-play-function-composition.js.mdx @@ -31,12 +31,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 index 5345eabaca5f..12bd901d6001 100644 --- a/docs/snippets/common/my-component-play-function-composition.ts.mdx +++ b/docs/snippets/common/my-component-play-function-composition.ts.mdx @@ -37,12 +37,12 @@ export const SecondStory: Story = { }; export const CombinedStories: Story = { - play: async ({ canvasElement, ...rest }) => { - 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, ...rest }); - await SecondStory.play({ canvasElement, ...rest }); + 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 index b009399d0375..cd8312d1e424 100644 --- a/docs/snippets/web-components/my-component-play-function-composition.js.mdx +++ b/docs/snippets/web-components/my-component-play-function-composition.js.mdx @@ -29,12 +29,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 index e4b63840c044..e2e24ca1ac57 100644 --- a/docs/snippets/web-components/my-component-play-function-composition.ts.mdx +++ b/docs/snippets/web-components/my-component-play-function-composition.ts.mdx @@ -34,12 +34,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'); }, };