Merge pull request #991 from chromaui/ghengeveld/ap-4602-cli-hangs-if…

…-storybook-build-fails-and-prompts-you-for-crash Pass `CI=1` environment variable to Storybook build command to disable prompts
chromaui · May 27, 2024 · 30c518c · 30c518c
2 parents 24e744c + a1375ff
commit 30c518c
Show file tree

Hide file tree

Showing 2 changed files with 41 additions and 25 deletions.
diff --git a/node-src/tasks/build.test.ts b/node-src/tasks/build.test.ts
@@ -11,7 +11,7 @@ const command = vi.mocked(execaCommand);
 
 beforeEach(() => {
   command.mockClear();
-})
+});
 
 afterEach(() => {
   mockfs.restore();
@@ -148,7 +148,7 @@ describe('buildStorybook', () => {
     await buildStorybook(ctx);
     expect(command).toHaveBeenCalledWith(
       ctx.buildCommand,
-      expect.objectContaining({ env: { NODE_ENV: 'production'} })
+      expect.objectContaining({ env: { CI: '1', NODE_ENV: 'production' } })
     );
   });
 
@@ -162,7 +162,7 @@ describe('buildStorybook', () => {
     await buildStorybook(ctx);
     expect(command).toHaveBeenCalledWith(
       ctx.buildCommand,
-      expect.objectContaining({ env: { NODE_ENV: 'test'} })
+      expect.objectContaining({ env: { CI: '1', NODE_ENV: 'test' } })
     );
   });
 });
@@ -173,26 +173,36 @@ describe('buildStorybook E2E', () => {
     { name: 'not found 1', error: 'Command not found: build-archive-storybook' },
     { name: 'not found 2', error: 'Command "build-archive-storybook" not found' },
     { name: 'npm not found', error: 'NPM error code E404\n\nMore error info' },
-    { name: 'exit code not found', error: 'Command failed with exit code 127: some command\n\nsome error line\n\n' },
-    { name: 'single line command failure', error: 'Command failed with exit code 1: npm exec build-archive-storybook --output-dir /tmp/chromatic--4210-0cyodqfYZabe' },
+    {
+      name: 'exit code not found',
+      error: 'Command failed with exit code 127: some command\n\nsome error line\n\n',
+    },
+    {
+      name: 'single line command failure',
+      error:
+        'Command failed with exit code 1: npm exec build-archive-storybook --output-dir /tmp/chromatic--4210-0cyodqfYZabe',
+    },
   ];
 
-  it.each(
-    missingDependencyErrorMessages
-  )('fails with missing dependency error when error message is $name', async ({ error }) => {
-    const ctx = {
-      buildCommand: 'npm exec build-archive-storybook',
-      options: { buildScriptName: '', playwright: true },
-      env: { STORYBOOK_BUILD_TIMEOUT: 0 },
-      log: { debug: vi.fn(), error: vi.fn() },
-    } as any;
-
-    command.mockRejectedValueOnce(new Error(error));
-    await expect(buildStorybook(ctx)).rejects.toThrow('Command failed');
-    expect(ctx.log.error).toHaveBeenCalledWith(expect.stringContaining('Failed to import `@chromatic-com/playwright`'));
-
-    ctx.log.error.mockClear();
-  });
+  it.each(missingDependencyErrorMessages)(
+    'fails with missing dependency error when error message is $name',
+    async ({ error }) => {
+      const ctx = {
+        buildCommand: 'npm exec build-archive-storybook',
+        options: { buildScriptName: '', playwright: true },
+        env: { STORYBOOK_BUILD_TIMEOUT: 0 },
+        log: { debug: vi.fn(), error: vi.fn() },
+      } as any;
+
+      command.mockRejectedValueOnce(new Error(error));
+      await expect(buildStorybook(ctx)).rejects.toThrow('Command failed');
+      expect(ctx.log.error).toHaveBeenCalledWith(
+        expect.stringContaining('Failed to import `@chromatic-com/playwright`')
+      );
+
+      ctx.log.error.mockClear();
+    }
+  );
 
   it('fails with generic error message when not missing dependency error', async () => {
     const ctx = {
@@ -202,11 +212,16 @@ describe('buildStorybook E2E', () => {
       log: { debug: vi.fn(), error: vi.fn() },
     } as any;
 
-    const errorMessage = 'Command failed with exit code 1: npm exec build-archive-storybook --output-dir /tmp/chromatic--4210-0cyodqfYZabe\n\nMore error message lines\n\nAnd more';
+    const errorMessage =
+      'Command failed with exit code 1: npm exec build-archive-storybook --output-dir /tmp/chromatic--4210-0cyodqfYZabe\n\nMore error message lines\n\nAnd more';
     command.mockRejectedValueOnce(new Error(errorMessage));
     await expect(buildStorybook(ctx)).rejects.toThrow('Command failed');
-    expect(ctx.log.error).not.toHaveBeenCalledWith(expect.stringContaining('Failed to import `@chromatic-com/playwright`'));
-    expect(ctx.log.error).toHaveBeenCalledWith(expect.stringContaining('Failed to run `chromatic --playwright`'));
+    expect(ctx.log.error).not.toHaveBeenCalledWith(
+      expect.stringContaining('Failed to import `@chromatic-com/playwright`')
+    );
+    expect(ctx.log.error).toHaveBeenCalledWith(
+      expect.stringContaining('Failed to run `chromatic --playwright`')
+    );
     expect(ctx.log.error).toHaveBeenCalledWith(expect.stringContaining(errorMessage));
   });
 });
diff --git a/node-src/tasks/build.ts b/node-src/tasks/build.ts
@@ -122,8 +122,9 @@ export const buildStorybook = async (ctx: Context) => {
 
     const subprocess = execaCommand(ctx.buildCommand, {
       stdio: [null, logFile, null],
+      preferLocal: true,
       signal,
-      env: { NODE_ENV: ctx.env.STORYBOOK_NODE_ENV || 'production' },
+      env: { CI: '1', NODE_ENV: ctx.env.STORYBOOK_NODE_ENV || 'production' },
     });
     await Promise.race([subprocess, timeoutAfter(ctx.env.STORYBOOK_BUILD_TIMEOUT)]);
   } catch (e) {