fix cases where .ratio would end up as NaN (#214)

Author: bartveneman

src/__fixtures__/trello-20190617.json

@@ -381,7 +381,7 @@
         "totalUnique": 0,
         "unique": {},
         "uniquenessRatio": 0,
-        "ratio": null
+        "ratio": 0
       }
     },
     "container": {

src/atrules/atrules.js

@@ -64,7 +64,7 @@ const analyzeAtRules = ({ atrules, stringifyNode }) => {
       ...keyframes.count(),
       prefixed: {
         ...prefixedKeyframes.count(),
-        ratio: prefixedKeyframes.size() / keyframes.size()
+        ratio: keyframes.size() === 0 ? 0 : prefixedKeyframes.size() / keyframes.size()
       }
     },
     container: containers.count(),

src/atrules/atrules.test.js

@@ -221,6 +221,25 @@ AtRules('analyzes @keyframes', () => {
   assert.equal(actual, expected)
 })
 
+AtRules('counts ratio correctly when no @keyframes present', () => {
+  const fixture = `@media (min-width: 0px) {}`
+  const actual = analyze(fixture)
+  const expected = {
+    total: 0,
+    totalUnique: 0,
+    unique: {},
+    uniquenessRatio: 0,
+    prefixed: {
+      total: 0,
+      totalUnique: 0,
+      unique: {},
+      uniquenessRatio: 0,
+      ratio: 0,
+    },
+  }
+  assert.equal(actual.atrules.keyframes, expected)
+})
+
 AtRules('analyzes container queries', () => {
   // Fixture contains examples from the spec.
   // https://drafts.csswg.org/css-contain-3/

src/countable-collection.js

@@ -1,4 +1,7 @@
 class CountableCollection {
+  /**
+   * @param {string[]} initial
+   */
   constructor(initial) {
     this.items = {}
     this.total = 0

src/countable-collection.test.js

@@ -0,0 +1,67 @@
+import { suite } from 'uvu';
+import * as assert from 'uvu/assert';
+import { CountableCollection } from './countable-collection.js'
+
+const CollectionSuite = suite('CountableCollection')
+
+CollectionSuite('counts correctly', () => {
+  const fixture = new CountableCollection()
+  fixture.push('a')
+  fixture.push('a')
+  fixture.push('b')
+  fixture.push('b')
+  fixture.push('c')
+  fixture.push('d')
+  const actual = fixture.count()
+  const expected = {
+    total: 6,
+    totalUnique: 4,
+    unique: {
+      a: 2,
+      b: 2,
+      c: 1,
+      d: 1,
+    },
+    uniquenessRatio: 4 / 6,
+  }
+
+  assert.equal(actual, expected)
+})
+
+CollectionSuite('handles empty collections correctly', () => {
+  const fixture = new CountableCollection()
+  const actual = fixture.count()
+  const expected = {
+    total: 0,
+    totalUnique: 0,
+    unique: {},
+    uniquenessRatio: 0,
+  }
+  assert.equal(actual, expected)
+})
+
+CollectionSuite('accepts an initial collection', () => {
+  const fixture = new CountableCollection(['a', 'b'])
+  fixture.push('a')
+  fixture.push('a')
+  fixture.push('b')
+  fixture.push('b')
+  fixture.push('c')
+  fixture.push('d')
+  const actual = fixture.count()
+  const expected = {
+    total: 8,
+    totalUnique: 4,
+    unique: {
+      a: 3,
+      b: 3,
+      c: 1,
+      d: 1,
+    },
+    uniquenessRatio: 4 / 8,
+  }
+
+  assert.equal(actual, expected)
+})
+
+CollectionSuite.run()

src/rules/rules.js

@@ -39,7 +39,7 @@ const analyzeRules = ({ rules }) => {
     total: totalRules,
     empty: {
       total: emptyRules,
-      ratio: emptyRules / totalRules
+      ratio: totalRules === 0 ? 0 : emptyRules / totalRules
     },
     selectors: {
       ...selectorsPerRule.aggregate(),

src/rules/rules.test.js

@@ -13,6 +13,39 @@ Rules('should count rules', () => {
   `).rules.total, 2)
 })
 
+Rules('should handle CSS without rules', () => {
+  const fixture = `@media (min-width: 0px) {}`
+  const actual = analyze(fixture)
+  const expected = {
+    total: 0,
+    empty: {
+      total: 0,
+      ratio: 0
+    },
+    selectors: {
+      min: 0,
+      max: 0,
+      mean: 0,
+      mode: 0,
+      median: 0,
+      range: 0,
+      sum: 0,
+      items: [],
+    },
+    declarations: {
+      min: 0,
+      max: 0,
+      mean: 0,
+      mode: 0,
+      median: 0,
+      range: 0,
+      sum: 0,
+      items: [],
+    },
+  }
+  assert.equal(actual.rules, expected)
+})
+
 Rules('should count empty rules', () => {
   assert.is(1, analyze(`test{}`).rules.empty.total)
   assert.is(analyze('@media print {}').rules.empty.total, 0)

src/selectors/selectors.js

@@ -87,7 +87,7 @@ const analyzeSelectors = ({ stringifyNode, selectors }) => {
   return {
     total: totalSelectors,
     totalUnique,
-    uniquenessRatio: totalUnique / totalSelectors,
+    uniquenessRatio: totalSelectors === 0 ? 0 : totalUnique / totalSelectors,
     specificity: {
       sum: [aggregatesA.sum, aggregatesB.sum, aggregatesC.sum],
       min: minSpecificity,
@@ -104,15 +104,15 @@ const analyzeSelectors = ({ stringifyNode, selectors }) => {
     },
     id: {
       ...ids.count(),
-      ratio: ids.size() / totalSelectors,
+      ratio: totalSelectors === 0 ? 0 : ids.size() / totalSelectors,
     },
     accessibility: {
       ...a11y.count(),
-      ratio: a11y.size() / totalSelectors,
+      ratio: totalSelectors === 0 ? 0 : a11y.size() / totalSelectors,
     },
     keyframes: {
       ...keyframes.count(),
-      ratio: keyframes.size() / totalSelectors,
+      ratio: totalSelectors === 0 ? 0 : keyframes.size() / totalSelectors,
     }
   }
 }

src/selectors/selectors.test.js

@@ -25,6 +25,66 @@ Selectors('are analyzed', () => {
   assert.equal(actual, 2)
 })
 
+Selectors('handles CSS without selectors', () => {
+  const fixture = `
+    @font-face {
+      font-family: url('/test');
+      font-family: test;
+    }
+  `
+  const actual = analyze(fixture)
+  const expected = {
+    total: 0,
+    totalUnique: 0,
+    uniquenessRatio: 0,
+    specificity: {
+      sum: [0, 0, 0],
+      min: undefined,
+      max: undefined,
+      mean: [0, 0, 0],
+      mode: [0, 0, 0],
+      median: [0, 0, 0],
+      items: [],
+    },
+    complexity: {
+      min: 0,
+      max: 0,
+      mean: 0,
+      mode: 0,
+      median: 0,
+      range: 0,
+      sum: 0,
+      total: 0,
+      totalUnique: 0,
+      unique: {},
+      uniquenessRatio: 0,
+      items: [],
+    },
+    id: {
+      total: 0,
+      totalUnique: 0,
+      unique: {},
+      uniquenessRatio: 0,
+      ratio: 0,
+    },
+    accessibility: {
+      total: 0,
+      totalUnique: 0,
+      unique: {},
+      uniquenessRatio: 0,
+      ratio: 0,
+    },
+    keyframes: {
+      total: 0,
+      totalUnique: 0,
+      unique: {},
+      uniquenessRatio: 0,
+      ratio: 0,
+    },
+  }
+  assert.equal(actual.selectors, expected)
+})
+
 Selectors('have their complexity calculated', () => {
   const fixture = `
     rule {