fix(css): comments in selectors (#3909)
This commit is contained in:
1 parent
6b5765da36
commit
9e6bd15ade
10 files changed
+249
-64
No files matched your search
@@ -11,7 +11,7 @@ function parseSelector(selector) {
|
||||
if (selector.match(/\/\/|\/\*/)) {
|
||||
return {
|
||||
type: "selector-comment",
|
||||
value: selector
|
||||
value: selector.replace(/^ +/, "").replace(/ +$/, "")
|
||||
};
|
||||
}
|
||||
const selectorParser = require("postcss-selector-parser");
|
||||
@@ -218,10 +218,14 @@ function parseNestedCSS(node) {
|
||||
}
|
||||
|
||||
if (typeof node.selector === "string" && node.selector.trim().length > 0) {
|
||||
const selector = node.raws.selector
|
||||
let selector = node.raws.selector
|
||||
? node.raws.selector.raw
|
||||
: node.selector;
|
||||
|
||||
if (node.raws.between && node.raws.between.trim()) {
|
||||
selector += node.raws.between;
|
||||
}
|
||||
|
||||
if (selector.startsWith("@") && selector.endsWith(":")) {
|
||||
return node;
|
||||
}
|
||||
|
||||
@@ -65,9 +65,11 @@ function genericPrint(path, options, print) {
|
||||
// with a colon, so keep the original case then.
|
||||
const isDetachedRulesetDeclaration =
|
||||
node.selector &&
|
||||
typeof node.selector === "string" &&
|
||||
node.selector.startsWith("@") &&
|
||||
node.selector.endsWith(":");
|
||||
node.selector.type !== "selector-root-invalid" &&
|
||||
((typeof node.selector === "string" &&
|
||||
/^@.+:.*$/.test(node.selector)) ||
|
||||
(node.selector.value && /^@.+:.*$/.test(node.selector.value)));
|
||||
|
||||
return concat([
|
||||
path.call(print, "selector"),
|
||||
node.important ? " !important" : "",
|
||||
|
||||
@@ -176,7 +176,7 @@ svg[viewBox] linearGradient,
|
||||
@media (--KeepCustomMedia) {
|
||||
}
|
||||
|
||||
@KeepDetachedRuleset: {
|
||||
@KeepDetachedRuleset: /*:*/ {
|
||||
background: RED;
|
||||
};
|
||||
|
||||
@@ -187,7 +187,7 @@ svg[viewBox] linearGradient,
|
||||
@KeepTopLevelVar: val;
|
||||
$KeepScssVar: val;
|
||||
|
||||
.Keep(@Keep: 12e3px) when (@Keep=Case) {
|
||||
.Keep(@Keep: 12e03PX) when (@Keep=Case) /*:*/ {
|
||||
@KeepVar: KeepName; /*:*/
|
||||
@{KeepInterpolationVar}: val;
|
||||
$KeepScssVar: val;
|
||||
@@ -221,9 +221,9 @@ $KeepScssVar: val;
|
||||
.Keep (@Keep) when (lightness(@Keep) >= Keep12PX) and (@Keep > @Keep12E5) {
|
||||
}
|
||||
|
||||
.Keep(@Keep: 12px; @Keep: @Keep12PX; ...) {
|
||||
.Keep(@Keep: 12PX; @Keep: @Keep12PX; ...) /*:*/ {
|
||||
}
|
||||
.Keep(@Keep: "12PX"; @Keep: "12PX"; ...) {
|
||||
.Keep(@Keep: '12PX'; @Keep: "12PX"; ...) /*:*/ {
|
||||
}
|
||||
|
||||
@media (min-width: 700px) {
|
||||
|
||||
@@ -1,31 +0,0 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`comment-in-if.css 1`] = `
|
||||
@function _normalize-include($section) {
|
||||
// Check if $section is in the $include list.
|
||||
@if index($_normalize-include, $section) {
|
||||
@return true;
|
||||
}
|
||||
// If $include is set to (all), make sure $section is not in $exclude.
|
||||
@else if not index($_normalize-exclude, $section) and index($_normalize-include, all) {
|
||||
@return true;
|
||||
}
|
||||
@return false;
|
||||
}
|
||||
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
|
||||
@function _normalize-include($section) {
|
||||
// Check if $section is in the $include list.
|
||||
@if index($_normalize-include, $section) {
|
||||
@return true;
|
||||
}
|
||||
// If $include is set to (all), make sure $section is not in $exclude.
|
||||
@else if not
|
||||
index($_normalize-exclude, $section) and
|
||||
index($_normalize-include, all)
|
||||
{
|
||||
@return true;
|
||||
}
|
||||
@return false;
|
||||
}
|
||||
|
||||
`;
|
||||
@@ -1 +0,0 @@
|
||||
run_spec(__dirname, ["css"]);
|
||||
@@ -82,6 +82,36 @@ a {
|
||||
|
||||
`;
|
||||
|
||||
exports[`if-eslit-at-rule-decloration.scss 1`] = `
|
||||
@function _normalize-include($section) {
|
||||
// Check if $section is in the $include list.
|
||||
@if index($_normalize-include, $section) {
|
||||
@return true;
|
||||
}
|
||||
// If $include is set to (all), make sure $section is not in $exclude.
|
||||
@else if not index($_normalize-exclude, $section) and index($_normalize-include, all) {
|
||||
@return true;
|
||||
}
|
||||
@return false;
|
||||
}
|
||||
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
|
||||
@function _normalize-include($section) {
|
||||
// Check if $section is in the $include list.
|
||||
@if index($_normalize-include, $section) {
|
||||
@return true;
|
||||
}
|
||||
// If $include is set to (all), make sure $section is not in $exclude.
|
||||
@else if not
|
||||
index($_normalize-exclude, $section) and
|
||||
index($_normalize-include, all)
|
||||
{
|
||||
@return true;
|
||||
}
|
||||
@return false;
|
||||
}
|
||||
|
||||
`;
|
||||
|
||||
exports[`places.css 1`] = `
|
||||
div {
|
||||
// a
|
||||
@@ -127,44 +157,166 @@ foo {
|
||||
|
||||
`;
|
||||
|
||||
exports[`selector.css 1`] = `
|
||||
.powerPathNavigator .helm button.pressedButton, /* pressed buttons */
|
||||
exports[`selectors.css 1`] = `
|
||||
.powerPathNavigator .helm button.pressedButton, /* comment 1 */
|
||||
.powerPathNavigator .helm button:active:not(.disabledButton),
|
||||
.powerPathNavigator table.powerPathInfo th:active,
|
||||
.powerPathNavigator table.powerPathInfo th:active + th:last-child {
|
||||
}
|
||||
|
||||
/* pressed buttons */
|
||||
/* comment 2 */
|
||||
.powerPathNavigator .helm button.pressedButton,
|
||||
.powerPathNavigator .helm button:active:not(.disabledButton) {
|
||||
}
|
||||
|
||||
.foo,
|
||||
/* comment 3 */
|
||||
.bar {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* comment 4 */
|
||||
/* comment 5 */ .field /* comment 6 */
|
||||
/* comment 7 */
|
||||
/* comment 8 */ { /* comment 9 */
|
||||
/* comment 10 */
|
||||
background: green;
|
||||
/* comment 11 */
|
||||
/* comment 12 */ } /* comment 13 */
|
||||
/* comment 14 */
|
||||
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
|
||||
.powerPathNavigator .helm button.pressedButton, /* pressed buttons */
|
||||
.powerPathNavigator .helm button.pressedButton, /* comment 1 */
|
||||
.powerPathNavigator .helm button:active:not(.disabledButton),
|
||||
.powerPathNavigator table.powerPathInfo th:active,
|
||||
.powerPathNavigator table.powerPathInfo th:active + th:last-child {
|
||||
}
|
||||
|
||||
/* pressed buttons */
|
||||
/* comment 2 */
|
||||
.powerPathNavigator .helm button.pressedButton,
|
||||
.powerPathNavigator .helm button:active:not(.disabledButton) {
|
||||
}
|
||||
|
||||
.foo,
|
||||
/* comment 3 */
|
||||
.bar {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* comment 4 */
|
||||
/* comment 5 */
|
||||
.field /* comment 6 */
|
||||
/* comment 7 */
|
||||
/* comment 8 */ {
|
||||
/* comment 9 */
|
||||
/* comment 10 */
|
||||
background: green;
|
||||
/* comment 11 */
|
||||
/* comment 12 */
|
||||
} /* comment 13 */
|
||||
/* comment 14 */
|
||||
|
||||
`;
|
||||
|
||||
exports[`selectors.scss 1`] = `
|
||||
.powerPathNavigator .helm button.pressedButton, // comment 1
|
||||
.powerPathNavigator .helm button:active:not(.disabledButton),
|
||||
.powerPathNavigator table.powerPathInfo th:active,
|
||||
.powerPathNavigator table.powerPathInfo th:active + th:last-child {
|
||||
}
|
||||
|
||||
// comment 2
|
||||
.powerPathNavigator .helm button.pressedButton,
|
||||
.powerPathNavigator .helm button:active:not(.disabledButton) {
|
||||
}
|
||||
|
||||
.foo,
|
||||
// Comment.
|
||||
// comment 3
|
||||
.bar {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.field
|
||||
{
|
||||
&[data-field-id="1"], // comment 4
|
||||
&[data-field-id="2"], // comment 5
|
||||
&[data-field-id="3"], // comment 6
|
||||
{
|
||||
background: green;
|
||||
}
|
||||
}
|
||||
|
||||
// comment 7
|
||||
.field
|
||||
// comment 8
|
||||
{ // comment 9
|
||||
// comment 10
|
||||
&[data-field-id="1"], // comment 11
|
||||
// comment 12
|
||||
&[data-field-id="2"] // comment 13
|
||||
// comment 14
|
||||
, // comment 15
|
||||
// comment 16
|
||||
&[data-field-id="3"], // comment 17
|
||||
// comment 18
|
||||
{ // comment 19
|
||||
// comment 20
|
||||
background: green;
|
||||
// comment 21
|
||||
} // comment 22
|
||||
// comment 23
|
||||
}
|
||||
// comment 24
|
||||
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
|
||||
.powerPathNavigator .helm button.pressedButton, // comment 1
|
||||
.powerPathNavigator .helm button:active:not(.disabledButton),
|
||||
.powerPathNavigator table.powerPathInfo th:active,
|
||||
.powerPathNavigator table.powerPathInfo th:active + th:last-child {
|
||||
}
|
||||
|
||||
// comment 2
|
||||
.powerPathNavigator .helm button.pressedButton,
|
||||
.powerPathNavigator .helm button:active:not(.disabledButton) {
|
||||
}
|
||||
|
||||
.foo,
|
||||
// Comment.
|
||||
// comment 3
|
||||
.bar {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.field {
|
||||
&[data-field-id="1"], // comment 4
|
||||
&[data-field-id="2"], // comment 5
|
||||
&[data-field-id="3"], // comment 6
|
||||
{
|
||||
background: green;
|
||||
}
|
||||
}
|
||||
|
||||
// comment 7
|
||||
.field
|
||||
// comment 8
|
||||
{
|
||||
// comment 9
|
||||
// comment 10
|
||||
&[data-field-id="1"], // comment 11
|
||||
// comment 12
|
||||
&[data-field-id="2"] // comment 13
|
||||
// comment 14
|
||||
, // comment 15
|
||||
// comment 16
|
||||
&[data-field-id="3"], // comment 17
|
||||
// comment 18
|
||||
{
|
||||
// comment 19
|
||||
// comment 20
|
||||
background: green;
|
||||
// comment 21
|
||||
} // comment 22
|
||||
// comment 23
|
||||
}
|
||||
// comment 24
|
||||
|
||||
`;
|
||||
|
||||
exports[`trailing_star_slash.css 1`] = `
|
||||
|
||||
+5
-5
@@ -1,11 +1,11 @@
|
||||
@function _normalize-include($section) {
|
||||
// Check if $section is in the $include list.
|
||||
@if index($_normalize-include, $section) {
|
||||
@if index($_normalize-include, $section) {
|
||||
@return true;
|
||||
}
|
||||
}
|
||||
// If $include is set to (all), make sure $section is not in $exclude.
|
||||
@else if not index($_normalize-exclude, $section) and index($_normalize-include, all) {
|
||||
@else if not index($_normalize-exclude, $section) and index($_normalize-include, all) {
|
||||
@return true;
|
||||
}
|
||||
@return false;
|
||||
}
|
||||
@return false;
|
||||
}
|
||||
@@ -1,10 +0,0 @@
|
||||
.powerPathNavigator .helm button.pressedButton, /* pressed buttons */
|
||||
.powerPathNavigator .helm button:active:not(.disabledButton),
|
||||
.powerPathNavigator table.powerPathInfo th:active,
|
||||
.powerPathNavigator table.powerPathInfo th:active + th:last-child {
|
||||
}
|
||||
|
||||
/* pressed buttons */
|
||||
.powerPathNavigator .helm button.pressedButton,
|
||||
.powerPathNavigator .helm button:active:not(.disabledButton) {
|
||||
}
|
||||
@@ -0,0 +1,26 @@
|
||||
.powerPathNavigator .helm button.pressedButton, /* comment 1 */
|
||||
.powerPathNavigator .helm button:active:not(.disabledButton),
|
||||
.powerPathNavigator table.powerPathInfo th:active,
|
||||
.powerPathNavigator table.powerPathInfo th:active + th:last-child {
|
||||
}
|
||||
|
||||
/* comment 2 */
|
||||
.powerPathNavigator .helm button.pressedButton,
|
||||
.powerPathNavigator .helm button:active:not(.disabledButton) {
|
||||
}
|
||||
|
||||
.foo,
|
||||
/* comment 3 */
|
||||
.bar {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* comment 4 */
|
||||
/* comment 5 */ .field /* comment 6 */
|
||||
/* comment 7 */
|
||||
/* comment 8 */ { /* comment 9 */
|
||||
/* comment 10 */
|
||||
background: green;
|
||||
/* comment 11 */
|
||||
/* comment 12 */ } /* comment 13 */
|
||||
/* comment 14 */
|
||||
@@ -1,5 +1,48 @@
|
||||
.powerPathNavigator .helm button.pressedButton, // comment 1
|
||||
.powerPathNavigator .helm button:active:not(.disabledButton),
|
||||
.powerPathNavigator table.powerPathInfo th:active,
|
||||
.powerPathNavigator table.powerPathInfo th:active + th:last-child {
|
||||
}
|
||||
|
||||
// comment 2
|
||||
.powerPathNavigator .helm button.pressedButton,
|
||||
.powerPathNavigator .helm button:active:not(.disabledButton) {
|
||||
}
|
||||
|
||||
.foo,
|
||||
// Comment.
|
||||
// comment 3
|
||||
.bar {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.field
|
||||
{
|
||||
&[data-field-id="1"], // comment 4
|
||||
&[data-field-id="2"], // comment 5
|
||||
&[data-field-id="3"], // comment 6
|
||||
{
|
||||
background: green;
|
||||
}
|
||||
}
|
||||
|
||||
// comment 7
|
||||
.field
|
||||
// comment 8
|
||||
{ // comment 9
|
||||
// comment 10
|
||||
&[data-field-id="1"], // comment 11
|
||||
// comment 12
|
||||
&[data-field-id="2"] // comment 13
|
||||
// comment 14
|
||||
, // comment 15
|
||||
// comment 16
|
||||
&[data-field-id="3"], // comment 17
|
||||
// comment 18
|
||||
{ // comment 19
|
||||
// comment 20
|
||||
background: green;
|
||||
// comment 21
|
||||
} // comment 22
|
||||
// comment 23
|
||||
}
|
||||
// comment 24
|
||||
Reference in new issue
Block a user