Merge pull request #32334 from storybookjs/norbert/fix-sandbox-generation

Sandboxes: Fix generation

Author: ndelangen

.github/workflows/generate-sandboxes.yml

@@ -2,7 +2,7 @@ name: Generate and publish sandboxes
 
 on:
   schedule:
-    - cron: "2 2 */1 * *"
+    - cron: '2 2 */1 * *'
   workflow_dispatch:
   # To test fixes on push rather than wait for the scheduling, do the following:
   # 1. Uncomment the lines below and add your branch.
@@ -14,8 +14,8 @@ on:
   # 4. 👉 DON'T FORGET TO UNDO THE STEPS BEFORE YOU MERGE YOUR CHANGES!
 
 env:
-  YARN_ENABLE_IMMUTABLE_INSTALLS: "false"
-  CLEANUP_SANDBOX_NODE_MODULES: "true"
+  YARN_ENABLE_IMMUTABLE_INSTALLS: 'false'
+  CLEANUP_SANDBOX_NODE_MODULES: 'true'
 
 defaults:
   run:
@@ -32,7 +32,7 @@ jobs:
 
       - uses: actions/setup-node@v4
         with:
-          node-version-file: ".nvmrc"
+          node-version-file: '.nvmrc'
 
       - name: Setup git user
         run: |
@@ -84,7 +84,7 @@ jobs:
 
       - uses: actions/setup-node@v4
         with:
-          node-version-file: ".nvmrc"
+          node-version-file: '.nvmrc'
 
       - name: Setup git user
         run: |

code/core/src/common/js-package-manager/Yarn1Proxy.test.ts

@@ -7,6 +7,20 @@ import { dedent } from 'ts-dedent';
 import { JsPackageManager } from './JsPackageManager';
 import { Yarn1Proxy } from './Yarn1Proxy';
 
+vi.mock('node:process', async (importOriginal) => {
+  const original: any = await importOriginal();
+  return {
+    ...original,
+    default: {
+      ...original.default,
+      env: {
+        ...original.default.env,
+        CI: false,
+      },
+    },
+  };
+});
+
 describe('Yarn 1 Proxy', () => {
   let yarn1Proxy: Yarn1Proxy;
 

code/core/src/common/js-package-manager/Yarn1Proxy.ts

@@ -1,5 +1,6 @@
 import { existsSync, readFileSync } from 'node:fs';
 import { join } from 'node:path';
+import process from 'node:process';
 
 import { prompt } from 'storybook/internal/node-logger';
 import { FindPackageVersionsError } from 'storybook/internal/server-errors';
@@ -36,7 +37,7 @@ export class Yarn1Proxy extends JsPackageManager {
 
   getInstallArgs(): string[] {
     if (!this.installArgs) {
-      this.installArgs = ['--ignore-workspace-root-check'];
+      this.installArgs = process.env.CI ? [] : ['--ignore-workspace-root-check'];
     }
     return this.installArgs;
   }

code/core/src/shared/status-store/index.ts

@@ -1,8 +1,7 @@
-import type { StoryId } from 'storybook/internal/csf';
-
 import { StatusTypeIdMismatchError as ManagerStatusTypeIdMismatchError } from '../../manager-errors';
 import { StatusTypeIdMismatchError as PreviewStatusTypeIdMismatchError } from '../../preview-errors';
 import { StatusTypeIdMismatchError as ServerStatusTypeIdMismatchError } from '../../server-errors';
+import type { StoryId } from '../../types';
 import type { UniversalStore } from '../universal-store';
 import type { StoreOptions } from '../universal-store/types';
 import type { useUniversalStore as managerUseUniversalStore } from '../universal-store/use-universal-store-manager';

code/lib/create-storybook/src/generators/SOLID/index.ts

@@ -9,7 +9,7 @@ const generator: Generator = async (packageManager, npmOptions, options) => {
     npmOptions,
     { ...options, builder: CoreBuilder.Vite },
     'solid',
-    {},
+    { addComponents: false },
     'solid'
   );
 };

scripts/sandbox/generate.ts

@@ -1,3 +1,6 @@
+import { readFile } from 'node:fs/promises';
+import { join, relative } from 'node:path';
+
 import * as ghActions from '@actions/core';
 import { program } from 'commander';
 // eslint-disable-next-line depend/ban-dependencies
@@ -7,12 +10,9 @@ import { execaCommand } from 'execa';
 // eslint-disable-next-line depend/ban-dependencies
 import { copy, emptyDir, ensureDir, move, remove, writeFile } from 'fs-extra';
 import pLimit from 'p-limit';
-import { join, relative } from 'path';
 import prettyTime from 'pretty-hrtime';
 import { dedent } from 'ts-dedent';
 
-import type { JsPackageManager } from '../../code/core/src/common/js-package-manager';
-import { JsPackageManagerFactory } from '../../code/core/src/common/js-package-manager/JsPackageManagerFactory';
 import { temporaryDirectory } from '../../code/core/src/common/utils/cli';
 import storybookVersions from '../../code/core/src/common/versions';
 import { allTemplates as sandboxTemplates } from '../../code/lib/cli-storybook/src/sandbox-templates';
@@ -30,7 +30,7 @@ import { getStackblitzUrl, renderTemplate } from './utils/template';
 import type { GeneratorConfig } from './utils/types';
 import { localizeYarnConfigFiles, setupYarn } from './utils/yarn';
 
-const isCI = process.env.GITHUB_ACTIONS === 'true';
+const isCI = process.env.GITHUB_ACTIONS === 'true' || process.env.CI === 'true';
 
 class BeforeScriptExecutionError extends Error {}
 class StorybookInitError extends Error {}
@@ -43,27 +43,20 @@ const sbInit = async (
 ) => {
   const sbCliBinaryPath = join(__dirname, `../../code/lib/create-storybook/dist/bin/index.js`);
   console.log(`🎁 Installing Storybook`);
-  const env = { STORYBOOK_DISABLE_TELEMETRY: 'true', ...envVars };
+  const env = { STORYBOOK_DISABLE_TELEMETRY: 'true', ...envVars, CI: 'true' };
   const fullFlags = ['--yes', ...(flags || [])];
   await runCommand(`${sbCliBinaryPath} ${fullFlags.join(' ')}`, { cwd, env }, debug);
 };
 
 type LocalRegistryProps = {
-  packageManager: JsPackageManager;
   action: () => Promise<void>;
   cwd: string;
   env: Record<string, any>;
   debug: boolean;
 };
 
-const withLocalRegistry = async ({
-  packageManager,
-  action,
-  cwd,
-  env,
-  debug,
-}: LocalRegistryProps) => {
-  const prevUrl = await packageManager.getRegistryURL();
+const withLocalRegistry = async ({ action, cwd, env, debug }: LocalRegistryProps) => {
+  const prevUrl = 'https://registry.npmjs.org/';
   let error;
   try {
     console.log(`📦 Configuring local registry: ${LOCAL_REGISTRY_URL}`);
@@ -84,8 +77,8 @@ const withLocalRegistry = async ({
 };
 
 const addStorybook = async ({
-  baseDir,
   localRegistry,
+  baseDir,
   flags = [],
   debug,
   env = {},
@@ -104,27 +97,13 @@ const addStorybook = async ({
   try {
     await copy(beforeDir, tmpDir);
 
-    const packageManager = JsPackageManagerFactory.getPackageManager({ force: 'yarn1' }, tmpDir);
     if (localRegistry) {
-      await withLocalRegistry({
-        packageManager,
-        action: async () => {
-          await packageManager.addPackageResolutions({
-            ...storybookVersions,
-            // Yarn1 Issue: https://github.com/storybookjs/storybook/issues/22431
-            jackspeak: '2.1.1',
-          });
-
-          await sbInit(tmpDir, env, [...flags, '--package-manager=yarn1'], debug);
-        },
-        cwd: tmpDir,
-        env,
-        debug,
-      });
-    } else {
-      await sbInit(tmpDir, env, [...flags, '--package-manager=yarn1'], debug);
+      await addResolutions(tmpDir);
     }
+
+    await sbInit(tmpDir, env, [...flags, '--package-manager=yarn1'], debug);
   } catch (e) {
+    console.log('error', e);
     await remove(tmpDir);
     throw e;
   }
@@ -227,6 +206,10 @@ const runGenerators = async (
                 scriptWithBeforeDir,
                 {
                   cwd: createBaseDir,
+                  env: {
+                    ...env,
+                    CI: 'true',
+                  },
                   timeout: SCRIPT_TIMEOUT,
                 },
                 debug
@@ -270,6 +253,7 @@ const runGenerators = async (
               cause: error,
             });
           }
+
           await addDocumentation(baseDir, { name, dirName });
 
           console.log(
@@ -298,6 +282,12 @@ const runGenerators = async (
 
   if (!isCI) {
     if (hasGenerationErrors) {
+      console.log('failed:');
+      console.log(
+        generationResults
+          .filter((result) => result.status === 'rejected')
+          .map((_, index) => generators[index].name)
+      );
       throw new Error(`Some sandboxes failed to generate`);
     }
     return;
@@ -386,6 +376,18 @@ export const generate = async ({
   await runGenerators(generatorConfigs, localRegistry, debug);
 };
 
+async function addResolutions(beforeDir: string) {
+  const packageJson = await readFile(join(beforeDir, 'package.json'), 'utf-8').then((c) =>
+    JSON.parse(c)
+  );
+
+  packageJson.resolutions = {
+    ...storybookVersions,
+  };
+
+  await writeFile(join(beforeDir, 'package.json'), JSON.stringify(packageJson, null, 2));
+}
+
 if (esMain(import.meta.url)) {
   program
     .description('Generate sandboxes from a set of possible templates')
@@ -397,7 +399,22 @@ if (esMain(import.meta.url)) {
     .option('--debug', 'Print all the logs to the console')
     .option('--local-registry', 'Use local registry', false)
     .action((optionValues) => {
-      generate(optionValues)
+      let result;
+      if (optionValues.localRegistry) {
+        result = withLocalRegistry({
+          debug: optionValues.debug,
+
+          action: async () => {
+            await generate(optionValues);
+          },
+          cwd: process.cwd(),
+          env: {},
+        });
+      } else {
+        result = generate(optionValues);
+      }
+
+      result
         .catch((e) => {
           console.error(e);
           process.exit(1);