webpack-stats-diff - npm Package Compare versions

Comparing version 0.6.0 to 0.7.0

package.json

 {
   "name": "webpack-stats-diff",
-  "version": "0.6.0",
+  "version": "0.7.0",
   "description": "CLI tool to report changes in bundle sizes across builds",
@@ -5,0 +5,0 @@ "bin": "src/cli.js",

src/__tests__/index.test.js

 const webpackStatsDiff = require('../index');
 
 test('handles blank inputs', () => {
-  expect(webpackStatsDiff([], [])).toEqual({
-    added: [],
-    removed: [],
-    bigger: [],
-    smaller: [],
-    sameSize: [],
-    total: {
-      name: 'Total',
-      newSize: 0,
-      oldSize: 0,
-      diff: 0,
-      diffPercentage: 0
-    }
-  });
+  expect(webpackStatsDiff([], [])).toMatchSnapshot();
 });
@@ -35,63 +22,3 @@
   ];
-  expect(webpackStatsDiff(oldAssets, newAssets)).toEqual({
-    added: [
-      {
-        name: 'Roboto-Regular.ttf',
-        newSize: 176999,
-        oldSize: 0,
-        diff: 176999,
-        diffPercentage: Infinity
-      }
-    ],
-    removed: [
-      {
-        name: 'logo.svg',
-        newSize: 0,
-        oldSize: 588,
-        diff: -588,
-        diffPercentage: -100
-      }
-    ],
-    bigger: [
-      {
-        name: 'commons.js',
-        newSize: 65536,
-        oldSize: 32768,
-        diff: 32768,
-        diffPercentage: 100
-      }
-    ],
-    smaller: [
-      {
-        name: 'main-site.js',
-        newSize: 38000,
-        oldSize: 68000,
-        diff: -30000,
-        diffPercentage: -44.12
-      },
-      {
-        name: 'other-page.js',
-        newSize: 12345,
-        oldSize: 40000,
-        diff: -27655,
-        diffPercentage: -69.14
-      }
-    ],
-    sameSize: [
-      {
-        name: 'me.jpg',
-        newSize: 1200000,
-        oldSize: 1200000,
-        diff: 0,
-        diffPercentage: 0
-      }
-    ],
-    total: {
-      name: 'Total',
-      newSize: 1492880,
-      oldSize: 1341356,
-      diff: 151524,
-      diffPercentage: 11.3
-    }
-  });
+  expect(webpackStatsDiff(oldAssets, newAssets)).toMatchSnapshot();
 });
@@ -118,47 +45,9 @@
     webpackStatsDiff(oldAssets, newAssets, { extensions: ['.js', '.css'] })
-  ).toEqual({
+  ).toMatchObject({
     added: [],
-    removed: [
-      {
-        name: 'old-page.js',
-        newSize: 0,
-        oldSize: 8000,
-        diff: -8000,
-        diffPercentage: -100
-      }
-    ],
-    bigger: [
-      {
-        name: 'commons.js',
-        newSize: 65536,
-        oldSize: 32768,
-        diff: 32768,
-        diffPercentage: 100
-      }
-    ],
-    smaller: [
-      {
-        name: 'main-site.js',
-        newSize: 38000,
-        oldSize: 68000,
-        diff: -30000,
-        diffPercentage: -44.12
-      }
-    ],
-    sameSize: [
-      {
-        name: 'styles.css',
-        newSize: 10000,
-        oldSize: 10000,
-        diff: 0,
-        diffPercentage: 0
-      }
-    ],
-    total: {
-      name: 'Total',
-      newSize: 113536,
-      oldSize: 118768,
-      diff: -5232,
-      diffPercentage: -4.41
-    }
+    removed: [{ name: 'old-page.js' }],
+    bigger: [{ name: 'commons.js' }],
+    smaller: [{ name: 'main-site.js' }],
+    sameSize: [{ name: 'styles.css' }],
+    total: { name: 'Total' }
   });
@@ -180,6 +69,7 @@ });
 
-test('Marks an asset as sameSize if changed by a minor percentage', () => {
+describe('Marks an asset as sameSize if % change is below threshold', () => {
   const oldAssets = [
     { name: 'big-file-small-change', size: 100000 },
-    { name: 'big-file-big-change', size: 100000 },
+    { name: 'big-file-biggest-change', size: 100000 },
+    { name: 'big-file-no-change', size: 100000 },
     { name: 'small-file-small-change', size: 1000 },
@@ -190,13 +80,48 @@ { name: 'small-file-big-change', size: 1000 }
     { name: 'big-file-small-change', size: 104000 },
-    { name: 'big-file-big-change', size: 105000 },
+    { name: 'big-file-biggest-change', size: 110001 },
+    { name: 'big-file-no-change', size: 100000 },
     { name: 'small-file-small-change', size: 960 },
-    { name: 'small-file-big-change', size: 950 }
+    { name: 'small-file-big-change', size: 949 }
   ];
-  const results = webpackStatsDiff(oldAssets, newAssets);
-  expect(results.bigger).toMatchObject([{ name: 'big-file-big-change' }]);
-  expect(results.smaller).toMatchObject([{ name: 'small-file-big-change' }]);
-  expect(results.sameSize).toMatchObject([
-    { name: 'big-file-small-change' },
-    { name: 'small-file-small-change' }
-  ]);
+
+  test('Default threshold is 5%', () => {
+    expect(webpackStatsDiff(oldAssets, newAssets)).toMatchObject({
+      bigger: [{ name: 'big-file-biggest-change' }],
+      smaller: [{ name: 'small-file-big-change' }],
+      sameSize: [
+        { name: 'big-file-small-change' },
+        { name: 'big-file-no-change' },
+        { name: 'small-file-small-change' }
+      ]
+    });
+  });
+
+  test('Threshold can be adjusted by configuration', () => {
+    expect(
+      webpackStatsDiff(oldAssets, newAssets, { threshold: 0 })
+    ).toMatchObject({
+      bigger: [
+        { name: 'big-file-biggest-change' },
+        { name: 'big-file-small-change' }
+      ],
+      smaller: [
+        { name: 'small-file-big-change' },
+        { name: 'small-file-small-change' }
+      ],
+      sameSize: [{ name: 'big-file-no-change' }]
+    });
+
+    expect(
+      webpackStatsDiff(oldAssets, newAssets, { threshold: 10 })
+    ).toMatchObject({
+      bigger: [{ name: 'big-file-biggest-change' }],
+      smaller: [],
+      sameSize: [
+        { name: 'big-file-small-change' },
+        { name: 'big-file-no-change' },
+        { name: 'small-file-small-change' },
+        { name: 'small-file-big-change' }
+      ]
+    });
+  });
 });

src/cli.js

@@ -114,2 +114,7 @@ #!/usr/bin/env node
   )
+  .option(
+    '-t, --threshold <int>',
+    'minimum % size change to report. Default 5.',
+    parseInt
+  )
   .action((oldStats, newStats) => {
@@ -120,2 +125,5 @@ const config = {};
     }
+    if (Number.isInteger(program.threshold)) {
+      config.threshold = program.threshold;
+    }
     const oldPath = path.resolve(process.cwd(), oldStats);
@@ -122,0 +130,0 @@ const newPath = path.resolve(process.cwd(), newStats);

src/index.js

@@ -26,3 +26,3 @@ const path = require('path');
   diff: newSize - oldSize,
-  diffPercentage: +((1 - newSize / oldSize) * -100).toFixed(2) || 0
+  diffPercentage: +((1 - newSize / oldSize) * -100).toFixed(5) || 0
 });
@@ -52,5 +52,8 @@
       );
-      if (diff.diffPercentage >= DIFF_THRESHOLD) {
+      const diffThreshold = config.hasOwnProperty('threshold')
+        ? config.threshold
+        : DIFF_THRESHOLD;
+      if (diff.diffPercentage > diffThreshold) {
         bigger.push(diff);
-      } else if (diff.diffPercentage <= -1 * DIFF_THRESHOLD) {
+      } else if (diff.diffPercentage < -1 * diffThreshold) {
         smaller.push(diff);
@@ -57,0 +60,0 @@ } else {

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

252051

increased by0.39%

Number of package files

13

increased by8.33%

Worsened metrics

Lines of code

320

decreased by-17.31%

No dependency changes