Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Fix false positives/negatives in selector-pseudo-class/element-no-unknown #5959

Merged
merged 1 commit into from Mar 15, 2022
Merged

Fix false positives/negatives in selector-pseudo-class/element-no-unknown #5959

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
115 changes: 91 additions & 24 deletions lib/reference/keywordSets.js
View file
Open in desktop
Expand Up @@ -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',
Expand All @@ -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(
Expand Down Expand Up @@ -238,22 +291,22 @@ keywordSets.otherPseudoClasses = new Set([
'default',
'defined',
'disabled',
'drop',
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

w3c/csswg-drafts#2257 (comment)

'empty',
'enabled',
'first-child',
'first-of-type',
'focus',
'focus-ring',
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

from an old draft
cf https://caniuse.com/css-focus-visible

'focus-within',
'focus-visible',
'fullscreen',
'fullscreen-ancestor',
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

supported by Opera 12

'future',
'host',
'host-context',
'hover',
'indeterminate',
'in-range',
'invalid',
'last-child',
'last-of-type',
'link',
Expand All @@ -264,6 +317,7 @@ keywordSets.otherPseudoClasses = new Set([
'past',
'placeholder-shown',
'playing',
'picture-in-picture',
'paused',
'read-only',
'read-write',
Expand All @@ -272,35 +326,48 @@ keywordSets.otherPseudoClasses = new Set([
'scope',
'state',
'target',
'unresolved',
'user-invalid',
'user-valid',
'invalid',
'valid',
'visited',
'window-inactive', // for ::selection (chrome)
Copy link
Contributor Author

@Mouvedia Mouvedia Mar 11, 2022 •
edited

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

also in webkitScrollbarPseudoClasses
strictly speaking, the one at l381 is not necessary anymore
but it's better that way (less brittle to refactoring)

]);

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/
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this source was the cause of the typo

keywordSets.webkitScrollbarPseudoClasses = new Set([
'horizontal',
'vertical',
'decrement',
Expand Down
9 changes: 3 additions & 6 deletions lib/rules/selector-pseudo-class-no-unknown/__tests__/index.js
View file
Open in desktop
Expand Up @@ -67,6 +67,9 @@ testRule({
{
code: '::-webkit-scrollbar-thumb:window-inactive { }',
},
{
code: '::selection:window-inactive { }',
},
{
code: '@page :first { }',
},
Expand Down Expand Up @@ -164,12 +167,6 @@ testRule({
line: 2,
column: 9,
},
{
code: '::-webkit-unknown:window-inactive { }',
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If it detected unknown pseudo elements, it would now correctly reject ::-webkit-unknown.
That's not what we are testing though.

message: messages.rejected(':window-inactive'),
line: 1,
column: 18,
},
{
code: '::-webkit-scrollbar-button:horizontal:unknown {}',
message: messages.rejected(':unknown'),
Expand Down
8 changes: 3 additions & 5 deletions lib/rules/selector-pseudo-class-no-unknown/index.js
View file
Open in desktop
Expand Up @@ -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;
}
Expand Down