From 9f43528d5e8ac98c317b984566650e7ff158a56f Mon Sep 17 00:00:00 2001 From: Yann Braga Date: Fri, 30 Jun 2023 09:19:22 +0200 Subject: [PATCH 1/3] fix pnp paths logic in storybook metadata --- code/lib/telemetry/src/get-framework-info.ts | 19 ++++++++++++------- 1 file changed, 12 insertions(+), 7 deletions(-) diff --git a/code/lib/telemetry/src/get-framework-info.ts b/code/lib/telemetry/src/get-framework-info.ts index c5e706166471..33c7d5675d00 100644 --- a/code/lib/telemetry/src/get-framework-info.ts +++ b/code/lib/telemetry/src/get-framework-info.ts @@ -49,21 +49,26 @@ export const getFrameworkPackageName = (mainConfig?: StorybookConfig) => { }; export async function getFrameworkInfo(mainConfig: StorybookConfig) { - if (!mainConfig.framework) return {}; + if (!mainConfig?.framework) return {}; - const frameworkName = getFrameworkPackageName(mainConfig); - if (!frameworkName) return {}; - const frameworkOptions = - typeof mainConfig.framework === 'object' ? mainConfig.framework.options : {}; + const rawName = + typeof mainConfig.framework === 'string' ? mainConfig.framework : mainConfig.framework?.name; + if (!rawName) return {}; - const frameworkPackageJson = await getActualPackageJson(frameworkName); + const frameworkPackageJson = await getActualPackageJson(rawName); const builder = findMatchingPackage(frameworkPackageJson, knownBuilders); const renderer = findMatchingPackage(frameworkPackageJson, knownRenderers); + // parse framework name and strip off pnp paths etc. + const sanitizedFrameworkName = getFrameworkPackageName(mainConfig); + + const frameworkOptions = + typeof mainConfig.framework === 'object' ? mainConfig.framework.options : {}; + return { framework: { - name: frameworkName, + name: sanitizedFrameworkName, options: frameworkOptions, }, builder, From 78ecb857b74c3433020ac66b0ec49c3754379f51 Mon Sep 17 00:00:00 2001 From: Norbert de Langen Date: Fri, 30 Jun 2023 11:41:08 +0200 Subject: [PATCH 2/3] fix type issues --- code/lib/telemetry/src/get-framework-info.ts | 19 ++++++++----------- 1 file changed, 8 insertions(+), 11 deletions(-) diff --git a/code/lib/telemetry/src/get-framework-info.ts b/code/lib/telemetry/src/get-framework-info.ts index 33c7d5675d00..6a79694d5e24 100644 --- a/code/lib/telemetry/src/get-framework-info.ts +++ b/code/lib/telemetry/src/get-framework-info.ts @@ -33,14 +33,7 @@ function findMatchingPackage(packageJson: PackageJson, suffixes: string[]) { return suffixes.map((suffix) => `@storybook/${suffix}`).find((pkg) => allDependencies[pkg]); } -export const getFrameworkPackageName = (mainConfig?: StorybookConfig) => { - const packageNameOrPath = - typeof mainConfig?.framework === 'string' ? mainConfig.framework : mainConfig?.framework?.name; - - if (!packageNameOrPath) { - return null; - } - +export const getFrameworkPackageName = (packageNameOrPath: string) => { const normalizedPath = path.normalize(packageNameOrPath).replace(new RegExp(/\\/, 'g'), '/'); const knownFramework = Object.keys(frameworkPackages).find((pkg) => normalizedPath.endsWith(pkg)); @@ -49,11 +42,15 @@ export const getFrameworkPackageName = (mainConfig?: StorybookConfig) => { }; export async function getFrameworkInfo(mainConfig: StorybookConfig) { - if (!mainConfig?.framework) return {}; + if (!mainConfig?.framework) { + return {}; + } const rawName = typeof mainConfig.framework === 'string' ? mainConfig.framework : mainConfig.framework?.name; - if (!rawName) return {}; + if (!rawName) { + return {}; + } const frameworkPackageJson = await getActualPackageJson(rawName); @@ -61,7 +58,7 @@ export async function getFrameworkInfo(mainConfig: StorybookConfig) { const renderer = findMatchingPackage(frameworkPackageJson, knownRenderers); // parse framework name and strip off pnp paths etc. - const sanitizedFrameworkName = getFrameworkPackageName(mainConfig); + const sanitizedFrameworkName = getFrameworkPackageName(rawName); const frameworkOptions = typeof mainConfig.framework === 'object' ? mainConfig.framework.options : {}; From 4cefbb8a2b63314453ad5f7a4d1d8e3479607359 Mon Sep 17 00:00:00 2001 From: Yann Braga Date: Fri, 30 Jun 2023 13:11:03 +0200 Subject: [PATCH 3/3] add tests --- .../telemetry/src/get-framework-info.test.ts | 55 +++++++++++++++++++ code/lib/telemetry/src/get-framework-info.ts | 5 +- 2 files changed, 59 insertions(+), 1 deletion(-) create mode 100644 code/lib/telemetry/src/get-framework-info.test.ts diff --git a/code/lib/telemetry/src/get-framework-info.test.ts b/code/lib/telemetry/src/get-framework-info.test.ts new file mode 100644 index 000000000000..97a0ffe15c91 --- /dev/null +++ b/code/lib/telemetry/src/get-framework-info.test.ts @@ -0,0 +1,55 @@ +import type { StorybookConfig } from '@storybook/types'; +import { getFrameworkInfo } from './get-framework-info'; +import { getActualPackageJson } from './package-json'; + +jest.mock('./package-json', () => ({ + getActualPackageJson: jest.fn(), +})); + +describe('getFrameworkInfo', () => { + it('should return an empty object if mainConfig.framework is undefined', async () => { + const result = await getFrameworkInfo({} as StorybookConfig); + expect(result).toEqual({}); + }); + + it('should return an empty object if mainConfig.framework name is undefined', async () => { + const result = await getFrameworkInfo({ framework: {} } as StorybookConfig); + expect(result).toEqual({}); + }); + + it('should call getActualPackageJson with the correct package name', async () => { + const packageName = '@storybook/react'; + const framework = { name: packageName }; + await getFrameworkInfo({ framework } as StorybookConfig); + expect(getActualPackageJson).toHaveBeenCalledWith(packageName); + }); + + it('should resolve the framework package json correctly and strip project paths in the metadata', async () => { + const packageName = '/path/to/project/@storybook/react'; + const framework = { name: packageName }; + const frameworkPackageJson = { + name: packageName, + dependencies: { + '@storybook/react': '7.0.0', + '@storybook/builder-vite': '7.0.0', + }, + }; + + jest.spyOn(process, 'cwd').mockReturnValue('/path/to/project'); + + (getActualPackageJson as jest.Mock).mockResolvedValueOnce(frameworkPackageJson); + + const result = await getFrameworkInfo({ framework } as StorybookConfig); + + expect(getActualPackageJson).toHaveBeenCalledWith(packageName); + + expect(result).toEqual({ + framework: { + name: '$SNIP/@storybook/react', + options: undefined, + }, + builder: '@storybook/builder-vite', + renderer: '@storybook/react', + }); + }); +}); diff --git a/code/lib/telemetry/src/get-framework-info.ts b/code/lib/telemetry/src/get-framework-info.ts index 6a79694d5e24..6716aa314510 100644 --- a/code/lib/telemetry/src/get-framework-info.ts +++ b/code/lib/telemetry/src/get-framework-info.ts @@ -54,12 +54,15 @@ export async function getFrameworkInfo(mainConfig: StorybookConfig) { const frameworkPackageJson = await getActualPackageJson(rawName); + if (!frameworkPackageJson) { + return {}; + } + const builder = findMatchingPackage(frameworkPackageJson, knownBuilders); const renderer = findMatchingPackage(frameworkPackageJson, knownRenderers); // parse framework name and strip off pnp paths etc. const sanitizedFrameworkName = getFrameworkPackageName(rawName); - const frameworkOptions = typeof mainConfig.framework === 'object' ? mainConfig.framework.options : {};