index.js 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140
  1. // @ts-nocheck
  2. 'use strict';
  3. const _ = require('lodash');
  4. const findAtRuleContext = require('../../utils/findAtRuleContext');
  5. const isCustomPropertySet = require('../../utils/isCustomPropertySet');
  6. const isStandardSyntaxRule = require('../../utils/isStandardSyntaxRule');
  7. const isStandardSyntaxSelector = require('../../utils/isStandardSyntaxSelector');
  8. const keywordSets = require('../../reference/keywordSets');
  9. const nodeContextLookup = require('../../utils/nodeContextLookup');
  10. const optionsMatches = require('../../utils/optionsMatches');
  11. const parseSelector = require('../../utils/parseSelector');
  12. const report = require('../../utils/report');
  13. const resolvedNestedSelector = require('postcss-resolve-nested-selector');
  14. const ruleMessages = require('../../utils/ruleMessages');
  15. const specificity = require('specificity');
  16. const validateOptions = require('../../utils/validateOptions');
  17. const ruleName = 'no-descending-specificity';
  18. const messages = ruleMessages(ruleName, {
  19. rejected: (b, a) => `Expected selector "${b}" to come before selector "${a}"`,
  20. });
  21. function rule(on, options) {
  22. return (root, result) => {
  23. const validOptions = validateOptions(
  24. result,
  25. ruleName,
  26. {
  27. actual: on,
  28. },
  29. {
  30. optional: true,
  31. actual: options,
  32. possible: {
  33. ignore: ['selectors-within-list'],
  34. },
  35. },
  36. );
  37. if (!validOptions) {
  38. return;
  39. }
  40. const selectorContextLookup = nodeContextLookup();
  41. root.walkRules((rule) => {
  42. // Ignore custom property set `--foo: {};`
  43. if (isCustomPropertySet(rule)) {
  44. return;
  45. }
  46. // Ignore nested property `foo: {};`
  47. if (!isStandardSyntaxRule(rule)) {
  48. return;
  49. }
  50. // Ignores selectors within list of selectors
  51. if (optionsMatches(options, 'ignore', 'selectors-within-list') && rule.selectors.length > 1) {
  52. return;
  53. }
  54. const comparisonContext = selectorContextLookup.getContext(rule, findAtRuleContext(rule));
  55. rule.selectors.forEach((selector) => {
  56. const trimSelector = selector.trim();
  57. // Ignore `.selector, { }`
  58. if (trimSelector === '') {
  59. return;
  60. }
  61. // The edge-case of duplicate selectors will act acceptably
  62. const index = rule.selector.indexOf(trimSelector);
  63. // Resolve any nested selectors before checking
  64. resolvedNestedSelector(selector, rule).forEach((resolvedSelector) => {
  65. parseSelector(resolvedSelector, result, rule, (s) => {
  66. if (!isStandardSyntaxSelector(resolvedSelector)) {
  67. return;
  68. }
  69. checkSelector(s, rule, index, comparisonContext);
  70. });
  71. });
  72. });
  73. });
  74. function checkSelector(selectorNode, rule, sourceIndex, comparisonContext) {
  75. const selector = selectorNode.toString();
  76. const referenceSelectorNode = lastCompoundSelectorWithoutPseudoClasses(selectorNode);
  77. const selectorSpecificity = specificity.calculate(selector)[0].specificityArray;
  78. const entry = { selector, specificity: selectorSpecificity };
  79. if (!comparisonContext.has(referenceSelectorNode)) {
  80. comparisonContext.set(referenceSelectorNode, [entry]);
  81. return;
  82. }
  83. const priorComparableSelectors = comparisonContext.get(referenceSelectorNode);
  84. priorComparableSelectors.forEach((priorEntry) => {
  85. if (specificity.compare(selectorSpecificity, priorEntry.specificity) === -1) {
  86. report({
  87. ruleName,
  88. result,
  89. node: rule,
  90. message: messages.rejected(selector, priorEntry.selector),
  91. index: sourceIndex,
  92. });
  93. }
  94. });
  95. priorComparableSelectors.push(entry);
  96. }
  97. };
  98. }
  99. function lastCompoundSelectorWithoutPseudoClasses(selectorNode) {
  100. const nodesAfterLastCombinator = _.last(
  101. selectorNode.nodes[0].split((node) => {
  102. return node.type === 'combinator';
  103. }),
  104. );
  105. const nodesWithoutPseudoClasses = nodesAfterLastCombinator
  106. .filter((node) => {
  107. return node.type !== 'pseudo' || keywordSets.pseudoElements.has(node.value.replace(/:/g, ''));
  108. })
  109. .join('');
  110. return nodesWithoutPseudoClasses.toString();
  111. }
  112. rule.ruleName = ruleName;
  113. rule.messages = messages;
  114. module.exports = rule;