diff options
8 files changed, 117 insertions, 30 deletions
diff --git a/its/plugin/projects/issues-project/src/file1.css b/its/plugin/projects/issues-project/src/file1.css index 7ed5eae..cac30a7 100644 --- a/its/plugin/projects/issues-project/src/file1.css +++ b/its/plugin/projects/issues-project/src/file1.css @@ -1,9 +1,20 @@ @import "a.css"; @import "a.css"; /* S1128 | no-duplicate-at-import-rules */ +b a { + color: pink;; /* S1116 | no-extra-semicolons */ +} + +a { /* S4664 | no-descending-specificity */ + color: red; +} + +a::pseudo { /* S4660 | selector-pseudo-element-no-unknown */ + color: red; +} + a:unknown { /* S4659 | selector-pseudo-class-no-unknown */ background-color: #ffw; /* S4647 | color-no-invalid-hex */ - width: 100pixels; /* S4653 | unit-no-unknown */ /* */ /* S4663 | comment-no-empty */ content: "first second"; /* S4652 | string-no-newline */ @@ -14,7 +25,7 @@ a:unknown { /* S4659 | selecto heigth: 100%; /* S4654 | property-no-unknown */ padding-left: 10px; padding: 20px; /* S4657 | declaration-block-no-shorthand-property-overrides */ - top: calc(1px+2px); /* S4650 | function-calc-no-unspaced-operator */ + top: calc(1px+2px); /* S4650 | function-calc-no-unspaced-operator */ /* S4653 | unit-no-unknown */ } // color: pink; /* S4668 | no-invalid-double-slash-comments */ @@ -28,14 +39,6 @@ a:unknown { /* S4659 | selecto padding: 100px; } -a { - color: pink;; /* S1116 | no-extra-semicolons */ -} - -a::pseudo { /* S4660 | selector-pseudo-element-no-unknown */ - color: red; -} - unknown { /* S4670 | selector-type-no-unknown */ color: black; } diff --git a/its/plugin/projects/issues-project/src/file2.less b/its/plugin/projects/issues-project/src/file2.less index e86afd8..f1214ba 100644 --- a/its/plugin/projects/issues-project/src/file2.less +++ b/its/plugin/projects/issues-project/src/file2.less @@ -1,9 +1,20 @@ @import "a.css"; @import "a.css"; /* S1128 | no-duplicate-at-import-rules | Doesn't raise for LESS */ +b a { + color: pink;; /* S1116 | no-extra-semicolons */ +} + +a { /* S4664 | no-descending-specificity */ + color: red; +} + +a::pseudo { /* S4660 | selector-pseudo-element-no-unknown */ + color: red; +} + a:unknown { /* S4659 | selector-pseudo-class-no-unknown */ background-color: #ffw; /* S4647 | color-no-invalid-hex */ - width: 100pixels; /* S4653 | unit-no-unknown */ /* */ /* S4663 | comment-no-empty */ content: "first second"; /* S4652 | string-no-newline */ @@ -14,7 +25,7 @@ a:unknown { /* S4659 | selecto heigth: 100%; /* S4654 | property-no-unknown */ padding-left: 10px; padding: 20px; /* S4657 | declaration-block-no-shorthand-property-overrides */ - top: calc(1px+2px); /* S4650 | function-calc-no-unspaced-operator */ + top: calc(1px+2px); /* S4650 | function-calc-no-unspaced-operator */ /* S4653 | unit-no-unknown */ } // color: pink; /* S4668 | no-invalid-double-slash-comments | Doesn't raise for LESS */ @@ -28,14 +39,6 @@ a:unknown { /* S4659 | selecto padding: 100px; } -a { - color: pink;; /* S1116 | no-extra-semicolons */ -} - -a::pseudo { /* S4660 | selector-pseudo-element-no-unknown */ - color: red; -} - unknown { /* S4670 | selector-type-no-unknown */ color: black; } diff --git a/its/plugin/projects/issues-project/src/file3.scss b/its/plugin/projects/issues-project/src/file3.scss index 4b68ede..de42fb3 100644 --- a/its/plugin/projects/issues-project/src/file3.scss +++ b/its/plugin/projects/issues-project/src/file3.scss @@ -1,9 +1,20 @@ @import "a.css"; @import "a.css"; /* S1128 | no-duplicate-at-import-rules */ +b a { + color: pink;; /* S1116 | no-extra-semicolons */ +} + +a { /* S4664 | no-descending-specificity */ + color: red; +} + +a::pseudo { /* S4660 | selector-pseudo-element-no-unknown */ + color: red; +} + a:unknown { /* S4659 | selector-pseudo-class-no-unknown */ background-color: #ffw; /* S4647 | color-no-invalid-hex */ - width: 100pixels; /* S4653 | unit-no-unknown */ /* */ /* S4663 | comment-no-empty */ content: "first second"; /* S4652 | string-no-newline */ @@ -14,7 +25,7 @@ a:unknown { /* S4659 | selecto heigth: 100%; /* S4654 | property-no-unknown */ padding-left: 10px; padding: 20px; /* S4657 | declaration-block-no-shorthand-property-overrides */ - top: calc(1px+2px); /* S4650 | function-calc-no-unspaced-operator */ + top: calc(1px+2px); /* S4650 | function-calc-no-unspaced-operator */ /* S4653 | unit-no-unknown */ } // color: pink; /* S4668 | no-invalid-double-slash-comments | Doesn't raise for SCSS */ @@ -28,14 +39,6 @@ a:unknown { /* S4659 | selecto padding: 100px; } -a { - color: pink;; /* S1116 | no-extra-semicolons */ -} - -a::pseudo { /* S4660 | selector-pseudo-element-no-unknown */ - color: red; -} - unknown { /* S4670 | selector-type-no-unknown */ color: black; } diff --git a/sonar-css-plugin/src/main/java/org/sonar/css/plugin/CssRules.java b/sonar-css-plugin/src/main/java/org/sonar/css/plugin/CssRules.java index fe3088b..b2f8121 100644 --- a/sonar-css-plugin/src/main/java/org/sonar/css/plugin/CssRules.java +++ b/sonar-css-plugin/src/main/java/org/sonar/css/plugin/CssRules.java @@ -42,6 +42,7 @@ import org.sonar.css.plugin.rules.FunctionCalcNoUnspacedOperator; import org.sonar.css.plugin.rules.FunctionLinearGradientNoNonstandardDirection; import org.sonar.css.plugin.rules.KeyframeDeclarationNoImportant; import org.sonar.css.plugin.rules.MediaFeatureNameNoUnknown; +import org.sonar.css.plugin.rules.NoDescendingSpecificity; import org.sonar.css.plugin.rules.NoDuplicateAtImportRules; import org.sonar.css.plugin.rules.NoDuplicateSelectors; import org.sonar.css.plugin.rules.NoEmptySource; @@ -84,6 +85,7 @@ public class CssRules { FunctionLinearGradientNoNonstandardDirection.class, KeyframeDeclarationNoImportant.class, MediaFeatureNameNoUnknown.class, + NoDescendingSpecificity.class, NoDuplicateAtImportRules.class, NoDuplicateSelectors.class, NoEmptySource.class, diff --git a/sonar-css-plugin/src/main/java/org/sonar/css/plugin/rules/NoDescendingSpecificity.java b/sonar-css-plugin/src/main/java/org/sonar/css/plugin/rules/NoDescendingSpecificity.java new file mode 100644 index 0000000..72a31f6 --- /dev/null +++ b/sonar-css-plugin/src/main/java/org/sonar/css/plugin/rules/NoDescendingSpecificity.java @@ -0,0 +1,31 @@ +/* + * SonarCSS + * Copyright (C) 2018-2018 SonarSource SA + * mailto:info AT sonarsource DOT com + * + * This program is free software; you can redistribute it and/or + * modify it under the terms of the GNU Lesser General Public + * License as published by the Free Software Foundation; either + * version 3 of the License, or (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU + * Lesser General Public License for more details. + * + * You should have received a copy of the GNU Lesser General Public License + * along with this program; if not, write to the Free Software Foundation, + * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. + */ +package org.sonar.css.plugin.rules; + +import org.sonar.check.Rule; + +@Rule(key = "S4664") +public class NoDescendingSpecificity implements CssRule { + + @Override + public String stylelintKey() { + return "no-descending-specificity"; + } +} diff --git a/sonar-css-plugin/src/main/resources/org/sonar/l10n/css/rules/css/S4664.html b/sonar-css-plugin/src/main/resources/org/sonar/l10n/css/rules/css/S4664.html new file mode 100644 index 0000000..6f501e2 --- /dev/null +++ b/sonar-css-plugin/src/main/resources/org/sonar/l10n/css/rules/css/S4664.html @@ -0,0 +1,28 @@ +<p>Order of instructions in CSS is important: instructions that occur last in the file take the priority. When a selector with high specificity (eg +<code>#container a top: 10px; </code>) comes before the selector it overrides (eg: <code>a top: 0; </code>), the priority is given to the high +specificity definition which violates the principle of the last instruction takes the priority. </p> +<p>CSS are most legible when overriding selectors always come after the selectors they override. That way both mechanisms, source order and +specificity, work together nicely.</p> +<h2>Noncompliant Code Example</h2> +<pre> +b a {} +a {} + + +@media print { + #c a {} + a {} +} +</pre> +<h2>Compliant Solution</h2> +<pre> +a {} +b a {} + + +@media print { + a {} + #c a {} +} +</pre> + diff --git a/sonar-css-plugin/src/main/resources/org/sonar/l10n/css/rules/css/S4664.json b/sonar-css-plugin/src/main/resources/org/sonar/l10n/css/rules/css/S4664.json new file mode 100644 index 0000000..ebcea71 --- /dev/null +++ b/sonar-css-plugin/src/main/resources/org/sonar/l10n/css/rules/css/S4664.json @@ -0,0 +1,16 @@ +{ + "title": "Selectors of lower specificity should come before overriding selectors of higher specificity", + "type": "BUG", + "status": "ready", + "remediation": { + "func": "Constant\/Issue", + "constantCost": "5min" + }, + "tags": [ + + ], + "defaultSeverity": "Critical", + "ruleSpecification": "RSPEC-4664", + "sqKey": "S4664", + "scope": "Main" +} diff --git a/sonar-css-plugin/src/main/resources/org/sonar/l10n/css/rules/css/Sonar_way_profile.json b/sonar-css-plugin/src/main/resources/org/sonar/l10n/css/rules/css/Sonar_way_profile.json index adbe829..ce1c647 100644 --- a/sonar-css-plugin/src/main/resources/org/sonar/l10n/css/rules/css/Sonar_way_profile.json +++ b/sonar-css-plugin/src/main/resources/org/sonar/l10n/css/rules/css/Sonar_way_profile.json @@ -20,6 +20,7 @@ "S4661", "S4662", "S4663", + "S4664", "S4666", "S4667", "S4668", |