diff --git a/code/core/src/csf-tools/CsfFile.test.ts b/code/core/src/csf-tools/CsfFile.test.ts index 18d441e666b8..d7194edcdf2e 100644 --- a/code/core/src/csf-tools/CsfFile.test.ts +++ b/code/core/src/csf-tools/CsfFile.test.ts @@ -81,6 +81,7 @@ describe('CsfFile', () => { stories: - id: foo-bar--a name: A + localName: A parameters: __id: foo-bar--a __stats: @@ -94,6 +95,7 @@ describe('CsfFile', () => { moduleMock: false - id: foo-bar--b name: B + localName: B parameters: __id: foo-bar--b __stats: @@ -790,6 +792,7 @@ describe('CsfFile', () => { stories: - id: foo-bar--a name: A + localName: default __stats: play: false render: false @@ -801,6 +804,7 @@ describe('CsfFile', () => { moduleMock: false - id: foo-bar--b name: B + localName: B __stats: play: false render: false @@ -878,6 +882,7 @@ describe('CsfFile', () => { stories: - id: foo-bar--a name: A + localName: A parameters: __id: foo-bar--a __stats: diff --git a/code/core/src/csf-tools/CsfFile.ts b/code/core/src/csf-tools/CsfFile.ts index d9859da5cecb..d1cafb31bb64 100644 --- a/code/core/src/csf-tools/CsfFile.ts +++ b/code/core/src/csf-tools/CsfFile.ts @@ -190,6 +190,7 @@ export interface StaticMeta export interface StaticStory extends Pick { id: string; + localName?: string; __stats: IndexInputStats; } @@ -488,6 +489,7 @@ export class CsfFile { node.specifiers.forEach((specifier) => { if (t.isExportSpecifier(specifier) && t.isIdentifier(specifier.exported)) { const { name: exportName } = specifier.exported; + const { name: localName } = specifier.local; const decl = t.isProgram(parent) ? findVarInitialization(specifier.local.name, parent) : specifier.local; @@ -515,6 +517,7 @@ export class CsfFile { self._stories[exportName] = { id: 'FIXME', name: exportName, + localName, parameters: {}, __stats: {}, }; diff --git a/code/core/src/csf-tools/vitest-plugin/transformer.test.ts b/code/core/src/csf-tools/vitest-plugin/transformer.test.ts index 84d9ac273718..5b030ac19c73 100644 --- a/code/core/src/csf-tools/vitest-plugin/transformer.test.ts +++ b/code/core/src/csf-tools/vitest-plugin/transformer.test.ts @@ -296,6 +296,40 @@ describe('transformer', () => { `); }); + it('should add test statement to const declared renamed exported stories', async () => { + const code = ` + export default {}; + const Primary = { + args: { + label: 'Primary Button', + }, + }; + + export { Primary as PrimaryStory }; + `; + + const result = await transform({ code }); + + expect(result.code).toMatchInlineSnapshot(` + import { test as _test, expect as _expect } from "vitest"; + import { testStory as _testStory } from "@storybook/experimental-addon-test/internal/test-utils"; + const _meta = { + title: "automatic/calculated/title" + }; + export default _meta; + const Primary = { + args: { + label: 'Primary Button' + } + }; + export { Primary as PrimaryStory }; + const _isRunningFromThisFile = import.meta.url.includes(globalThis.__vitest_worker__.filepath ?? _expect.getState().testPath); + if (_isRunningFromThisFile) { + _test("PrimaryStory", _testStory("PrimaryStory", Primary, _meta, [])); + } + `); + }); + it('should add tests for multiple stories', async () => { const code = ` export default {}; diff --git a/code/core/src/csf-tools/vitest-plugin/transformer.ts b/code/core/src/csf-tools/vitest-plugin/transformer.ts index 778ea752f1d0..677235975cb1 100644 --- a/code/core/src/csf-tools/vitest-plugin/transformer.ts +++ b/code/core/src/csf-tools/vitest-plugin/transformer.ts @@ -201,10 +201,12 @@ export async function vitestTransform({ ast.program.body.push(isRunningFromThisFileDeclaration); const getTestStatementForStory = ({ + localName, exportName, testTitle, node, }: { + localName: string; exportName: string; testTitle: string; node: t.Node; @@ -215,7 +217,7 @@ export async function vitestTransform({ t.stringLiteral(testTitle), t.callExpression(testStoryId, [ t.stringLiteral(exportName), - t.identifier(exportName), + t.identifier(localName), t.identifier(metaExportName), skipTagsId, ]), @@ -241,9 +243,10 @@ export async function vitestTransform({ return; } + const localName = parsed._stories[exportName].localName ?? exportName; // use the story's name as the test title for vitest, and fallback to exportName const testTitle = parsed._stories[exportName].name ?? exportName; - return getTestStatementForStory({ testTitle, exportName, node }); + return getTestStatementForStory({ testTitle, localName, exportName, node }); }) .filter((st) => !!st) as t.ExpressionStatement[];