Merge pull request #22308 from storybookjs/fix/testing-react-default-…

…annotations React: Use correct default annotations for composeStories
storybookjs · May 9, 2023 · ee73c10 · ee73c10
1 parent b926df4
commit ee73c10
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 8 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
@@ -21,7 +21,7 @@ import { normalizeComponentAnnotations } from '../normalizeComponentAnnotations'
 import { getValuesFromArgTypes } from '../getValuesFromArgTypes';
 import { normalizeProjectAnnotations } from '../normalizeProjectAnnotations';
 
-let GLOBAL_STORYBOOK_PROJECT_ANNOTATIONS = {};
+let GLOBAL_STORYBOOK_PROJECT_ANNOTATIONS = composeConfigs([]);
 
 export function setProjectAnnotations<TRenderer extends Renderer = Renderer>(
   projectAnnotations: ProjectAnnotations<TRenderer> | ProjectAnnotations<TRenderer>[]
@@ -33,7 +33,7 @@ export function setProjectAnnotations<TRenderer extends Renderer = Renderer>(
 export function composeStory<TRenderer extends Renderer = Renderer, TArgs extends Args = Args>(
   storyAnnotations: LegacyStoryAnnotationsOrFn<TRenderer>,
   componentAnnotations: ComponentAnnotations<TRenderer, TArgs>,
-  projectAnnotations: ProjectAnnotations<TRenderer> = GLOBAL_STORYBOOK_PROJECT_ANNOTATIONS,
+  projectAnnotations: ProjectAnnotations<TRenderer> = GLOBAL_STORYBOOK_PROJECT_ANNOTATIONS as ProjectAnnotations<TRenderer>,
   defaultConfig: ProjectAnnotations<TRenderer> = {},
   exportsName?: string
 ): PreparedStoryFn<TRenderer, Partial<TArgs>> {
@@ -60,7 +60,7 @@ export function composeStory<TRenderer extends Renderer = Renderer, TArgs extend
     normalizedComponentAnnotations
   );
 
-  const normalizedProjectAnnotations = normalizeProjectAnnotations({
+  const normalizedProjectAnnotations = normalizeProjectAnnotations<TRenderer>({
     ...projectAnnotations,
     ...defaultConfig,
   });

diff --git a/code/renderers/react/src/__test__/composeStories.test.tsx b/code/renderers/react/src/__test__/composeStories.test.tsx
@@ -9,8 +9,6 @@ import { setProjectAnnotations, composeStories, composeStory } from '..';
 import type { Button } from './Button';
 import * as stories from './Button.stories';
 
-setProjectAnnotations([]);
-
 // example with composeStories, returns an object with all stories composed with args/decorators
 const { CSF3Primary } = composeStories(stories);
 
@@ -43,22 +41,28 @@ test('reuses args from composeStories', () => {
   expect(buttonElement).not.toBeNull();
 });
 
-describe('GlobalConfig', () => {
-  test('renders with default globalConfig', () => {
+describe('projectAnnotations', () => {
+  test('renders with default projectAnnotations', () => {
     const WithEnglishText = composeStory(stories.CSF2StoryWithLocale, stories.default);
     const { getByText } = render(<WithEnglishText />);
     const buttonElement = getByText('Hello!');
     expect(buttonElement).not.toBeNull();
   });
 
-  test('renders with custom globalConfig', () => {
+  test('renders with custom projectAnnotations via composeStory params', () => {
     const WithPortugueseText = composeStory(stories.CSF2StoryWithLocale, stories.default, {
       globalTypes: { locale: { defaultValue: 'pt' } } as any,
     });
     const { getByText } = render(<WithPortugueseText />);
     const buttonElement = getByText('Olá!');
     expect(buttonElement).not.toBeNull();
   });
+
+  test('renders with custom projectAnnotations via setProjectAnnotations', () => {
+    setProjectAnnotations([{ parameters: { injected: true } }]);
+    const Story = composeStory(stories.CSF2StoryWithLocale, stories.default);
+    expect(Story.parameters?.injected).toBe(true);
+  });
 });
 
 describe('CSF3', () => {