@projectwallace/css-analyzer 5.0.0-alpha.1 → 5.0.2

package/src/rules/rules.test.js

@@ -1,247 +0,0 @@
-import { suite } from 'uvu';
-import * as assert from 'uvu/assert';
-import { analyze } from '../index.js'
-
-const Rules = suite('Rules')
-
-Rules('should count rules', () => {
-  assert.is(analyze(`
-    html {
-      color: black;
-    }
-    test {}
-  `).rules.total, 2)
-})
-
-Rules('should count empty rules', () => {
-  assert.is(1, analyze(`test{}`).rules.empty.total)
-  assert.is(analyze('@media print {}').rules.empty.total, 0)
-  assert.is(analyze(`
-    @media print {
-      empty {}
-    }
-  `).rules.empty.total, 1)
-  assert.is(analyze('test { color: red; }').rules.empty.total, 0)
-})
-
-Rules('calculate the minimum selectors', () => {
-  assert.is(analyze(`
-    html {}
-    a,
-    b {}
-  `).rules.selectors.min, 1)
-})
-
-Rules('calculate the maximum selectors', () => {
-  assert.is(analyze(`
-    html {}
-    a,
-    b {}
-  `).rules.selectors.max, 2)
-})
-
-Rules('calculate the mode of selectors', () => {
-  assert.is(analyze(`
-    html {}
-    a,
-    b {}
-    x {}
-  `).rules.selectors.mode, 1)
-})
-
-Rules('calculate the mean of selectors', () => {
-  assert.is(analyze(`
-    html {}
-    a,
-    b {}
-  `).rules.selectors.mean, 1.5)
-})
-
-Rules('calculate the median of selectors', () => {
-  assert.is(analyze(`
-    html {}
-    a,
-    b {}
-  `).rules.selectors.median, 1.5)
-})
-
-Rules('calculate the range of selectors', () => {
-  assert.is(analyze(`
-    html {}
-
-    a,
-    b {}
-
-    a,
-    b,
-    c {}
-  `).rules.selectors.range, 2)
-})
-
-
-Rules('calculate the minimum declarations', () => {
-  assert.is(analyze(`
-    html {}
-    test {
-      color: red;
-    }
-  `).rules.declarations.min, 0)
-  assert.is(analyze('@media print {}').rules.declarations.min, 0)
-})
-
-Rules('calculate the maximum declarations', () => {
-  assert.is(analyze(`
-    html {}
-    test {
-      a: 1;
-      b: 2;
-      c: 3;
-    }
-  `).rules.declarations.max, 3)
-
-  assert.is(analyze(`
-    html {}
-    test {
-      a: 1;
-      b: 2;
-      c: 3;
-    }
-
-    @media print {
-      test {
-        a: 1;
-        b: 2;
-        c: 3;
-        d: 4;
-      }
-    }
-  `).rules.declarations.max, 4)
-})
-
-Rules('calculate the mode of declarations', () => {
-  assert.is(analyze(`
-    html {
-      a: 1;
-    }
-    test {
-      a: 1;
-    }
-    test {
-      a: 1;
-      b: 2;
-    }
-  `).rules.declarations.mode, 1)
-})
-
-Rules('calculate the mean of declarations', () => {
-  assert.is(analyze(`
-    html {
-      a: 1;
-    }
-    a {
-      a: 1;
-      b: 2;
-    }
-    b {
-      a: 1;
-      b: 2;
-      c: 3;
-    }
-  `).rules.declarations.mean, 2)
-})
-
-Rules('calculate the median of declarations', () => {
-  assert.is(analyze(`
-    html {
-      a: 1;
-    }
-    a {
-      a: 1;
-      b: 2;
-    }
-    b {
-      a: 1;
-      b: 2;
-      c: 3;
-    }
-  `).rules.declarations.median, 2)
-})
-
-Rules('calculate the range of declarations', () => {
-  assert.is(analyze(`
-    html {
-      a: 1;
-    }
-    a {
-      a: 1;
-      b: 2;
-    }
-    b {
-      a: 1;
-      b: 2;
-      c: 3;
-    }
-  `).rules.declarations.range, 2)
-})
-
-Rules('return a list of declaration counts per rule', () => {
-  const actual = analyze(`
-    html {
-      a: 1;
-    }
-    a {
-      a: 1;
-      b: 2;
-    }
-    b {
-      a: 1;
-      b: 2;
-      c: 3;
-    }
-
-    @media print {
-      @supports (display: grid) {
-        c {
-          a: 1;
-          b: 2;
-        }
-        d {}
-      }
-    }
-  `).rules.declarations.items
-  const expected = [1, 2, 3, 2, 0]
-  assert.equal(actual, expected)
-})
-
-Rules('return a list of selectors counts per rule', () => {
-  const actual = analyze(`
-    x {
-      a: 1;
-    }
-    a,
-    b {
-      a: 1;
-      b: 2;
-    }
-    c,
-    d,
-    e {
-      a: 1;
-      b: 2;
-      c: 3;
-    }
-
-    @media print {
-      @supports (display: grid) {
-        f {
-          a: 1;
-          b: 2;
-        }
-      }
-    }
-  `).rules.declarations.items
-  const expected = [1, 2, 3, 2]
-  assert.equal(actual, expected)
-})
-
-Rules.run()

package/src/selectors/complexity.test.js

@@ -1,123 +0,0 @@
-import { suite } from 'uvu'
-import * as assert from 'uvu/assert'
-import { analyze } from '../index.js'
-
-const Complexity = suite('Selector Complexity')
-
-const fixture = `
-  *,
-  * + *,
-  a,
-  a b,
-  a + b,
-  a ~ b,
-  #id,
-  .className,
-  [attr],
-  [attr=value],
-  :where(#id, .class),
-  main > :is(h1, h2) {}
-`
-
-Complexity('calculates complexity', () => {
-  const actual = analyze(fixture).selectors.complexity.items
-  const expected = [
-    1,
-    3,
-    1,
-    3,
-    3,
-    3,
-    1,
-    1,
-    1,
-    2,
-    3,
-    5,
-  ]
-
-  assert.equal(actual, expected)
-})
-
-Complexity('calculates complexity uniqueness', () => {
-  const actual = analyze(fixture).selectors.complexity
-  const expected = {
-    '1': 5,
-    '2': 1,
-    '3': 5,
-    '5': 1
-  }
-
-  assert.is(actual.totalUnique, 4)
-  assert.is(actual.uniquenessRatio, 4 / 12)
-  assert.equal(actual.unique, expected)
-})
-
-Complexity('calculates the lowest complexity', () => {
-  const fixture = `
-    #test,
-    .me,
-    now,
-    [crazy] ~ .selector > for [no|="good"] {}
-  `
-  const actual = analyze(fixture).selectors.complexity.min
-  assert.equal(actual, 1)
-})
-
-Complexity('calculates the highest complexity', () => {
-  const fixture = `
-    #test,
-    .me,
-    now,
-    [crazy] ~ .selector > for [no|="good"] {}
-  `
-  const actual = analyze(fixture).selectors.complexity.max
-  assert.equal(actual, 8)
-})
-
-Complexity('calculates the complexity mean', () => {
-  const fixture = `
-    #test,
-    .me,
-    now,
-    [crazy] ~ .selector > for [no|="good"] {}
-  `
-  const result = analyze(fixture)
-  const actual = result.selectors.complexity.mean
-  assert.equal(actual, (1 + 1 + 1 + 8) / 4)
-})
-
-Complexity('calculates the complexity mode', () => {
-  const fixture = `
-    #test,
-    .me,
-    now,
-    [crazy] ~ .selector > for [no|="good"] {}
-  `
-  const actual = analyze(fixture).selectors.complexity.mode
-  assert.equal(actual, 1)
-})
-
-Complexity('calculates the complexity median', () => {
-  const fixture = `
-    #test,
-    .me,
-    now,
-    [crazy] ~ .selector > check {}
-  `
-  const actual = analyze(fixture).selectors.complexity.median
-  assert.equal(actual, 1)
-})
-
-Complexity('calculates total complexity', () => {
-  const fixture = `
-    #test,
-    .me,
-    now,
-    [crazy] ~ .selector > for [no|="good"] {}
-  `
-  const actual = analyze(fixture).selectors.complexity.sum
-  assert.equal(actual, 11)
-})
-
-Complexity.run()

package/src/selectors/selectors.js

@@ -1,122 +0,0 @@
-import { analyzeSpecificity, compareSpecificity } from './specificity.js'
-import { AggregateCollection } from '../aggregate-collection.js'
-import { CountableCollection } from '../countable-collection.js'
-
-/** @typedef {[number, number, number]} Specificity */
-
-const analyzeSelectors = ({ stringifyNode, selectors }) => {
-  const counts = Object.create(null)
-  const cache = Object.create(null)
-  const totalSelectors = selectors.length
-
-  /** @type Specificity|undefined */
-  let maxSpecificity
-  /** @type Specificity|undefined */
-  let minSpecificity
-  let specificityA = new AggregateCollection(totalSelectors)
-  let specificityB = new AggregateCollection(totalSelectors)
-  let specificityC = new AggregateCollection(totalSelectors)
-  let totalUnique = 0
-  const complexityAggregator = new AggregateCollection(totalSelectors);
-
-  const specificities = []
-  const complexities = []
-  const ids = new CountableCollection()
-  const a11y = new CountableCollection()
-  const keyframes = new CountableCollection()
-
-  for (let i = 0; i < totalSelectors; i++) {
-    const node = selectors[i];
-    const value = stringifyNode(node)
-
-    if (node.isKeyframeSelector) {
-      keyframes.push(value)
-      // Do not attempt to further analyze <keyframe-selectors>
-      continue
-    }
-
-    const { specificity, complexity, isId, isA11y } = cache[value] || analyzeSpecificity(node)
-
-    if (isId) {
-      ids.push(value)
-    }
-
-    if (isA11y) {
-      a11y.push(value)
-    }
-
-    if (!cache[value]) {
-      cache[value] = { complexity, specificity, isId, isA11y }
-      totalUnique++
-      counts[value] = 1
-    } else {
-      counts[value]++
-    }
-
-    complexityAggregator.add(complexity)
-
-    if (maxSpecificity === undefined) {
-      maxSpecificity = specificity
-    }
-
-    if (minSpecificity === undefined) {
-      minSpecificity = specificity
-    }
-
-    specificityA.add(specificity[0])
-    specificityB.add(specificity[1])
-    specificityC.add(specificity[2])
-
-    if (minSpecificity !== undefined && compareSpecificity(minSpecificity, specificity) < 0) {
-      minSpecificity = specificity
-    }
-
-    if (maxSpecificity !== undefined && compareSpecificity(maxSpecificity, specificity) > 0) {
-      maxSpecificity = specificity
-    }
-
-    specificities.push(specificity)
-    complexities.push(complexity)
-  }
-
-  const aggregatesA = specificityA.aggregate()
-  const aggregatesB = specificityB.aggregate()
-  const aggregatesC = specificityC.aggregate()
-  const complexityCount = new CountableCollection(complexities).count()
-
-  return {
-    total: totalSelectors,
-    totalUnique,
-    uniquenessRatio: totalUnique / totalSelectors,
-    specificity: {
-      sum: [aggregatesA.sum, aggregatesB.sum, aggregatesC.sum],
-      min: minSpecificity,
-      max: maxSpecificity,
-      mean: [aggregatesA.mean, aggregatesB.mean, aggregatesC.mean],
-      mode: [aggregatesA.mode, aggregatesB.mode, aggregatesC.mode],
-      median: [aggregatesA.median, aggregatesB.median, aggregatesC.median],
-      items: specificities
-    },
-    complexity: {
-      ...complexityAggregator.aggregate(),
-      ...complexityCount,
-      items: complexities,
-    },
-    id: {
-      ...ids.count(),
-      ratio: ids.size() / totalSelectors,
-    },
-    accessibility: {
-      ...a11y.count(),
-      ratio: a11y.size() / totalSelectors,
-    },
-    keyframes: {
-      ...keyframes.count(),
-      ratio: keyframes.size() / totalSelectors,
-    }
-  }
-}
-
-export {
-  analyzeSelectors
-}

package/src/selectors/selectors.test.js

@@ -1,189 +0,0 @@
-import { suite } from 'uvu'
-import * as assert from 'uvu/assert'
-import { analyze } from '../index.js'
-
-const Selectors = suite('Selectors')
-
-Selectors('are analyzed', () => {
-  const fixture = `
-    rule {
-      color: green;
-    }
-
-    @media print {
-      @media (min-width: 1000px) {
-        @supports (display: grid) {
-          another-rule {
-            color: purple;
-          }
-        }
-      }
-    }
-  `
-  const actual = analyze(fixture).selectors.total
-
-  assert.equal(actual, 2)
-})
-
-Selectors('have their complexity calculated', () => {
-  const fixture = `
-    rule {
-      color: green;
-    }
-
-    @media print {
-      @media (min-width: 1000px) {
-        @supports (display: grid) {
-          another-rule {
-            color: purple;
-          }
-        }
-      }
-    }
-  `
-  const actual = analyze(fixture).selectors.complexity.items
-  const expected = [1, 1]
-
-  assert.equal(actual, expected)
-})
-
-Selectors('have their specificity calculated', () => {
-  const fixture = `
-    rule {
-      color: green;
-    }
-
-    @media print {
-      @media (min-width: 1000px) {
-        @supports (display: grid) {
-          another-rule {
-            color: purple;
-          }
-        }
-      }
-    }
-  `
-  const actual = analyze(fixture)
-  const expected = [
-    [0, 0, 1,],
-    [0, 0, 1,]
-  ]
-
-  assert.equal(actual.selectors.specificity.items, expected)
-  assert.equal(actual.selectors.total, 2)
-})
-
-Selectors('calculates selector uniqueness', () => {
-  const fixture = `
-    a {}
-    b {}
-
-    @media print {
-      b {}
-      c {}
-    }
-  `
-  const actual = analyze(fixture).selectors
-
-  assert.is(actual.total, 4)
-  assert.is(actual.totalUnique, 3)
-  assert.is(actual.uniquenessRatio, 3 / 4)
-})
-
-Selectors('counts <keyframes-selector>s', () => {
-  const fixture = `
-    myElement1 {
-      opacity: 1;
-    }
-
-    @keyframes test1 {
-      from {
-        opacity: 1;
-      }
-      50% {
-        opacity: 0;
-      }
-      to {
-        opacity: 1;
-      }
-    }
-
-    @media only screen {
-      myElement2 {
-        opacity: 1;
-      }
-
-      @keyframes test2 {
-        from {
-          opacity: 0.1;
-        }
-      }
-    }
-  `
-  const result = analyze(fixture)
-  const actual = result.selectors
-  assert.is(actual.total, 6)
-  assert.equal(actual.keyframes, {
-    total: 4,
-    totalUnique: 3,
-    unique: {
-      from: 2,
-      to: 1,
-      '50%': 1
-    },
-    uniquenessRatio: 3 / 4,
-    ratio: 4 / 6
-  })
-})
-
-Selectors('counts ID selectors', () => {
-  const fixture = `
-    #myId,
-    #myId,
-    element#id,
-    #multiple #ids { }
-
-    /* Not an ID */
-    [href="#hash"] { }
-  `
-  const actual = analyze(fixture).selectors.id
-  const expected = {
-    total: 4,
-    totalUnique: 3,
-    unique: {
-      '#myId': 2,
-      'element#id': 1,
-      '#multiple #ids': 1,
-    },
-    uniquenessRatio: 3 / 4,
-    ratio: 4 / 5
-  }
-
-  assert.equal(actual, expected)
-})
-
-Selectors('counts Accessibility selectors', () => {
-  const fixture = `
-    [aria-hidden],
-    img[role="presentation"] {}
-
-    /* false positives */
-    img[loading="lazy"],
-    [hidden] {}
-  `
-  const actual = analyze(fixture).selectors.accessibility
-  const expected = {
-    total: 2,
-    totalUnique: 2,
-    unique: {
-      '[aria-hidden]': 1,
-      'img[role="presentation"]': 1,
-    },
-    uniquenessRatio: 1 / 1,
-    ratio: 2 / 4
-  }
-
-  assert.equal(actual, expected)
-})
-
-Selectors.run()