Take backslash paths into account

storybookjs · May 22, 2023 · 0dd0939 · 0dd0939
1 parent c357a9a
commit 0dd0939
Show file tree

Hide file tree

Showing 2 changed files with 41 additions and 7 deletions.
diff --git a/code/lib/cli/src/automigrate/helpers/mainConfigFile.test.ts b/code/lib/cli/src/automigrate/helpers/mainConfigFile.test.ts
@@ -45,6 +45,19 @@ describe('getBuilderPackageName', () => {
     expect(packageName).toBe(builderPackage);
   });
 
+  it('should return builder package name when core.builder.name contains windows backslash paths', () => {
+    const builderPackage = '@storybook/builder-webpack5';
+    const packageNameOrPath = 'c:\\path\\to\\@storybook\\builder-webpack5';
+    const mainConfig = {
+      core: {
+        builder: { name: packageNameOrPath },
+      },
+    };
+
+    const packageName = getBuilderPackageName(mainConfig as any);
+    expect(packageName).toBe(builderPackage);
+  });
+
   it(`should return package name or path when core.builder doesn't contain the name of a valid builder package`, () => {
     const packageNameOrPath = '@my-org/storybook-builder';
     const mainConfig = {
@@ -95,6 +108,17 @@ describe('getFrameworkPackageName', () => {
     expect(packageName).toBe(frameworkPackage);
   });
 
+  it('should return builder package name when framework.name contains windows backslash paths', () => {
+    const builderPackage = '@storybook/react-vite';
+    const packageNameOrPath = 'c:\\path\\to\\@storybook\\react-vite';
+    const mainConfig = {
+      framework: { name: packageNameOrPath },
+    };
+
+    const packageName = getFrameworkPackageName(mainConfig as any);
+    expect(packageName).toBe(builderPackage);
+  });
+
   it(`should return package name or path when framework does not contain the name of a valid framework package`, () => {
     const packageNameOrPath = '@my-org/storybook-framework';
     const mainConfig = {

diff --git a/code/lib/cli/src/automigrate/helpers/mainConfigFile.ts b/code/lib/cli/src/automigrate/helpers/mainConfigFile.ts
@@ -11,6 +11,7 @@ import { readConfig, writeConfig as writeConfigFile } from '@storybook/csf-tools
 import chalk from 'chalk';
 import semver from 'semver';
 import dedent from 'ts-dedent';
+import path from 'path';
 import type { JsPackageManager } from '../../js-package-manager';
 
 const logger = console;
@@ -24,10 +25,15 @@ export const getFrameworkPackageName = (mainConfig?: StorybookConfig) => {
   const packageNameOrPath =
     typeof mainConfig?.framework === 'string' ? mainConfig.framework : mainConfig?.framework?.name;
 
-  return packageNameOrPath
-    ? Object.keys(frameworkPackages).find((pkg) => packageNameOrPath.endsWith(pkg)) ??
-        packageNameOrPath
-    : null;
+  if (!packageNameOrPath) {
+    return null;
+  }
+
+  const normalizedPath = path.normalize(packageNameOrPath).replace(new RegExp(/\\/, 'g'), '/');
+
+  return (
+    Object.keys(frameworkPackages).find((pkg) => normalizedPath.endsWith(pkg)) || packageNameOrPath
+  );
 };
 
 /**
@@ -41,9 +47,13 @@ export const getBuilderPackageName = (mainConfig?: StorybookConfig) => {
       ? mainConfig.core.builder
       : mainConfig?.core?.builder?.name;
 
-  return packageNameOrPath
-    ? builderPackages.find((pkg) => packageNameOrPath.endsWith(pkg)) ?? packageNameOrPath
-    : null;
+  if (!packageNameOrPath) {
+    return null;
+  }
+
+  const normalizedPath = path.normalize(packageNameOrPath).replace(new RegExp(/\\/, 'g'), '/');
+
+  return builderPackages.find((pkg) => normalizedPath.endsWith(pkg)) || packageNameOrPath;
 };
 
 /**