Skip to content

Commit 3c6937a

Browse files
thecalamiitythecalamiity
authored
fix: prevent false positives for !important inside comments (eslint#218)
* fix: prevent false positives for !important inside comments * add tests for !important comment edge cases * add missing suggestions to tests
1 parent 7a2ecad commit 3c6937a

File tree

2 files changed

+236
-2
lines changed

2 files changed

+236
-2
lines changed

‎src/rules/no-important.js‎

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,8 @@ import { findOffsets } from "../util.js";
2424
// Helpers
2525
//-----------------------------------------------------------------------------
2626

27-
const importantPattern = /!(\s|\/\*.*?\*\/)*important/iu;
27+
const importantPattern = /!\s*important/iu;
28+
const commentPattern = /\/\*[\s\S]*?\*\//gu;
2829
const trailingWhitespacePattern = /\s*$/u;
2930

3031
//-----------------------------------------------------------------------------
@@ -55,8 +56,12 @@ export default {
5556
Declaration(node) {
5657
if (node.important) {
5758
const declarationText = context.sourceCode.getText(node);
59+
const textWithoutComments = declarationText.replace(
60+
commentPattern,
61+
match => match.replace(/[^\n]/gu, " "),
62+
);
5863
const importantMatch =
59-
importantPattern.exec(declarationText);
64+
importantPattern.exec(textWithoutComments);
6065

6166
const {
6267
lineOffset: startLineOffset,

‎tests/rules/no-important.test.js‎

Lines changed: 229 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,9 @@ ruleTester.run("no-important", rule, {
4747
"@keyframes important { from { margin: 1px; } }",
4848
"@-webkit-keyframes important { from { margin: 1px; } }",
4949
"@-WEBKIT-KEYFRAMES important { from { margin: 1px; } }",
50+
"a { color: red /* !important */; }",
51+
"a { color: /* !important */ red; }",
52+
"a { color: red; /* !important */ background: blue; }",
5053
],
5154
invalid: [
5255
{
@@ -535,5 +538,231 @@ ruleTester.run("no-important", rule, {
535538
},
536539
],
537540
},
541+
{
542+
code: "a { color: red /* !important */ !important; }",
543+
errors: [
544+
{
545+
messageId: "unexpectedImportant",
546+
line: 1,
547+
column: 33,
548+
endLine: 1,
549+
endColumn: 43,
550+
suggestions: [
551+
{
552+
messageId: "removeImportant",
553+
output: "a { color: red /* !important */; }",
554+
},
555+
],
556+
},
557+
],
558+
},
559+
{
560+
code: dedent`
561+
a {
562+
color: red /* !important */
563+
!important;
564+
}
565+
`,
566+
errors: [
567+
{
568+
messageId: "unexpectedImportant",
569+
line: 3,
570+
column: 3,
571+
endLine: 3,
572+
endColumn: 13,
573+
suggestions: [
574+
{
575+
messageId: "removeImportant",
576+
output: dedent`
577+
a {
578+
color: red /* !important */;
579+
}
580+
`,
581+
},
582+
],
583+
},
584+
],
585+
},
586+
{
587+
code: "a { color: red !/* !important */important; }",
588+
errors: [
589+
{
590+
messageId: "unexpectedImportant",
591+
line: 1,
592+
column: 16,
593+
endLine: 1,
594+
endColumn: 42,
595+
suggestions: [
596+
{
597+
messageId: "removeImportant",
598+
output: "a { color: red; }",
599+
},
600+
],
601+
},
602+
],
603+
},
604+
{
605+
code: "a { color: red ! /* !important */ important; }",
606+
errors: [
607+
{
608+
messageId: "unexpectedImportant",
609+
line: 1,
610+
column: 16,
611+
endLine: 1,
612+
endColumn: 44,
613+
suggestions: [
614+
{
615+
messageId: "removeImportant",
616+
output: "a { color: red; }",
617+
},
618+
],
619+
},
620+
],
621+
},
622+
{
623+
code: dedent`
624+
a {
625+
color: red
626+
!/* !important */important;
627+
}
628+
`,
629+
errors: [
630+
{
631+
messageId: "unexpectedImportant",
632+
line: 3,
633+
column: 3,
634+
endLine: 3,
635+
endColumn: 29,
636+
suggestions: [
637+
{
638+
messageId: "removeImportant",
639+
output: dedent`
640+
a {
641+
color: red;
642+
}
643+
`,
644+
},
645+
],
646+
},
647+
],
648+
},
649+
{
650+
code: dedent`
651+
a {
652+
color: red
653+
! /* !important */ important;
654+
}
655+
`,
656+
errors: [
657+
{
658+
messageId: "unexpectedImportant",
659+
line: 3,
660+
column: 3,
661+
endLine: 3,
662+
endColumn: 31,
663+
suggestions: [
664+
{
665+
messageId: "removeImportant",
666+
output: dedent`
667+
a {
668+
color: red;
669+
}
670+
`,
671+
},
672+
],
673+
},
674+
],
675+
},
676+
{
677+
code: "a { color: red /* !important */ /* !important */ !important; }",
678+
errors: [
679+
{
680+
messageId: "unexpectedImportant",
681+
line: 1,
682+
column: 50,
683+
endLine: 1,
684+
endColumn: 60,
685+
suggestions: [
686+
{
687+
messageId: "removeImportant",
688+
output: "a { color: red /* !important */ /* !important */; }",
689+
},
690+
],
691+
},
692+
],
693+
},
694+
{
695+
code: dedent`
696+
a {
697+
color: red /* !important */ /* !important
698+
*/ !important;
699+
}
700+
`,
701+
errors: [
702+
{
703+
messageId: "unexpectedImportant",
704+
line: 3,
705+
column: 5,
706+
endLine: 3,
707+
endColumn: 15,
708+
suggestions: [
709+
{
710+
messageId: "removeImportant",
711+
output: dedent`
712+
a {
713+
color: red /* !important */ /* !important
714+
*/;
715+
}
716+
`,
717+
},
718+
],
719+
},
720+
],
721+
},
722+
{
723+
code: "a { color: red ! /* !important */ /* another comment */ /* a third comment */important; }",
724+
errors: [
725+
{
726+
messageId: "unexpectedImportant",
727+
line: 1,
728+
column: 16,
729+
endLine: 1,
730+
endColumn: 87,
731+
suggestions: [
732+
{
733+
messageId: "removeImportant",
734+
output: "a { color: red; }",
735+
},
736+
],
737+
},
738+
],
739+
},
740+
{
741+
code: dedent`
742+
a {
743+
color: red ! /* !important */ /* another
744+
comment */ /* a third comment */important;
745+
}
746+
`,
747+
errors: [
748+
{
749+
messageId: "unexpectedImportant",
750+
line: 2,
751+
column: 13,
752+
endLine: 3,
753+
endColumn: 43,
754+
suggestions: [
755+
{
756+
messageId: "removeImportant",
757+
output: dedent`
758+
a {
759+
color: red;
760+
}
761+
`,
762+
},
763+
],
764+
},
765+
],
766+
},
538767
],
539768
});

0 commit comments

Comments
 (0)