From 83f7fa244485d4e2234709e822cef02b5dcf9ec7 Mon Sep 17 00:00:00 2001 From: Marc G Date: Fri, 11 Mar 2022 13:40:13 +0100 Subject: [PATCH] Fix false positives/negatives in selector-pseudo-class/element-no-unknown add ::cue, ::target-text, :unresolved, :picture-in-picture, :window-inactive, :fullscreen-ancestor, etc. remove :focus-ring, :drop typo ::-webkit-resizer https://hg.mozilla.org/mozilla-central/file/tip/layout/style/test/test_non_content_accessible_pseudos.html#l8 https://hg.mozilla.org/mozilla-central/file/tip/layout/style/test/test_selectors.html#l1102 https://trac.webkit.org/changeset/252330/webkit/ keywords: datetime, meter, search, validation, any, drag --- lib/reference/keywordSets.js | 115 ++++++++++++++---- .../__tests__/index.js | 9 +- .../selector-pseudo-class-no-unknown/index.js | 8 +- 3 files changed, 97 insertions(+), 35 deletions(-) diff --git a/lib/reference/keywordSets.js b/lib/reference/keywordSets.js index b5ed5abfbf..e518f048a9 100644 --- a/lib/reference/keywordSets.js +++ b/lib/reference/keywordSets.js @@ -157,29 +157,43 @@ keywordSets.levelOneAndTwoPseudoElements = new Set([ 'first-letter', ]); -// These are the ones that require double-colon notation keywordSets.levelThreeAndUpPseudoElements = new Set([ 'before', 'after', 'first-line', 'first-letter', - 'selection', - 'spelling-error', - 'grammar-error', + // These are the ones that require double-colon notation 'backdrop', + 'content', + 'cue', + 'file-selector-button', + 'grammar-error', 'marker', 'placeholder', + 'selection', 'shadow', 'slotted', - 'content', - 'file-selector-button', + 'spelling-error', + 'target-text', ]); keywordSets.shadowTreePseudoElements = new Set(['part']); +keywordSets.webkitScrollbarPseudoElements = new Set([ + '-webkit-resizer', + '-webkit-scrollbar', + '-webkit-scrollbar-button', + '-webkit-scrollbar-corner', + '-webkit-scrollbar-thumb', + '-webkit-scrollbar-track', + '-webkit-scrollbar-track-piece', +]); + keywordSets.vendorSpecificPseudoElements = new Set([ '-moz-focus-inner', '-moz-focus-outer', + '-moz-list-bullet', + '-moz-meter-bar', '-moz-placeholder', '-moz-progress-bar', '-moz-range-progress', @@ -199,11 +213,50 @@ keywordSets.vendorSpecificPseudoElements = new Set([ '-ms-tooltip', '-ms-track', '-ms-value', + '-webkit-color-swatch', + '-webkit-color-swatch-wrapper', + '-webkit-calendar-picker-indicator', + '-webkit-clear-button', + '-webkit-date-and-time-value', + '-webkit-datetime-edit', + '-webkit-datetime-edit-ampm-field', + '-webkit-datetime-edit-day-field', + '-webkit-datetime-edit-fields-wrapper', + '-webkit-datetime-edit-hour-field', + '-webkit-datetime-edit-millisecond-field', + '-webkit-datetime-edit-minute-field', + '-webkit-datetime-edit-month-field', + '-webkit-datetime-edit-second-field', + '-webkit-datetime-edit-text', + '-webkit-datetime-edit-week-field', + '-webkit-datetime-edit-year-field', + '-webkit-details-marker', + '-webkit-distributed', + '-webkit-file-upload-button', '-webkit-input-placeholder', + '-webkit-keygen-select', + '-webkit-meter-bar', + '-webkit-meter-even-less-good-value', + '-webkit-meter-inner-element', + '-webkit-meter-optimum-value', + '-webkit-meter-suboptimum-value', '-webkit-progress-bar', + '-webkit-progress-inner-element', '-webkit-progress-value', + '-webkit-search-cancel-button', + '-webkit-search-decoration', + '-webkit-search-results-button', + '-webkit-search-results-decoration', '-webkit-slider-runnable-track', '-webkit-slider-thumb', + '-webkit-textfield-decoration-container', + '-webkit-validation-bubble', + '-webkit-validation-bubble-arrow', + '-webkit-validation-bubble-arrow-clipper', + '-webkit-validation-bubble-heading', + '-webkit-validation-bubble-message', + '-webkit-validation-bubble-text-block', + ...keywordSets.webkitScrollbarPseudoElements, ]); keywordSets.pseudoElements = uniteSets( @@ -238,22 +291,22 @@ keywordSets.otherPseudoClasses = new Set([ 'default', 'defined', 'disabled', - 'drop', 'empty', 'enabled', 'first-child', 'first-of-type', 'focus', - 'focus-ring', 'focus-within', 'focus-visible', 'fullscreen', + 'fullscreen-ancestor', 'future', 'host', 'host-context', 'hover', 'indeterminate', 'in-range', + 'invalid', 'last-child', 'last-of-type', 'link', @@ -264,6 +317,7 @@ keywordSets.otherPseudoClasses = new Set([ 'past', 'placeholder-shown', 'playing', + 'picture-in-picture', 'paused', 'read-only', 'read-write', @@ -272,35 +326,48 @@ keywordSets.otherPseudoClasses = new Set([ 'scope', 'state', 'target', + 'unresolved', 'user-invalid', 'user-valid', - 'invalid', 'valid', 'visited', + 'window-inactive', // for ::selection (chrome) ]); keywordSets.vendorSpecificPseudoClasses = new Set([ + '-khtml-drag', + '-moz-any', + '-moz-any-link', + '-moz-broken', + '-moz-drag-over', + '-moz-first-node', + '-moz-focusring', + '-moz-full-screen', + '-moz-full-screen-ancestor', + '-moz-last-node', + '-moz-loading', + '-moz-meter-optimum', + '-moz-meter-sub-optimum', + '-moz-meter-sub-sub-optimum', '-moz-placeholder', + '-moz-submit-invalid', + '-moz-suppressed', '-moz-ui-invalid', '-moz-ui-valid', + '-moz-user-disabled', + '-moz-window-inactive', + '-ms-fullscreen', '-ms-input-placeholder', + '-webkit-drag', + '-webkit-any', + '-webkit-any-link', + '-webkit-autofill', + '-webkit-full-screen', + '-webkit-full-screen-ancestor', ]); -// TODO migrate to vendorSpecificPseudoElements -// see #2264 -keywordSets.webkitProprietaryPseudoElements = new Set([ - 'scrollbar', - 'scrollbar-button', - 'scrollbar-track', - 'scrollbar-track-piece', - 'scrollbar-thumb', - 'scrollbar-corner', - 'resize', -]); - -// TODO migrate to vendorSpecificPseudoClasses -// see #2264 -keywordSets.webkitProprietaryPseudoClasses = new Set([ +// https://webkit.org/blog/363/styling-scrollbars/ +keywordSets.webkitScrollbarPseudoClasses = new Set([ 'horizontal', 'vertical', 'decrement', diff --git a/lib/rules/selector-pseudo-class-no-unknown/__tests__/index.js b/lib/rules/selector-pseudo-class-no-unknown/__tests__/index.js index c2de32ca6b..99f4aedd1e 100644 --- a/lib/rules/selector-pseudo-class-no-unknown/__tests__/index.js +++ b/lib/rules/selector-pseudo-class-no-unknown/__tests__/index.js @@ -67,6 +67,9 @@ testRule({ { code: '::-webkit-scrollbar-thumb:window-inactive { }', }, + { + code: '::selection:window-inactive { }', + }, { code: '@page :first { }', }, @@ -164,12 +167,6 @@ testRule({ line: 2, column: 9, }, - { - code: '::-webkit-unknown:window-inactive { }', - message: messages.rejected(':window-inactive'), - line: 1, - column: 18, - }, { code: '::-webkit-scrollbar-button:horizontal:unknown {}', message: messages.rejected(':unknown'), diff --git a/lib/rules/selector-pseudo-class-no-unknown/index.js b/lib/rules/selector-pseudo-class-no-unknown/index.js index 0b0658a058..8e06850c7b 100644 --- a/lib/rules/selector-pseudo-class-no-unknown/index.js +++ b/lib/rules/selector-pseudo-class-no-unknown/index.js @@ -102,13 +102,11 @@ const rule = (primary, secondaryOptions) => { } while (prevPseudoElement); if (prevPseudoElement) { - const prevPseudoElementValue = vendor.unprefixed( - prevPseudoElement.value.toLowerCase().slice(2), - ); + const prevPseudoElementValue = prevPseudoElement.value.toLowerCase().slice(2); if ( - keywordSets.webkitProprietaryPseudoElements.has(prevPseudoElementValue) && - keywordSets.webkitProprietaryPseudoClasses.has(name) + keywordSets.webkitScrollbarPseudoElements.has(prevPseudoElementValue) && + keywordSets.webkitScrollbarPseudoClasses.has(name) ) { return; }