Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Vitest plugin: Fix renamed export stories #29250

Merged
merged 3 commits into from
Oct 2, 2024
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions code/core/src/csf-tools/CsfFile.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -81,6 +81,7 @@ describe('CsfFile', () => {
stories:
- id: foo-bar--a
name: A
localName: A
parameters:
__id: foo-bar--a
__stats:
Expand All @@ -94,6 +95,7 @@ describe('CsfFile', () => {
moduleMock: false
- id: foo-bar--b
name: B
localName: B
parameters:
__id: foo-bar--b
__stats:
Expand Down Expand Up @@ -790,6 +792,7 @@ describe('CsfFile', () => {
stories:
- id: foo-bar--a
name: A
localName: default
__stats:
play: false
render: false
Expand All @@ -801,6 +804,7 @@ describe('CsfFile', () => {
moduleMock: false
- id: foo-bar--b
name: B
localName: B
__stats:
play: false
render: false
Expand Down Expand Up @@ -878,6 +882,7 @@ describe('CsfFile', () => {
stories:
- id: foo-bar--a
name: A
localName: A
parameters:
__id: foo-bar--a
__stats:
Expand Down
3 changes: 3 additions & 0 deletions code/core/src/csf-tools/CsfFile.ts
Original file line number Diff line number Diff line change
Expand Up @@ -190,6 +190,7 @@ export interface StaticMeta

export interface StaticStory extends Pick<StoryAnnotations, 'name' | 'parameters' | 'tags'> {
id: string;
localName?: string;
__stats: IndexInputStats;
}

Expand Down Expand Up @@ -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;
Expand Down Expand Up @@ -515,6 +517,7 @@ export class CsfFile {
self._stories[exportName] = {
id: 'FIXME',
name: exportName,
localName,
parameters: {},
__stats: {},
};
Expand Down
34 changes: 34 additions & 0 deletions code/core/src/csf-tools/vitest-plugin/transformer.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -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 {};
Expand Down
8 changes: 6 additions & 2 deletions code/core/src/csf-tools/vitest-plugin/transformer.ts
Original file line number Diff line number Diff line change
Expand Up @@ -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;
Expand All @@ -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,
]),
Expand Down Expand Up @@ -243,7 +245,9 @@ export async function vitestTransform({

// 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 });
const decl = parsed._storyExports[exportName];
const localName = parsed._stories[exportName].localName ?? exportName;
return getTestStatementForStory({ testTitle, localName, exportName, node });
})
.filter((st) => !!st) as t.ExpressionStatement[];

Expand Down