Parameterized pseudo-classes break selector highlighting in SCSS

[LeaVerou]

Information:

• Prism version: 1.29.0
• Plugins: none
• Environment: Browser

Description SCSS selectors that include parenthesized pseudo-classes are not highlighted as selectors. Note that CSS does not have this issue.

Example

Triggers the bug:

foo :foo() bar {

}

Does not trigger the bug:

foo :foo bar {

}

Workaround

This appears to fix it in my setup (simply removing () from [^@;{}()\s], but not sure whether it breaks something else (@golmote any idea why that avoids parens?):

Prism.languages.scss.selector.pattern = /(?=\S)[^@;{}()]?(?:[^@;{}\s]|\s+(?!\s)|#\{\$[-\w]+\})+(?=\s*\{(?:\}|\s|[^}][^:{}]*[:{][^}]))/;

[Golmote]

The pattern you suggested breaks the highlighting of the following code:

@mixin prefix($property, $value, $prefixes) {
}

where prefix should be tokenized as a function.