[Danger] Split the reports into sections based on their package

Author: orta

dangerfile.js

@@ -12,10 +12,7 @@
 const {markdown} = require('danger');
 const fetch = require('node-fetch');
 
-const {
-  resultsHeaders,
-  generateResultsArray,
-} = require('./scripts/rollup/stats');
+const {generateResultsArray} = require('./scripts/rollup/stats');
 const currentBuildResults = require('./scripts/rollup/results.json');
 
 /**
@@ -42,11 +39,44 @@ fetch('http://react.zpao.com/builds/master/latest/results.json').then(
       previousBuildResults
     );
 
-    markdown('### Bundle Changes:\n');
-    const percentToWarrentShowing = 1
-    const onlyResultsToShow = results.filter(f => Math.abs(f[3]) > percentToWarrentShowing || Math.abs(f[7]));
-    const groupBy
+    const percentToWarrentShowing = 1;
+    const packagesToShow = results
+      .filter(
+        r =>
+          Math.abs(r.prevFileSizeChange) > percentToWarrentShowing ||
+          Math.abs(r.prevGzipSizeChange) > percentToWarrentShowing
+      )
+      .map(r => r.packageName);
 
-    markdown(generateMDTable(resultsHeaders, results));
+    if (packagesToShow) {
+      markdown('## Bundle Changes:\n');
+      // eslint-disable-next-line no-var
+      for (var name of new Set(packagesToShow)) {
+        markdown(`## ${name}`);
+
+        const thisBundleResults = results.filter(r => r.packageName === name);
+        const mdHeaders = [
+          'Filesize Diff',
+          'Gzip Diff',
+          'File',
+          'ENV',
+          'Prev Size',
+          'Current Size',
+          'Prev Gzip',
+          'Current Gzip',
+        ];
+        const mdRows = thisBundleResults.map(r => [
+          r.prevFileSizeChange,
+          r.prevGzipSizeChange,
+          r.filename,
+          r.bundleType,
+          r.prevSize,
+          r.prevFileSize,
+          r.prevGzip,
+          r.prevGzipSize,
+        ]);
+        markdown(generateMDTable(mdHeaders, mdRows));
+      }
+    }
   }
 );

scripts/circleci/test_entry_point.sh

@@ -24,7 +24,6 @@ fi
 if [ $((2 % CIRCLE_NODE_TOTAL)) -eq "$CIRCLE_NODE_INDEX" ]; then
   COMMANDS_TO_RUN+=('./scripts/circleci/build.sh')
   COMMANDS_TO_RUN+=('yarn test-build --runInBand')
-  COMMANDS_TO_RUN+=('node ./scripts/tasks/danger')
   COMMANDS_TO_RUN+=('yarn test-build-prod --runInBand')
   COMMANDS_TO_RUN+=('node ./scripts/tasks/danger')
   COMMANDS_TO_RUN+=('./scripts/circleci/upload_build.sh')

scripts/rollup/stats.js

@@ -20,7 +20,6 @@ function saveResults() {
   );
 }
 
-
 function percentChange(prev, current) {
   return Math.floor((current - prev) / prev * 100);
 }
@@ -44,49 +43,52 @@ const resultsHeaders = [
 ];
 
 function generateResultsArray(current, prevResults) {
-  currentBuildResults.bundleSizes.forEach(index => {
-    const result = currentBuildResults.bundleSizes[index];
-    const prev = prevBuildResults.bundleSizes.filter(
-      res => res.filename === result.filename
-    )[0];
-    if (result === prev) {
-      // We didn't rebuild this bundle.
-      return;
-    }
+  return current.bundleSizes
+    .map(result => {
+      const prev = prevResults.bundleSizes.filter(
+        res => res.filename === result.filename
+      )[0];
+      if (result === prev) {
+        // We didn't rebuild this bundle.
+        return;
+      }
 
-    const size = result.size;
-    const gzip = result.gzip;
-    let prevSize = prev ? prev.size : 0;
-    let prevGzip = prev ? prev.gzip : 0;
+      const size = result.size;
+      const gzip = result.gzip;
+      let prevSize = prev ? prev.size : 0;
+      let prevGzip = prev ? prev.gzip : 0;
 
-    return [
-      `${result.filename} (${result.bundleType}`, 
-      filesize(prevSize),
-      filesize(size),
-      percentChange(prevSize, size),
-      filesize(prevGzip),
-      filesize(gzip),
-      percentChange(prevGzip, gzip),
-    ];
-  // Strip any nulls
-  }).filter(f => f);
+      return {
+        filename: result.filename,
+        bundleType: result.bundleType,
+        packageName: result.packageName,
+        prevSize: filesize(prevSize),
+        prevFileSize: filesize(size),
+        prevFileSizeChange: percentChange(prevSize, size),
+        prevGzip: filesize(prevGzip),
+        prevGzipSize: filesize(gzip),
+        prevGzipSizeChange: percentChange(prevGzip, gzip),
+      };
+      // Strip any nulls
+    })
+    .filter(f => f);
 }
 
 function printResults() {
   const table = new Table({
     head: resultsHeaders.map(chalk.gray.yellow),
   });
 
-  const results = generateResultsArray(currentBuildResults, prevBuildResults)
-  results.forEach(row => {
+  const results = generateResultsArray(currentBuildResults, prevBuildResults);
+  results.forEach(result => {
     table.push([
-      chalk.white.bold(row[0]),
-      chalk.gray.bold(row[1]),
-      chalk.white.bold(row[2]),
-      percentChangeString(row[3]),
-      chalk.gray.bold(row[4]),
-      chalk.white.bold(row[5]),
-      percentChangeString(row[6]),
+      chalk.white.bold(`${result.filename}  (${result.bundleType})`),
+      chalk.gray.bold(result.prevSize),
+      chalk.white.bold(result.prevFileSize),
+      percentChangeString(result.prevFileSizeChange),
+      chalk.gray.bold(result.prevGzip),
+      chalk.white.bold(result.prevGzipSize),
+      percentChangeString(result.prevGzipSizeChange),
     ]);
   });
 

scripts/tasks/danger.js

@@ -14,7 +14,7 @@ const extension = process.platform === 'win32' ? '.cmd' : '';
 
 // This came from React Native's circle.yml
 const token = 'e622517d9f1136ea8900' + '07c6373666312cdfaa69';
-spawn(path.join('node_modules', '.bin', 'danger' + extension), [], {
+spawn(path.join('node_modules', '.bin', 'danger-ci' + extension), [], {
   // Allow colors to pass through
   stdio: 'inherit',
   env: {