Merge branch 'next' into ignore-rebuilt-baseline

CHANGELOG.md

@@ -1,3 +1,7 @@
+# 5.7.1 - 2021-02-02
+
+- Better logging when Storybook validation fails
+
 # 5.7.0 - 2021-03-11
 
 - [283](https://github.com/chromaui/chromatic-cli/pull/283) Explicitly allow multiple project-tokens (last will be used)

bin/tasks/upload.js

@@ -34,20 +34,21 @@ const TesterGetUploadUrlsMutation = `
 // Get all paths in rootDir, starting at dirname.
 // We don't want the paths to include rootDir -- so if rootDir = storybook-static,
 // paths will be like iframe.html rather than storybook-static/iframe.html
-function getPathsInDir(rootDir, dirname = '.') {
+function getPathsInDir(ctx, rootDir, dirname = '.') {
   try {
     return readdirSync(join(rootDir, dirname))
       .map((p) => join(dirname, p))
       .map((pathname) => {
         const stats = statSync(join(rootDir, pathname));
         if (stats.isDirectory()) {
-          return getPathsInDir(rootDir, pathname);
+          return getPathsInDir(ctx, rootDir, pathname);
         }
         return [{ pathname, contentLength: stats.size }];
       })
       .reduce((a, b) => [...a, ...b], []); // flatten
   } catch (e) {
-    throw new Error(invalid({ sourceDir: rootDir }).output);
+    ctx.log.debug(e);
+    throw new Error(invalid({ sourceDir: rootDir }, e).output);
   }
 }
 
@@ -61,8 +62,8 @@ function getOutputDir(buildLog) {
   return outputDir.trim();
 }
 
-function getFileInfo(sourceDir) {
-  const lengths = getPathsInDir(sourceDir).map((o) => ({ ...o, knownAs: slash(o.pathname) }));
+function getFileInfo(ctx, sourceDir) {
+  const lengths = getPathsInDir(ctx, sourceDir).map((o) => ({ ...o, knownAs: slash(o.pathname) }));
   const paths = lengths.map(({ knownAs }) => knownAs);
   const total = lengths.map(({ contentLength }) => contentLength).reduce((a, b) => a + b, 0);
   return { lengths, paths, total };
@@ -72,7 +73,7 @@ const isValidStorybook = ({ paths, total }) =>
   total > 0 && paths.includes('iframe.html') && paths.includes('index.html');
 
 export const uploadStorybook = async (ctx, task) => {
-  let fileInfo = getFileInfo(ctx.sourceDir);
+  let fileInfo = getFileInfo(ctx, ctx.sourceDir);
 
   if (!isValidStorybook(fileInfo) && ctx.buildLogFile) {
     try {
@@ -81,7 +82,7 @@ export const uploadStorybook = async (ctx, task) => {
       if (outputDir && outputDir !== ctx.sourceDir) {
         ctx.log.warn(deviatingOutputDir(ctx, outputDir));
         ctx.sourceDir = outputDir;
-        fileInfo = getFileInfo(ctx.sourceDir);
+        fileInfo = getFileInfo(ctx, ctx.sourceDir);
       }
     } catch (e) {
       ctx.log.debug(e);

bin/ui/tasks/upload.js

@@ -36,13 +36,16 @@ export const skipped = (ctx) => ({
   output: `Using hosted Storybook at ${ctx.options.storybookUrl}`,
 });
 
-export const invalid = (ctx) => ({
-  status: 'error',
-  title: 'Publishing your built Storybook',
-  output: `Invalid Storybook build at ${ctx.sourceDir}${
-    ctx.buildLogFile ? ' (check the build log)' : ''
-  }`,
-});
+export const invalid = (ctx, error) => {
+  let output = `Invalid Storybook build at ${ctx.sourceDir}`;
+  if (ctx.buildLogFile) output += ' (check the build log)';
+  if (error) output += `: ${error.message}`;
+  return {
+    status: 'error',
+    title: 'Publishing your built Storybook',
+    output,
+  };
+};
 
 export const failed = (ctx) => ({
   status: 'error',

package.json

@@ -1,6 +1,6 @@
 {
   "name": "chromatic",
-  "version": "5.7.0",
+  "version": "5.7.1",
   "description": "Automate visual testing across browsers. Gather UI feedback. Versioned documentation.",
   "homepage": "https://www.chromatic.com",
   "bugs": {