Add option to get collection item locations

Author: Bart Veneman

src/collection.js

@@ -1,20 +1,28 @@
 export class Collection {
-	constructor() {
+	constructor({ useLocations = false }) {
 		/** @type {Map<string, Array<Number>>} */
 		this._items = new Map()
 		this._total = 0
+		/** @type {number[]} */
 		this.node_lines = []
+		/** @type {number[]} */
 		this.node_columns = []
+		/** @type {number[]} */
 		this.node_lenghts = []
+		/** @type {number[]} */
 		this.node_offsets = []
+
+		/** @type {boolean} */
+		this.useLocations = useLocations
 	}
 
 	/**
 	 * @param {string} item
 	 * @param {import('css-tree').CssLocation} node_location
 	 */
 	push(item, node_location) {
-		let index = this._totalq
+		let index = this._total
+
 		this.node_lines[index] = node_location.start.line
 		this.node_columns[index] = node_location.start.column
 		this.node_offsets[index] = node_location.start.offset
@@ -24,7 +32,6 @@ export class Collection {
 			/** @type number[] */
 			let list = this._items.get(item)
 			list.push(index)
-			// this._items.set(item, list)
 			this._total++
 			return
 		}
@@ -38,7 +45,7 @@ export class Collection {
 	}
 
 	count() {
-		let items = new Map()
+		let uniqueWithLocations = new Map()
 		let unique = {}
 		this._items.forEach((list, key) => {
 			let nodes = list.map(index => ({
@@ -47,17 +54,27 @@ export class Collection {
 				offset: this.node_offsets[index],
 				length: this.node_lenghts[index],
 			}))
-			items.set(key, nodes)
+			uniqueWithLocations.set(key, nodes)
 			unique[key] = list.length
 		})
 
+		if (this.useLocations) {
+			return {
+				total: this._total,
+				totalUnique: this._items.size,
+				unique: Object.fromEntries(this._items),
+				unique,
+				uniquenessRatio: this._total === 0 ? 0 : this._items.size / this._total,
+				__unstable__uniqueWithLocations: Object.fromEntries(uniqueWithLocations),
+			}
+		}
+
 		return {
 			total: this._total,
 			totalUnique: this._items.size,
-			// unique: Object.fromEntries(this._items),
+			unique: Object.fromEntries(this._items),
 			unique,
 			uniquenessRatio: this._total === 0 ? 0 : this._items.size / this._total,
-			// __unstable__itemsWithLocations: Object.fromEntries(items),
 		}
 	}
 }

src/context-collection.js

@@ -1,10 +1,12 @@
 import { Collection } from './collection.js'
 
 class ContextCollection {
-  constructor() {
-    this._list = new Collection()
+  constructor({ useLocations = false }) {
+    this._list = new Collection({ useLocations })
     /** @type {Map<string, Collection>} */
     this._contexts = new Map()
+    /** @type {boolean} */
+    this.useLocations = useLocations
   }
 
   /**
@@ -17,7 +19,7 @@ class ContextCollection {
     this._list.push(item, node_location)
 
     if (!this._contexts.has(context)) {
-      this._contexts.set(context, new Collection())
+      this._contexts.set(context, new Collection({ useLocations: this.useLocations }))
     }
 
     this._contexts.get(context).push(item, node_location)

src/index.js

@@ -25,11 +25,17 @@ function ratio(part, total) {
   return part / total
 }
 
+let defaults = {
+  useUnstableLocations: false
+}
+
 /**
  * Analyze CSS
  * @param {string} css
  */
-function analyze(css) {
+function analyze(css, options = {}) {
+  let settings = Object.assign({}, defaults, options)
+  let useLocations = settings.useUnstableLocations === true
   let start = Date.now()
 
   /**
@@ -75,16 +81,16 @@ function analyze(css) {
   let totalAtRules = 0
   /** @type {{[property: string]: string}[]} */
   let fontfaces = []
-  let layers = new Collection()
-  let imports = new Collection()
-  let medias = new Collection()
-  let mediaBrowserhacks = new Collection()
-  let charsets = new Collection()
-  let supports = new Collection()
-  let supportsBrowserhacks = new Collection()
-  let keyframes = new Collection()
-  let prefixedKeyframes = new Collection()
-  let containers = new Collection()
+  let layers = new Collection({ useLocations })
+  let imports = new Collection({ useLocations })
+  let medias = new Collection({ useLocations })
+  let mediaBrowserhacks = new Collection({ useLocations })
+  let charsets = new Collection({ useLocations })
+  let supports = new Collection({ useLocations })
+  let supportsBrowserhacks = new Collection({ useLocations })
+  let keyframes = new Collection({ useLocations })
+  let prefixedKeyframes = new Collection({ useLocations })
+  let containers = new Collection({ useLocations })
 
   // Rules
   let totalRules = 0
@@ -94,9 +100,9 @@ function analyze(css) {
   let declarationsPerRule = new AggregateCollection()
 
   // Selectors
-  let keyframeSelectors = new Collection()
+  let keyframeSelectors = new Collection({ useLocations })
   let uniqueSelectors = new Set()
-  let prefixedSelectors = new Collection()
+  let prefixedSelectors = new Collection({ useLocations })
   /** @type {Specificity} */
   let maxSpecificity
   /** @type {Specificity} */
@@ -108,35 +114,35 @@ function analyze(css) {
   let selectorComplexities = new AggregateCollection()
   /** @type {Specificity[]} */
   let specificities = []
-  let ids = new Collection()
-  let a11y = new Collection()
+  let ids = new Collection({ useLocations })
+  let a11y = new Collection({ useLocations })
 
   // Declarations
   let uniqueDeclarations = new Set()
   let totalDeclarations = 0
   let importantDeclarations = 0
   let importantsInKeyframes = 0
-  let importantCustomProperties = new Collection()
+  let importantCustomProperties = new Collection({ useLocations })
 
   // Properties
-  let properties = new Collection()
-  let propertyHacks = new Collection()
-  let propertyVendorPrefixes = new Collection()
-  let customProperties = new Collection()
+  let properties = new Collection({ useLocations })
+  let propertyHacks = new Collection({ useLocations })
+  let propertyVendorPrefixes = new Collection({ useLocations })
+  let customProperties = new Collection({ useLocations })
   let propertyComplexities = new AggregateCollection()
 
   // Values
-  let vendorPrefixedValues = new Collection()
-  let valueBrowserhacks = new Collection()
-  let zindex = new Collection()
-  let textShadows = new Collection()
-  let boxShadows = new Collection()
-  let fontFamilies = new Collection()
-  let fontSizes = new Collection()
-  let lineHeights = new Collection()
-  let timingFunctions = new Collection()
-  let durations = new Collection()
-  let colors = new ContextCollection()
+  let vendorPrefixedValues = new Collection({ useLocations })
+  let valueBrowserhacks = new Collection({ useLocations })
+  let zindex = new Collection({ useLocations })
+  let textShadows = new Collection({ useLocations })
+  let boxShadows = new Collection({ useLocations })
+  let fontFamilies = new Collection({ useLocations })
+  let fontSizes = new Collection({ useLocations })
+  let lineHeights = new Collection({ useLocations })
+  let timingFunctions = new Collection({ useLocations })
+  let durations = new Collection({ useLocations })
+  let colors = new ContextCollection({ useLocations })
   let colorFormats = new CountableCollection()
   let units = new ContextCollection()
   let gradients = new CountableCollection()
@@ -364,12 +370,12 @@ function analyze(css) {
 
           break
         } else if (isProperty('font-size', property)) {
-          if (!isFontKeyword(node)) {
+          if (!isSystemFont(node)) {
             fontSizes.push(stringifyNode(node), node.loc)
           }
           break
         } else if (isProperty('font-family', property)) {
-          if (!isFontKeyword(node)) {
+          if (!isSystemFont(node)) {
             fontFamilies.push(stringifyNode(node), node.loc)
           }
           break

src/values/colors.test.js

@@ -1051,4 +1051,49 @@ Colors('insane color mode', () => {
   assert.not.throws(() => analyze(fixture))
 })
 
+Colors('Lists locations when unstable flag is set', () => {
+  let css = `
+    thing {
+      color: red;
+      color: #f00;
+      color: rgb(255, 0, 0);
+      background-color: red;
+    }
+  `
+  let actual = analyze(css, { useUnstableLocations: true })
+
+  assert.equal(actual.values.colors.__unstable__uniqueWithLocations, {
+    'red': [
+      {
+        line: 3,
+        column: 14,
+        offset: 26,
+        length: 3,
+      },
+      {
+        line: 6,
+        column: 25,
+        offset: 103,
+        length: 3,
+      }
+    ],
+    '#f00': [
+      {
+        line: 4,
+        column: 14,
+        offset: 44,
+        length: 4,
+      }
+    ],
+    'rgb(255, 0, 0)': [
+      {
+        line: 5,
+        column: 14,
+        offset: 63,
+        length: 14,
+      }
+    ]
+  })
+})
+
 Colors.run()

src/values/vendor-prefix.test.js

@@ -31,7 +31,7 @@ VendorPrefix('finds simple prefixes', () => {
   `
   const actual = analyze(fixture).values.prefixes
   const expected = {
-    total: 8,
+    total: 9,
     totalUnique: 7,
     unique: {
       '-moz-max-content': 1,
@@ -42,7 +42,7 @@ VendorPrefix('finds simple prefixes', () => {
       '-moz-transform 0.3s ease-out': 1,
       '-o-transform 0.3s ease-out': 2,
     },
-    uniquenessRatio: 7 / 8
+    uniquenessRatio: 7 / 9,
   }
 
   assert.equal(actual, expected)