From 462e5a35fe9333cc4d3b7b6aa20fcc9767de9eb0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Stanis=C5=82aw?= <sjwilczynski@users.noreply.github.com>
Date: Tue, 9 May 2023 12:45:32 +0000
Subject: [PATCH 1/2] feat(csf-testing-utils): expose id of the story

---
 .../modules/store/csf/testing-utils/index.ts  |  1 +
 code/lib/types/src/modules/composedStory.ts   |  4 ++--
 .../react/src/__test__/internals.test.tsx     | 19 +++++++++++++++++++
 3 files changed, 22 insertions(+), 2 deletions(-)

diff --git a/code/lib/preview-api/src/modules/store/csf/testing-utils/index.ts b/code/lib/preview-api/src/modules/store/csf/testing-utils/index.ts
index a29d6427ea2a..40fcddcb6e35 100644
--- a/code/lib/preview-api/src/modules/store/csf/testing-utils/index.ts
+++ b/code/lib/preview-api/src/modules/store/csf/testing-utils/index.ts
@@ -88,6 +88,7 @@ export function composeStory<TRenderer extends Renderer = Renderer, TArgs extend
   composedStory.args = story.initialArgs as Partial<TArgs>;
   composedStory.play = story.playFunction as ComposedStoryPlayFn<TRenderer, Partial<TArgs>>;
   composedStory.parameters = story.parameters as Parameters;
+  composedStory.id = story.id;
 
   return composedStory;
 }
diff --git a/code/lib/types/src/modules/composedStory.ts b/code/lib/types/src/modules/composedStory.ts
index a5c37cc121a5..01bc65263d70 100644
--- a/code/lib/types/src/modules/composedStory.ts
+++ b/code/lib/types/src/modules/composedStory.ts
@@ -1,6 +1,6 @@
 /* eslint-disable @typescript-eslint/naming-convention */
 
-import type { Renderer } from '@storybook/csf';
+import type { Renderer, StoryId } from '@storybook/csf';
 
 import type {
   AnnotatedStoryFn,
@@ -33,7 +33,7 @@ export type ComposedStoryPlayFn<TRenderer extends Renderer = Renderer, TArgs = A
 export type PreparedStoryFn<TRenderer extends Renderer = Renderer, TArgs = Args> = AnnotatedStoryFn<
   TRenderer,
   TArgs
-> & { play: ComposedStoryPlayFn<TRenderer, TArgs>; args: TArgs };
+> & { play: ComposedStoryPlayFn<TRenderer, TArgs>; args: TArgs } & { id: StoryId };
 
 export type ComposedStory<TRenderer extends Renderer = Renderer, TArgs = Args> =
   | StoryFn<TRenderer, TArgs>
diff --git a/code/renderers/react/src/__test__/internals.test.tsx b/code/renderers/react/src/__test__/internals.test.tsx
index 9f5a05b993d9..6550e03dddbb 100644
--- a/code/renderers/react/src/__test__/internals.test.tsx
+++ b/code/renderers/react/src/__test__/internals.test.tsx
@@ -24,6 +24,25 @@ test('returns composed parameters from story', () => {
   );
 });
 
+describe('Id of the story', () => {
+  test('is exposed correctly when composeStories is used', () => {
+    expect(CSF2StoryWithParamsAndDecorator.id).toBe(
+      'example-button--csf-2-story-with-params-and-decorator'
+    );
+  });
+  test('is exposed correctly when composeStory is used and exportsName is passed', () => {
+    const exportName = Object.entries(stories).filter(
+      ([_, story]) => story === stories.CSF3Primary
+    )[0][0];
+    const Primary = composeStory(stories.CSF3Primary, stories.default, {}, exportName);
+    expect(Primary.id).toBe('example-button--csf-3-primary');
+  });
+  test("is not unique when composeStory is used and exportsName isn't passed", () => {
+    const Primary = composeStory(stories.CSF3Primary, stories.default);
+    expect(Primary.id).toContain('unknown');
+  });
+});
+
 // common in addons that need to communicate between manager and preview
 test('should pass with decorators that need addons channel', () => {
   const PrimaryWithChannels = composeStory(stories.CSF3Primary, stories.default, {

From 1ff7aa30c3ea81189644af8703fad3676503d2d8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Stanis=C5=82aw?= <sjwilczynski@users.noreply.github.com>
Date: Wed, 10 May 2023 14:58:02 +0200
Subject: [PATCH 2/2] Update code/lib/types/src/modules/composedStory.ts

Co-authored-by: Yann Braga <yannbf@gmail.com>
---
 code/lib/types/src/modules/composedStory.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/code/lib/types/src/modules/composedStory.ts b/code/lib/types/src/modules/composedStory.ts
index 01bc65263d70..ce31138bac20 100644
--- a/code/lib/types/src/modules/composedStory.ts
+++ b/code/lib/types/src/modules/composedStory.ts
@@ -33,7 +33,7 @@ export type ComposedStoryPlayFn<TRenderer extends Renderer = Renderer, TArgs = A
 export type PreparedStoryFn<TRenderer extends Renderer = Renderer, TArgs = Args> = AnnotatedStoryFn<
   TRenderer,
   TArgs
-> & { play: ComposedStoryPlayFn<TRenderer, TArgs>; args: TArgs } & { id: StoryId };
+> & { play: ComposedStoryPlayFn<TRenderer, TArgs>; args: TArgs; id: StoryId };
 
 export type ComposedStory<TRenderer extends Renderer = Renderer, TArgs = Args> =
   | StoryFn<TRenderer, TArgs>