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

package/src/values/font-families.js

@@ -1,98 +0,0 @@
-import * as csstree from 'css-tree'
-import { CountableCollection } from '../countable-collection.js'
-
-const systemKeywords = {
-  // Global CSS keywords
-  'inherit': 1,
-  'initial': 1,
-  'unset': 1,
-  'revert': 1,
-
-  // System font keywords
-  'caption': 1,
-  'icon': 1,
-  'menu': 1,
-  'message-box': 1,
-  'small-caption': 1,
-  'status-bar': 1,
-}
-
-const keywordDisallowList = {
-  // font-weight, font-stretch, font-style
-  'normal': 1,
-
-  // font-size keywords
-  'xx-small': 1,
-  'x-small': 1,
-  'small': 1,
-  'medium': 1,
-  'large': 1,
-  'x-large': 1,
-  'xx-large': 1,
-  'larger': 1,
-  'smaller': 1,
-
-  // font-weight keywords
-  'bold': 1,
-  'bolder': 1,
-  'lighter': 1,
-
-  // font-stretch keywords
-  'ultra-condensed': 1,
-  'extra-condensed': 1,
-  'condensed': 1,
-  'semi-condensed': 1,
-  'semi-expanded': 1,
-  'expanded': 1,
-  'extra-expanded': 1,
-  'ultra-expanded': 1,
-
-  // font-style keywords
-  'italic': 1,
-  'oblique': 1,
-}
-
-const COMMA = 44 // ','.charCodeAt(0) === 44
-
-const analyzeFontFamilies = ({ fontValues, fontFamilyValues }) => {
-  const all = new CountableCollection(fontFamilyValues)
-
-  for (let index = 0; index < fontValues.length; index++) {
-    const value = fontValues[index]
-
-    // Avoid tree traversal as soon as possible
-    const firstChild = value.children.first
-
-    if (firstChild.type === 'Identifier' && systemKeywords[firstChild.name]) {
-      continue
-    }
-
-    const parts = []
-
-    csstree.walk(value, {
-      reverse: true,
-      enter: function (fontNode) {
-        if (fontNode.type === 'String') {
-          return parts.unshift(fontNode)
-        }
-        if (fontNode.type === 'Operator' && fontNode.value.charCodeAt(0) === COMMA) {
-          return parts.unshift(fontNode)
-        }
-        if (fontNode.type === 'Identifier') {
-          if (keywordDisallowList[fontNode.name]) {
-            return this.skip
-          }
-          return parts.unshift(fontNode)
-        }
-      }
-    })
-
-    all.push(parts.map(csstree.generate).join(''))
-  }
-
-  return all.count()
-}
-
-export {
-  analyzeFontFamilies
-}

package/src/values/font-families.test.js

@@ -1,119 +0,0 @@
-import { suite } from 'uvu';
-import * as assert from 'uvu/assert';
-import { analyze } from '../index.js'
-
-const FontFamilies = suite('FontFamilies')
-
-FontFamilies('recognizes a font-family', () => {
-  const fixture = `
-    test {
-      font-family: "Droid Sans", serif;
-      font-family: sans-serif;
-      font-family: "Arial Black", "Arial Bold", Gadget, sans-serif;
-      font-family: "Brush Script MT", cursive;
-      font-family: monospace;
-      font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
-      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-
-      /* Unrelated */
-      color: brown;
-      font-size: 12px;
-    }
-  `
-  const actual = analyze(fixture).values.fontFamilies
-  const expected = {
-    total: 7,
-    totalUnique: 7,
-    unique: {
-      '"Droid Sans", serif': 1,
-      'sans-serif': 1,
-      '"Arial Black", "Arial Bold", Gadget, sans-serif': 1,
-      '"Brush Script MT", cursive': 1,
-      'monospace': 1,
-      'Consolas, "Liberation Mono", Menlo, Courier, monospace': 1,
-      '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"': 1,
-    },
-    uniquenessRatio: 7 / 7
-  }
-
-  assert.equal(actual, expected)
-})
-
-FontFamilies('extracts the `font` shorthand', () => {
-  const fixture = `
-    test {
-      font: large "Noto Sans";
-      font: normal normal 1em/1 "Source Sans Pro", serif;
-      font: normal normal 1.2em serif;
-      font: 400 1.3em/1 serif;
-      font: 1em / 1 serif;
-      font: 1em/ 1 serif;
-      font: 1em /1 serif;
-      font: normal normal 11px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-      font: 11px Consolas, "Liberation Mono", Menlo, Courier, monospace;
-      font: 0/0 a; /* As generated by some css minifiers */
-
-      /* Unrelated */
-      color: brown;
-      font-size: 12px;
-    }
-  `
-  const actual = analyze(fixture).values.fontFamilies
-  const expected = {
-    total: 10,
-    totalUnique: 6,
-    unique: {
-      '"Noto Sans"': 1,
-      '"Source Sans Pro",serif': 1,
-      'serif': 5,
-      '-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol"': 1,
-      'Consolas,"Liberation Mono",Menlo,Courier,monospace': 1,
-      'a': 1,
-    },
-    uniquenessRatio: 6 / 10
-  }
-  assert.equal(actual, expected)
-})
-
-FontFamilies('handles system fonts', () => {
-  // Source: https://drafts.csswg.org/css-fonts-3/#font-prop
-  const fixture = `
-    test {
-      font: menu;        /* use the font settings for system menus */
-      font: large menu;  /* use a font family named "menu" */
-    }
-  `
-  const actual = analyze(fixture).values.fontFamilies
-  const expected = {
-    total: 1,
-    totalUnique: 1,
-    unique: {
-      'menu': 1
-    },
-    uniquenessRatio: 1 / 1
-  }
-
-  assert.equal(actual, expected)
-})
-
-FontFamilies('ignores keywords and global values', () => {
-  const fixture = `
-    test {
-      font: inherit;
-      font: initial;
-      font: unset;
-      font: revert;
-    }
-  `
-  const actual = analyze(fixture).values.fontFamilies
-  const expected = {
-    total: 0,
-    totalUnique: 0,
-    unique: {},
-    uniquenessRatio: 0
-  }
-
-  assert.equal(actual, expected)
-})
-
-FontFamilies.run()

package/src/values/font-sizes.js

@@ -1,92 +0,0 @@
-import * as csstree from 'css-tree'
-import { CountableCollection } from '../countable-collection.js'
-
-const sizeKeywords = {
-  'xx-small': 1,
-  'x-small': 1,
-  'small': 1,
-  'medium': 1,
-  'large': 1,
-  'x-large': 1,
-  'xx-large': 1,
-  'larger': 1,
-  'smaller': 1,
-}
-
-const keywords = {
-  // Global CSS keywords
-  'inherit': 1,
-  'initial': 1,
-  'unset': 1,
-  'revert': 1,
-
-  // System font keywords
-  'caption': 1,
-  'icon': 1,
-  'menu': 1,
-  'message-box': 1,
-  'small-caption': 1,
-  'status-bar': 1,
-}
-
-const ZERO = 48 // '0'.charCodeAt(0) === 48
-const SLASH = 47 // '/'.charCodeAt(0) === 47
-
-const analyzeFontSizes = ({ stringifyNode, fontSizeValues, fontValues }) => {
-  const all = new CountableCollection(fontSizeValues)
-
-  for (let index = 0; index < fontValues.length; index++) {
-    const fontNode = fontValues[index];
-    // Try to eliminate a keyword before we continue
-    const firstChild = fontNode.children.first
-
-    if (firstChild.type === 'Identifier' && keywords[firstChild.name]) {
-      continue
-    }
-
-    let operator = false
-    let size
-
-    csstree.walk(fontNode, {
-      enter: function (fontNode) {
-        switch (fontNode.type) {
-          case 'Number': {
-            // Special case for `font: 0/0 a`
-            if (fontNode.value.charCodeAt(0) === ZERO) {
-              size = '0'
-              return this.break
-            }
-          }
-          case 'Operator': {
-            if (fontNode.value.charCodeAt(0) === SLASH) {
-              operator = true
-            }
-            break
-          }
-          case 'Dimension': {
-            if (!operator) {
-              size = stringifyNode(fontNode)
-              return this.break
-            }
-          }
-          case 'Identifier': {
-            if (sizeKeywords[fontNode.name]) {
-              size = fontNode.name
-              return this.break
-            }
-          }
-        }
-      }
-    })
-
-    if (size) {
-      all.push(size)
-    }
-  }
-
-  return all.count()
-}
-
-export {
-  analyzeFontSizes
-}

package/src/values/font-sizes.test.js

@@ -1,120 +0,0 @@
-import { suite } from 'uvu';
-import * as assert from 'uvu/assert';
-import { analyze } from '../index.js'
-
-const FontSizes = suite('FontSizes')
-
-FontSizes('recognizes a font-size', () => {
-  const fixture = `
-    test {
-      font-size: 10px;
-      font-size: small;
-      font-size: 1em;
-      font-size: calc(3vw + 1em);
-
-      /* Unrelated */
-      color: brown;
-      font-family: serif;
-    }
-  `
-  const actual = analyze(fixture).values.fontSizes
-  const expected = {
-    total: 4,
-    totalUnique: 4,
-    unique: {
-      '10px': 1,
-      'small': 1,
-      '1em': 1,
-      'calc(3vw + 1em)': 1,
-    },
-    uniquenessRatio: 4 / 4
-  }
-
-  assert.equal(actual, expected)
-})
-
-FontSizes('extracts the `font` shorthand', () => {
-  const fixture = `
-    test {
-      font: large "Noto Sans";
-      font: normal normal 1em/1 "Source Sans Pro", serif;
-      font: normal normal 1.2em serif;
-      font: 400 1.3em/1 serif;
-      font: 1em / 1 serif;
-      font: 1em/ 1 serif;
-      font: 1em /1 serif;
-      font: 2em/1.4em serif;
-      font: normal normal 11px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-      font: 11px Consolas, "Liberation Mono", Menlo, Courier, monospace;
-      font: 0/0 a; /* As generated by some css minifiers */
-
-      /* Unrelated */
-      color: brown;
-      font-family: serif;
-    }
-  `
-  const actual = analyze(fixture).values.fontSizes
-  const expected = {
-    total: 11,
-    totalUnique: 7,
-    unique: {
-      '0': 1,
-      'large': 1,
-      '1em': 4,
-      '1.2em': 1,
-      '1.3em': 1,
-      '2em': 1,
-      '11px': 2,
-    },
-    uniquenessRatio: 7 / 11
-  }
-  assert.equal(actual, expected)
-})
-
-FontSizes('handles system fonts', () => {
-  // Source: https://drafts.csswg.org/css-fonts-3/#font-prop
-  const fixture = `
-    test {
-      font: menu;        /* use the font settings for system menus */
-      font: large menu;  /* use a font family named "menu" */
-    }
-  `
-  const actual = analyze(fixture).values.fontSizes
-  const expected = {
-    total: 1,
-    totalUnique: 1,
-    unique: {
-      'large': 1,
-    },
-    uniquenessRatio: 1
-  }
-
-  assert.equal(actual, expected)
-})
-
-FontSizes('ignores keywords and global values', () => {
-  const fixture = `
-    test {
-      font: inherit;
-      font: initial;
-      font: unset;
-      font: revert;
-
-      /*TODO:font-size: inherit;
-      font-size: initial;
-      font-size: unset;
-      font-size: revert;*/
-    }
-  `
-  const actual = analyze(fixture).values.fontSizes
-  const expected = {
-    total: 0,
-    totalUnique: 0,
-    unique: {},
-    uniquenessRatio: 0
-  }
-
-  assert.equal(actual, expected)
-})
-
-FontSizes.run()

package/src/values/text-shadows.test.js

@@ -1,93 +0,0 @@
-import { suite } from 'uvu'
-import * as assert from 'uvu/assert'
-import { analyze } from '../index.js'
-
-const TextShadows = suite('TextShadows')
-
-TextShadows('finds simple values', () => {
-  const fixture = `
-    text-shadows-simple {
-      text-shadow: 1px 1px 2px black;
-      text-shadow: #fc0 1px 0 10px;
-      text-shadow: 5px 5px #558abb;
-      text-shadow: white 2px 5px;
-      text-shadow: 5px 10px;
-      text-shadow: red 0 -2px;
-    }
-  `
-  const actual = analyze(fixture).values.textShadows
-  const expected = {
-    total: 6,
-    unique: {
-      '1px 1px 2px black': 1,
-      '#fc0 1px 0 10px': 1,
-      '5px 5px #558abb': 1,
-      'white 2px 5px': 1,
-      '5px 10px': 1,
-      'red 0 -2px': 1,
-    },
-    totalUnique: 6,
-    uniquenessRatio: 1
-  }
-
-  assert.equal(actual, expected)
-})
-
-TextShadows('finds complex values', () => {
-  const fixture = `
-    text-shadows-complex {
-      text-shadow: 1px 1px 2px black, 0 0 1em blue, 0 0 0.2em blue;
-    }
-  `
-  const actual = analyze(fixture).values.textShadows
-  const expected = {
-    total: 1,
-    unique: {
-      '1px 1px 2px black, 0 0 1em blue, 0 0 0.2em blue': 1,
-    },
-    totalUnique: 1,
-    uniquenessRatio: 1
-  }
-
-  assert.equal(actual, expected)
-})
-
-TextShadows('finds vendor prefixed values', () => {
-  const fixture = `
-    text-shadows-vendor-prefixed {
-      -webkit-text-shadow: 1px 1px 2px black;
-    }
-  `
-  const actual = analyze(fixture).values.textShadows
-  const expected = {
-    total: 1,
-    unique: {
-      '1px 1px 2px black': 1,
-    },
-    totalUnique: 1,
-    uniquenessRatio: 1
-  }
-
-  assert.equal(actual, expected)
-})
-
-TextShadows('ignores keywords', () => {
-  const fixture = `
-    text-shadows-keyword {
-      text-shadow: initial;
-      text-shadow: none;
-      text-shadow: inherit;
-    }
-  `
-  const actual = analyze(fixture).values.textShadows
-  const expected = {
-    total: 0,
-    unique: {},
-    totalUnique: 0,
-    uniquenessRatio: 0
-  }
-
-  assert.equal(actual, expected)
-})
-
-TextShadows.run()

package/src/values/units.test.js

@@ -1,72 +0,0 @@
-import { suite } from 'uvu'
-import * as assert from 'uvu/assert'
-import { analyze } from '../index.js'
-
-const Units = suite('Units')
-
-Units('analyzes length units', () => {
-  const fixture = `
-    test {
-      font: normal 10px/11px Arial;
-      font: 14px sans-serif;
-    }
-
-    @media (min-width: 10em) {
-      test2 {
-        width: 12vw;
-        height: 13vmin;
-      }
-    }
-
-    @supports (hover: hover) {
-      @media all {
-        @media screen and (max-width: 100px) {
-          line-height: 2;
-        }
-      }
-    }
-  `
-  const result = analyze(fixture)
-  const actual = result.values.units
-
-  const expected = {
-    total: 5,
-    totalUnique: 3,
-    uniquenessRatio: 3 / 5,
-    unique: {
-      px: 3,
-      vw: 1,
-      vmin: 1,
-    },
-    itemsPerContext: {
-      font: {
-        total: 3,
-        totalUnique: 1,
-        uniquenessRatio: 1 / 3,
-        unique: {
-          px: 3,
-        },
-      },
-      width: {
-        total: 1,
-        totalUnique: 1,
-        uniquenessRatio: 1,
-        unique: {
-          vw: 1,
-        },
-      },
-      height: {
-        total: 1,
-        totalUnique: 1,
-        uniquenessRatio: 1,
-        unique: {
-          vmin: 1,
-        },
-      },
-    },
-  }
-
-  assert.equal(actual, expected)
-})
-
-Units.run()

package/src/values/values.js

@@ -1,30 +0,0 @@
-import { CountableCollection } from '../countable-collection.js'
-
-const keywords = {
-  'auto': 1,
-  'inherit': 1,
-  'initial': 1,
-  'unset': 1,
-  'revert': 1,
-  'none': 1, // for `text-shadow`
-}
-
-const analyzeValues = ({ values, stringifyNode }) => {
-  const all = new CountableCollection()
-
-  for (let i = 0; i < values.length; i++) {
-    const node = values[i]
-    const firstChild = node.children.first
-
-    if (!firstChild) continue
-    if (firstChild.type === 'Identifier' && keywords[firstChild.name]) continue
-
-    all.push(stringifyNode(node))
-  }
-
-  return all.count()
-}
-
-export {
-  analyzeValues
-}

package/src/values/vendor-prefix.js

@@ -1,45 +0,0 @@
-import { CountableCollection } from '../countable-collection.js'
-import { hasVendorPrefix } from '../vendor-prefix.js'
-
-function isAstVendorPrefixed(children) {
-  children = children.toArray()
-
-  for (let index = 0; index < children.length; index++) {
-    const child = children[index];
-
-    if (child.type === 'Identifier' && child.name.length >= 3) {
-      if (hasVendorPrefix(child.name)) {
-        return true
-      }
-    }
-
-    if (child.type === 'Function') {
-      if (hasVendorPrefix(child.name)) {
-        return true
-      }
-
-      if (child.children && isAstVendorPrefixed(child.children)) {
-        return true
-      }
-    }
-  }
-  return false
-}
-
-const analyzeVendorPrefixes = ({ values, stringifyNode }) => {
-  const all = new CountableCollection()
-
-  for (let i = 0; i < values.length; i++) {
-    const value = values[i]
-
-    if (value.children && isAstVendorPrefixed(value.children)) {
-      all.push(stringifyNode(value))
-    }
-  }
-
-  return all.count()
-}
-
-export {
-  analyzeVendorPrefixes
-}