@thejaredwilcurt/csslop 0.0.38 → 0.0.39

package/src/rules/lang.js

@@ -5,9 +5,12 @@
  */
 
 import {
-  findMatchingCloseParenthesis,
-  findNextFunctionCallOutsideStrings
-} from './selectors.js';
+  findMatchingParenthesis,
+  skipParenthesizedGroup,
+  splitTopLevel
+} from '../parser/source-search.js';
+
+import { findNextFunctionCallOutsideStrings } from './selectors.js';
 
 /**
  * The `:lang()` pseudo-class opening, as it is written in minified output.
@@ -79,49 +82,6 @@ function requiresEscape (character) {
   );
 }
 
-/**
- * Splits the argument list of a `:lang()` into its individual language-codes,
- * treating only the commas outside of a quoted code as separators.
- *
- * @param  {string} argumentList  The text between the parentheses of a `:lang()`.
- * @return {Array}                The language-codes, still in the form they were written in.
- */
-function splitLanguageCodes (argumentList) {
-  const codes = [];
-  let current = '';
-  let openQuote = '';
-  for (let index = 0; index < argumentList.length; index++) {
-    const character = argumentList[index];
-    const nextCharacter = argumentList[index + 1] ?? '';
-    if (character === '\\') {
-      // An escape carries the character behind it along, whatever it may be
-      current += character + nextCharacter;
-      index++;
-      continue;
-    }
-    if (openQuote) {
-      current += character;
-      if (character === openQuote) {
-        openQuote = '';
-      }
-      continue;
-    }
-    if (character === '"' || character === '\'') {
-      openQuote = character;
-      current += character;
-      continue;
-    }
-    if (character === ',') {
-      codes.push(current);
-      current = '';
-      continue;
-    }
-    current += character;
-  }
-  codes.push(current);
-  return codes;
-}
-
 /**
  * Reads the plain language-code out of one `:lang()` argument, stripping the
  * quotes or escapes that were only there to let it be written. Arguments this
@@ -191,7 +151,7 @@ function formatLanguageCode (code) {
  */
 function minifyLanguageArguments (argumentList) {
   const codes = [];
-  for (const argument of splitLanguageCodes(argumentList)) {
+  for (const argument of splitTopLevel(argumentList, ',')) {
     const code = readLanguageCode(argument);
     if (code === null) {
       return null;
@@ -217,7 +177,7 @@ function findLanguageFunctions (selector) {
       break;
     }
     const openIndex = startIndex + LANGUAGE_FUNCTION.length - 1;
-    const closeIndex = findMatchingCloseParenthesis(selector, openIndex);
+    const closeIndex = findMatchingParenthesis(selector, openIndex);
     if (closeIndex === -1) {
       break;
     }
@@ -271,15 +231,19 @@ function minifyLanguageSelector (selector) {
  * @return {boolean}           True when an enclosing parenthesis is still open at that position.
  */
 function isInsideFunction (selector, index) {
-  let depth = 0;
-  for (const character of selector.slice(0, index)) {
-    if (character === '(') {
-      depth++;
-    } else if (character === ')') {
-      depth--;
+  let position = 0;
+  while (position < index) {
+    if (selector[position] !== '(') {
+      position++;
+      continue;
+    }
+    const afterGroupIndex = skipParenthesizedGroup(selector, position);
+    if (afterGroupIndex > index) {
+      return true;
     }
+    position = afterGroupIndex;
   }
-  return depth > 0;
+  return false;
 }
 
 /**
@@ -305,7 +269,7 @@ function splitAroundLanguageCodes (selector) {
   if (isInsideFunction(selector, startIndex)) {
     return null;
   }
-  const codes = splitLanguageCodes(selector.slice(openIndex + 1, closeIndex)).map((code) => {
+  const codes = splitTopLevel(selector.slice(openIndex + 1, closeIndex), ',').map((code) => {
     return code.trim();
   });
   if (codes.some((code) => {

package/src/rules/normalize.js

@@ -48,6 +48,85 @@ function unescapeSelector (selector) {
   });
 }
 
+/**
+ * Matches a single whitespace character.
+ *
+ * @type {RegExp}
+ */
+const WHITESPACE_CHARACTER = /\s/;
+
+/**
+ * Collapses every run of whitespace in a selector down to the single space a
+ * descendant combinator is written with, and trims the ends. Whitespace held
+ * inside a quoted string, or written as an escape, is copied through untouched:
+ * there it is part of the value being matched rather than a combinator.
+ *
+ * @param  {string} selector  The raw selector string.
+ * @return {string}           The selector with its combinator whitespace normalized.
+ */
+function normalizeSelectorWhitespace (selector) {
+  let normalized = '';
+  let quoteDelimiter = '';
+  let index = 0;
+  while (index < selector.length) {
+    const character = selector[index];
+    if (quoteDelimiter) {
+      if (character === '\\') {
+        normalized += selector.slice(index, index + 2);
+        index += 2;
+        continue;
+      }
+      if (character === quoteDelimiter) {
+        quoteDelimiter = '';
+      }
+      normalized += character;
+      index++;
+      continue;
+    }
+    if (character === '"' || character === '\'') {
+      quoteDelimiter = character;
+      normalized += character;
+      index++;
+      continue;
+    }
+    if (character === '\\') {
+      normalized += selector.slice(index, index + 2);
+      index += 2;
+      continue;
+    }
+    if (WHITESPACE_CHARACTER.test(character)) {
+      normalized += ' ';
+      while (index < selector.length && WHITESPACE_CHARACTER.test(selector[index])) {
+        index++;
+      }
+      continue;
+    }
+    normalized += character;
+    index++;
+  }
+  return normalized.trim();
+}
+
+/**
+ * Rewrites every selector in a stylesheet into its whitespace-normalized form,
+ * descending into nested rules and the bodies of at-rules. Running this before
+ * any rule is rewritten means each later pass compares, nests, and prints
+ * selectors that are already written the one canonical way, so a selector that
+ * happens to be spaced out in the source cannot leak that spacing into a
+ * selector the minifier builds from it.
+ *
+ * @param {Array} rules  The AST rule nodes to normalize.
+ */
+function normalizeRuleSelectors (rules) {
+  for (const rule of rules || []) {
+    if (rule?.selectors?.length) {
+      rule.selectors = rule.selectors.map(normalizeSelectorWhitespace);
+    }
+    normalizeRuleSelectors(rule?.rules);
+    normalizeRuleSelectors(rule?.declarations);
+  }
+}
+
 /**
  * Normalizes a `@layer` cascade layer name list by trimming it and removing the
  * optional whitespace that may surround the commas separating the layer names.
@@ -126,6 +205,7 @@ export {
   canUnwrapSupports,
   normalizeLayerNames,
   normalizeMedia,
+  normalizeRuleSelectors,
   normalizeSupports,
   unescapeIdent,
   unescapeSelector

package/src/rules/optimize.js

@@ -6,6 +6,11 @@ import {
   expandToLeafProperties,
   getOverridesOf
 } from '../declarations/config.js';
+import {
+  findMatchingBracket,
+  findMatchingParenthesis,
+  splitTopLevelCommaList
+} from '../parser/source-search.js';
 import { escapeRegexString } from '../utilities.js';
 
 import {
@@ -562,88 +567,187 @@ function deduplicateSelectors (selectors) {
 }
 
 /**
- * Merges consecutive rules whose declarations are a subset of the following rule, combining their selectors and splitting out any extra declarations.
+ * The rule body entries that style nothing themselves, and so have no say in
+ * whether one rule's body is carried by another's.
  *
- * @param  {Array} rules  The AST rule nodes to merge.
- * @return {Array}        A new array of rules with declaration-compatible consecutive rules combined.
+ * @type {Set<string>}
  */
-function mergeByDeclarations (rules) {
-  const result = [];
-  for (const rule of rules) {
-    if (rule.type !== 'rule' || !rule.selectors?.length) {
-      result.push(rule);
+const UNSTYLED_BODY_ENTRY_TYPES = new Set(['whitespace', 'comment']);
+
+/**
+ * Splits a rule body into the declarations it sets directly and the blocks
+ * nested inside it, leaving out the entries that style nothing.
+ *
+ * @param  {Array}  declarations  The rule body entries.
+ * @return {object}               The body's `plainDeclarations` and `nestedBlocks`.
+ */
+function partitionRuleBody (declarations) {
+  const plainDeclarations = [];
+  const nestedBlocks = [];
+  for (const entry of declarations || []) {
+    if (UNSTYLED_BODY_ENTRY_TYPES.has(entry.type)) {
       continue;
     }
-    const previousRule = result[result.length - 1];
-    if (previousRule && previousRule.type === 'rule' && previousRule.selectors?.length) {
-      const previousDeclarations = (previousRule.declarations || []).filter((declaration) => {
-        return declaration.type !== 'whitespace' && declaration.property;
-      });
-      const currentDeclarations = (rule.declarations || []).filter((declaration) => {
-        return declaration.type !== 'whitespace' && declaration.property;
-      });
-      if (previousDeclarations.length > 0 && currentDeclarations.length > 0) {
-        const currentDeclarationMap = new Map(
-          currentDeclarations.map((declaration) => {
-            return [declaration.property, (declaration.value || '').trim()];
-          })
-        );
-        const previousIsSubset = previousDeclarations.every((declaration) => {
-          return currentDeclarationMap.get(declaration.property) === (declaration.value || '').trim();
-        });
-        const currentHasAllProperty = currentDeclarations.some((declaration) => {
-          return declaration.property === 'all';
-        });
-        if (previousIsSubset && !currentHasAllProperty) {
-          const commonProperties = new Set(
-            previousDeclarations.map((declaration) => {
-              return declaration.property;
-            })
-          );
-          const currentOnlyDeclarations = currentDeclarations.filter((declaration) => {
-            return !commonProperties.has(declaration.property);
-          });
-          result.pop();
-          const combinedSelectors = deduplicateSelectors([...previousRule.selectors, ...rule.selectors]);
-          result.push({ ...previousRule, selectors: combinedSelectors });
-          if (currentOnlyDeclarations.length > 0) {
-            result.push({ ...rule, declarations: currentOnlyDeclarations });
-          }
-          continue;
-        }
-      }
+    if (entry.property) {
+      plainDeclarations.push(entry);
+    } else {
+      nestedBlocks.push(entry);
     }
-    result.push(rule);
   }
-  return result;
+  return {
+    nestedBlocks,
+    plainDeclarations
+  };
 }
 
 /**
- * Splits a selector list on top-level commas, respecting parentheses and
- * brackets so commas inside `:is(...)` or `[attr="a,b"]` are not split.
+ * Describes a block nested inside a rule precisely enough to tell whether two
+ * rules nest the very same thing. Only plain nested rules can be described: an
+ * at-rule nested in a rule carries a prelude that decides when its body applies,
+ * so it is reported as indescribable rather than guessed at.
  *
- * @param  {string} selectorList  The selector list string.
- * @return {Array}                The individual selector strings.
+ * @param  {object}      block  A block nested inside a rule body.
+ * @return {string|null}        The signature, or null when the block cannot be described.
  */
-function splitSelectorListTopLevel (selectorList) {
-  const selectors = [];
-  let current = '';
-  let depth = 0;
-  for (const character of selectorList) {
-    if (character === '(' || character === '[') {
-      depth++;
-    } else if (character === ')' || character === ']') {
-      depth--;
-    }
-    if (character === ',' && depth === 0) {
-      selectors.push(current.trim());
-      current = '';
-    } else {
-      current += character;
+function nestedBlockSignature (block) {
+  if (block.type !== 'rule' || !block.selectors?.length) {
+    return null;
+  }
+  const {
+    nestedBlocks,
+    plainDeclarations
+  } = partitionRuleBody(block.declarations);
+  const declarationParts = plainDeclarations.map((declaration) => {
+    return declaration.property + ':' + (declaration.value || '').trim();
+  });
+  const nestedParts = nestedBlocksSignature(nestedBlocks);
+  if (nestedParts === null) {
+    return null;
+  }
+  const selectors = block.selectors.map(normalizeSelector).join(',');
+  return selectors + '{' + declarationParts.join(';') + nestedParts + '}';
+}
+
+/**
+ * Describes every block nested in a rule body as one comparable string, in the
+ * order the blocks are written, since that order decides which of them wins a
+ * conflict.
+ *
+ * @param  {Array}       nestedBlocks  The blocks nested in a rule body.
+ * @return {string|null}               The combined signature, or null when any block cannot be described.
+ */
+function nestedBlocksSignature (nestedBlocks) {
+  let combined = '';
+  for (const block of nestedBlocks) {
+    const signature = nestedBlockSignature(block);
+    if (signature === null) {
+      return null;
+    }
+    combined += signature;
+  }
+  return combined;
+}
+
+/**
+ * Reports whether a rule that nests blocks may take on further selectors. A
+ * nested selector resolves against its parent's whole selector list as `:is()`,
+ * which matches with the specificity of the strongest selector in that list, so
+ * the list may only grow while every selector in it weighs the same.
+ *
+ * @param  {Array}   selectors  The selector list the merged rule would carry.
+ * @return {boolean}            Whether the nested blocks keep their current weight.
+ */
+function selectorsShareSpecificity (selectors) {
+  const strongest = maximumRuleSpecificity(selectors);
+  const weakest = minimumRuleSpecificity(selectors);
+  return compareSpecificity(strongest, weakest) === 0;
+}
+
+/**
+ * Combines an earlier rule with the rule that follows it when everything the
+ * earlier one styles is restated by the later one, so the earlier selector can
+ * simply join the later rule's shared part and the remainder stays behind in a
+ * rule of its own.
+ *
+ * Both rules have to nest the same blocks. A block nested in only one of them
+ * would either be lost or start matching the other rule's selector, neither of
+ * which the two rules said.
+ *
+ * @param  {object}     previousRule  The rule immediately in front of `rule`.
+ * @param  {object}     rule          The rule being folded into its predecessor.
+ * @return {Array|null}               The rules that replace the pair, or null when they cannot be combined.
+ */
+function mergeRuleIntoPredecessor (previousRule, rule) {
+  const isMergeableRulePair = (
+    previousRule?.type === 'rule' &&
+    previousRule.selectors?.length &&
+    rule.type === 'rule' &&
+    rule.selectors?.length
+  );
+  if (!isMergeableRulePair) {
+    return null;
+  }
+  const previousBody = partitionRuleBody(previousRule.declarations);
+  const currentBody = partitionRuleBody(rule.declarations);
+  if (!previousBody.plainDeclarations.length || !currentBody.plainDeclarations.length) {
+    return null;
+  }
+  const previousNesting = nestedBlocksSignature(previousBody.nestedBlocks);
+  const currentNesting = nestedBlocksSignature(currentBody.nestedBlocks);
+  if (previousNesting === null || previousNesting !== currentNesting) {
+    return null;
+  }
+  const currentValueByProperty = new Map(
+    currentBody.plainDeclarations.map((declaration) => {
+      return [declaration.property, (declaration.value || '').trim()];
+    })
+  );
+  const previousIsRestated = previousBody.plainDeclarations.every((declaration) => {
+    return currentValueByProperty.get(declaration.property) === (declaration.value || '').trim();
+  });
+  // `all` rewrites every other property, so the later rule restating a value is
+  // no promise that it applies the same way once `all` has run.
+  const currentResetsEverything = currentValueByProperty.has('all');
+  if (!previousIsRestated || currentResetsEverything) {
+    return null;
+  }
+  const combinedSelectors = deduplicateSelectors([...previousRule.selectors, ...rule.selectors]);
+  if (previousBody.nestedBlocks.length && !selectorsShareSpecificity(combinedSelectors)) {
+    return null;
+  }
+  const restatedProperties = new Set(
+    previousBody.plainDeclarations.map((declaration) => {
+      return declaration.property;
+    })
+  );
+  const remainingDeclarations = currentBody.plainDeclarations.filter((declaration) => {
+    return !restatedProperties.has(declaration.property);
+  });
+  const merged = [{ ...previousRule, selectors: combinedSelectors }];
+  if (remainingDeclarations.length) {
+    merged.push({ ...rule, declarations: remainingDeclarations });
+  }
+  return merged;
+}
+
+/**
+ * Merges consecutive rules whose declarations are a subset of the following rule, combining their selectors and splitting out any extra declarations.
+ *
+ * @param  {Array} rules  The AST rule nodes to merge.
+ * @return {Array}        A new array of rules with declaration-compatible consecutive rules combined.
+ */
+function mergeByDeclarations (rules) {
+  const result = [];
+  for (const rule of rules) {
+    const merged = mergeRuleIntoPredecessor(result[result.length - 1], rule);
+    if (merged) {
+      result.pop();
+      result.push(...merged);
+      continue;
     }
+    result.push(rule);
   }
-  selectors.push(current.trim());
-  return selectors;
+  return result;
 }
 
 /**
@@ -662,28 +766,6 @@ function skipSelectorName (text, start) {
   return index;
 }
 
-/**
- * Finds the index of the closing parenthesis matching the one at openIndex.
- *
- * @param  {string} text       The text to scan.
- * @param  {number} openIndex  Index of the opening parenthesis.
- * @return {number}            Index of the matching close parenthesis, or text length.
- */
-function findMatchingParenthesisIndex (text, openIndex) {
-  let depth = 0;
-  for (let index = openIndex; index < text.length; index++) {
-    if (text[index] === '(') {
-      depth++;
-    } else if (text[index] === ')') {
-      depth--;
-      if (depth === 0) {
-        return index;
-      }
-    }
-  }
-  return text.length;
-}
-
 /**
  * Compares two specificity tuples [ids, classes, types] lexicographically.
  *
@@ -724,20 +806,9 @@ function computeSpecificity (selector) {
       index = skipSelectorName(text, index + 1);
     } else if (character === '[') {
       specificity[1]++;
-      // Advance to just past the matching closing bracket
-      let bracketDepth = 0;
-      while (index < text.length) {
-        if (text[index] === '[') {
-          bracketDepth++;
-        } else if (text[index] === ']') {
-          bracketDepth--;
-          if (bracketDepth === 0) {
-            index++;
-            break;
-          }
-        }
-        index++;
-      }
+      // An attribute selector that never closes runs to the end of the selector
+      const closeBracketIndex = findMatchingBracket(text, index);
+      index = closeBracketIndex === -1 ? text.length : closeBracketIndex + 1;
     } else if (character === ':') {
       if (text[index + 1] === ':') {
         specificity[2]++;
@@ -747,8 +818,10 @@ function computeSpecificity (selector) {
         const nameEnd = skipSelectorName(text, nameStart);
         const name = text.slice(nameStart, nameEnd).toLowerCase();
         if (text[nameEnd] === '(') {
-          const closeIndex = findMatchingParenthesisIndex(text, nameEnd);
-          const inner = text.slice(nameEnd + 1, closeIndex);
+          // An argument list that never closes runs to the end of the selector
+          const closeIndex = findMatchingParenthesis(text, nameEnd);
+          const argumentsEnd = closeIndex === -1 ? text.length : closeIndex;
+          const inner = text.slice(nameEnd + 1, argumentsEnd);
           if (name === 'where') {
             // :where() contributes zero specificity
           } else if (name === 'is' || name === 'not' || name === 'has' || name === 'matches') {
@@ -759,7 +832,7 @@ function computeSpecificity (selector) {
           } else {
             specificity[1]++;
           }
-          index = closeIndex + 1;
+          index = argumentsEnd + 1;
         } else {
           // Legacy single-colon pseudo-elements count as pseudo-elements
           if (name === 'before' || name === 'after' || name === 'first-line' || name === 'first-letter') {
@@ -793,7 +866,7 @@ function computeSpecificity (selector) {
  */
 function maxSelectorSpecificity (selectorList) {
   let maximum = [0, 0, 0];
-  for (const selector of splitSelectorListTopLevel(selectorList)) {
+  for (const selector of splitTopLevelCommaList(selectorList)) {
     const specificity = computeSpecificity(selector);
     if (compareSpecificity(specificity, maximum) > 0) {
       maximum = specificity;
@@ -824,7 +897,7 @@ function maximumRuleSpecificity (selectors) {
  */
 function minimumRuleSpecificity (selectors) {
   let minimum = null;
-  for (const selector of splitSelectorListTopLevel((selectors || []).join(','))) {
+  for (const selector of splitTopLevelCommaList((selectors || []).join(','))) {
     const specificity = computeSpecificity(selector);
     if (!minimum || compareSpecificity(specificity, minimum) < 0) {
       minimum = specificity;