fix: add global compound selector validations

fixes: https://github.com/sveltejs/svelte/issues/6272
pull/6322/head
Roy Choo 5 years ago committed by tanhauhau
parent dc36d0c9af
commit cca87e41c8

@ -130,6 +130,8 @@ export default class Selector {
} }
validate(component: Component) { validate(component: Component) {
this.blocks.some((block) => block.validateGlobalCompoundSelector(component));
let start = 0; let start = 0;
let end = this.blocks.length; let end = this.blocks.length;
@ -638,6 +640,24 @@ class Block {
this.selectors.every((selector) => selector.type === 'PseudoClassSelector' || selector.type === 'PseudoElementSelector') 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) { function group_selectors(selector: CssNode) {

@ -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
}
}]

@ -0,0 +1,5 @@
<style>
.foo:global(div) {
color: red;
}
</style>
Loading…
Cancel
Save