From cca87e41c87cac749519ca54dd513af7a3235289 Mon Sep 17 00:00:00 2001
From: Roy Choo <roy.choo@bytedance.com>
Date: Tue, 11 May 2021 23:34:07 +0800
Subject: [PATCH] fix: add global compound selector validations

fixes: https://github.com/sveltejs/svelte/issues/6272
---
 src/compiler/compile/css/Selector.ts          | 20 +++++++++++++++++++
 .../errors.json                               | 12 +++++++++++
 .../input.svelte                              |  5 +++++
 3 files changed, 37 insertions(+)
 create mode 100644 test/validator/samples/css-invalid-global-placement-4/errors.json
 create mode 100644 test/validator/samples/css-invalid-global-placement-4/input.svelte

diff --git a/src/compiler/compile/css/Selector.ts b/src/compiler/compile/css/Selector.ts
index 5feb59ec0c..9673c77f0e 100644
--- a/src/compiler/compile/css/Selector.ts
+++ b/src/compiler/compile/css/Selector.ts
@@ -130,6 +130,8 @@ export default class Selector {
 	}
 
 	validate(component: Component) {
+		this.blocks.some((block) => block.validateGlobalCompoundSelector(component));
+
 		let start = 0;
 		let end = this.blocks.length;
 
@@ -638,6 +640,24 @@ class Block {
 			this.selectors.every((selector) => selector.type === 'PseudoClassSelector' || selector.type === 'PseudoElementSelector')
 		);
 	}
+
+	validateGlobalCompoundSelector(component: Component) {
+		this.selectors.some((selector, index) => {
+			if (selector.type === 'PseudoClassSelector' &&
+					selector.name === 'global' &&
+					index !== 0 &&
+					selector.children &&
+					selector.children.length > 0 &&
+					selector.children[0].value[0] !== '.'
+				) {
+					component.error(selector, {
+						code: 'css-invalid-global',
+						message: ':global(...) which not at the start of selector sequence should not contain type or universal selector'
+					});
+					return false;
+				}
+		});
+	}
 }
 
 function group_selectors(selector: CssNode) {
diff --git a/test/validator/samples/css-invalid-global-placement-4/errors.json b/test/validator/samples/css-invalid-global-placement-4/errors.json
new file mode 100644
index 0000000000..883d15ccd4
--- /dev/null
+++ b/test/validator/samples/css-invalid-global-placement-4/errors.json
@@ -0,0 +1,12 @@
+[{
+	"code": "css-invalid-global",
+	"message": ":global(...) which not at the start of selector sequence should not contain type or universal selector",
+	"start": {
+		"line": 2,
+		"column": 5
+	},
+	"end": {
+		"line": 2,
+		"column": 17
+	}
+}]
\ No newline at end of file
diff --git a/test/validator/samples/css-invalid-global-placement-4/input.svelte b/test/validator/samples/css-invalid-global-placement-4/input.svelte
new file mode 100644
index 0000000000..42135a6163
--- /dev/null
+++ b/test/validator/samples/css-invalid-global-placement-4/input.svelte
@@ -0,0 +1,5 @@
+<style>
+	.foo:global(div) {
+		color: red;
+	}
+</style>
\ No newline at end of file