diff --git a/src/compiler/compile/css/Selector.ts b/src/compiler/compile/css/Selector.ts index 49ba5e71e5..0eea853b3a 100644 --- a/src/compiler/compile/css/Selector.ts +++ b/src/compiler/compile/css/Selector.ts @@ -147,7 +147,7 @@ export default class Selector { for (const block of this.blocks) { for (const selector of block.selectors) { if (selector.type === 'PseudoClassSelector' && selector.name === 'global') { - if (/[^\\],/.test(selector.children[0].value)) { + if (/[^\\],(?!([^([]+[^\\]|[^([\\])[)\]])/.test(selector.children[0].value)) { component.error(selector, { code: 'css-invalid-global-selector', message: ':global(...) must contain a single selector' diff --git a/test/validator/samples/css-invalid-global-selector-2/errors.json b/test/validator/samples/css-invalid-global-selector-2/errors.json new file mode 100644 index 0000000000..3317925b00 --- /dev/null +++ b/test/validator/samples/css-invalid-global-selector-2/errors.json @@ -0,0 +1,17 @@ +[ + { + "code": "css-invalid-global-selector", + "message": ":global(...) must contain a single selector", + "start": { + "line": 11, + "column": 5, + "character": 156 + }, + "end": { + "line": 11, + "column": 29, + "character": 180 + }, + "pos": 156 + } +] diff --git a/test/validator/samples/css-invalid-global-selector-2/input.svelte b/test/validator/samples/css-invalid-global-selector-2/input.svelte new file mode 100644 index 0000000000..6acbabd7da --- /dev/null +++ b/test/validator/samples/css-invalid-global-selector-2/input.svelte @@ -0,0 +1,18 @@ + + +
+

hello world

+
\ No newline at end of file diff --git a/test/validator/samples/css-invalid-global-selector-3/errors.json b/test/validator/samples/css-invalid-global-selector-3/errors.json new file mode 100644 index 0000000000..abc516a504 --- /dev/null +++ b/test/validator/samples/css-invalid-global-selector-3/errors.json @@ -0,0 +1,17 @@ +[ + { + "code": "css-invalid-global-selector", + "message": ":global(...) must contain a single selector", + "start": { + "line": 5, + "column": 5, + "character": 77 + }, + "end": { + "line": 5, + "column": 44, + "character": 116 + }, + "pos": 77 + } +] diff --git a/test/validator/samples/css-invalid-global-selector-3/input.svelte b/test/validator/samples/css-invalid-global-selector-3/input.svelte new file mode 100644 index 0000000000..dca0094a06 --- /dev/null +++ b/test/validator/samples/css-invalid-global-selector-3/input.svelte @@ -0,0 +1,12 @@ + + +
+

hello world

+
diff --git a/test/validator/samples/css-invalid-global-selector-4/errors.json b/test/validator/samples/css-invalid-global-selector-4/errors.json new file mode 100644 index 0000000000..8d76cb63c0 --- /dev/null +++ b/test/validator/samples/css-invalid-global-selector-4/errors.json @@ -0,0 +1,17 @@ +[ + { + "code": "css-invalid-global-selector", + "message": ":global(...) must contain a single selector", + "start": { + "line": 2, + "column": 5, + "character": 13 + }, + "end": { + "line": 2, + "column": 24, + "character": 32 + }, + "pos": 13 + } +] diff --git a/test/validator/samples/css-invalid-global-selector-4/input.svelte b/test/validator/samples/css-invalid-global-selector-4/input.svelte new file mode 100644 index 0000000000..ed33b6b385 --- /dev/null +++ b/test/validator/samples/css-invalid-global-selector-4/input.svelte @@ -0,0 +1,9 @@ + + +
+

hello world

+