diff --git a/src/compiler/compile/css/Selector.ts b/src/compiler/compile/css/Selector.ts
index c60bd1d443..611ce5b724 100644
--- a/src/compiler/compile/css/Selector.ts
+++ b/src/compiler/compile/css/Selector.ts
@@ -418,8 +418,16 @@ function get_element_parent(node: Element): Element | null {
function get_possible_element_siblings(node: INode, adjacent_only: boolean): ElementAndExist[] {
const result: ElementAndExist[] = [];
let prev: INode = node;
- while ((prev = prev.prev) && prev.type !== 'Element') {
- if (prev.type === 'EachBlock' || prev.type === 'IfBlock' || prev.type === 'AwaitBlock') {
+ while (prev = prev.prev) {
+ if (prev.type === 'Element') {
+ if (!prev.attributes.find(attr => attr.name.toLowerCase() === 'slot')) {
+ result.push({ element: prev as Element, exist: NodeExist.Definitely });
+ }
+
+ if (adjacent_only) {
+ break;
+ }
+ } else if (prev.type === 'EachBlock' || prev.type === 'IfBlock' || prev.type === 'AwaitBlock') {
const possible_last_child = get_possible_last_child(prev, adjacent_only);
result.push(...possible_last_child);
if (adjacent_only && possible_last_child.find(child => child.exist === NodeExist.Definitely)) {
@@ -428,10 +436,6 @@ function get_possible_element_siblings(node: INode, adjacent_only: boolean): Ele
}
}
- if (prev) {
- result.push({ element: prev as Element, exist: NodeExist.Definitely });
- }
-
if (!prev || !adjacent_only) {
let parent: INode = node;
if (node.type === 'ElseBlock') {
diff --git a/test/css/samples/general-siblings-combinator-slot/_config.js b/test/css/samples/general-siblings-combinator-slot/_config.js
new file mode 100644
index 0000000000..7fa19c68b4
--- /dev/null
+++ b/test/css/samples/general-siblings-combinator-slot/_config.js
@@ -0,0 +1,88 @@
+export default {
+ warnings: [
+ {
+ code: "css-unused-selector",
+ frame: `
+ 8:
+ 9: /* no match */
+ 10: .a ~ .b { color: green; }
+ ^
+ 11: .b ~ .c { color: green; }
+ 12: .c ~ .f { color: green; }`,
+ message: 'Unused CSS selector ".a ~ .b"',
+ pos: 111,
+ start: { character: 111, column: 1, line: 10 },
+ end: { character: 118, column: 8, line: 10 },
+ },
+ {
+ code: "css-unused-selector",
+ frame: `
+ 9: /* no match */
+ 10: .a ~ .b { color: green; }
+ 11: .b ~ .c { color: green; }
+ ^
+ 12: .c ~ .f { color: green; }
+ 13: .f ~ .g { color: green; }`,
+ message: 'Unused CSS selector ".b ~ .c"',
+ pos: 138,
+ start: { character: 138, column: 1, line: 11 },
+ end: { character: 145, column: 8, line: 11 },
+ },
+ {
+ code: "css-unused-selector",
+ frame: `
+ 10: .a ~ .b { color: green; }
+ 11: .b ~ .c { color: green; }
+ 12: .c ~ .f { color: green; }
+ ^
+ 13: .f ~ .g { color: green; }
+ 14: .b ~ .f { color: green; }`,
+ message: 'Unused CSS selector ".c ~ .f"',
+ pos: 165,
+ start: { character: 165, column: 1, line: 12 },
+ end: { character: 172, column: 8, line: 12 },
+ },
+ {
+ code: "css-unused-selector",
+ frame: `
+ 11: .b ~ .c { color: green; }
+ 12: .c ~ .f { color: green; }
+ 13: .f ~ .g { color: green; }
+ ^
+ 14: .b ~ .f { color: green; }
+ 15: .b ~ .g { color: green; }`,
+ message: 'Unused CSS selector ".f ~ .g"',
+ pos: 192,
+ start: { character: 192, column: 1, line: 13 },
+ end: { character: 199, column: 8, line: 13 },
+ },
+ {
+ code: "css-unused-selector",
+ frame: `
+ 12: .c ~ .f { color: green; }
+ 13: .f ~ .g { color: green; }
+ 14: .b ~ .f { color: green; }
+ ^
+ 15: .b ~ .g { color: green; }
+ 16: `,
+ message: 'Unused CSS selector ".b ~ .f"',
+ pos: 219,
+ start: { character: 219, column: 1, line: 14 },
+ end: { character: 226, column: 8, line: 14 },
+ },
+ {
+ code: "css-unused-selector",
+ frame: `
+ 13: .f ~ .g { color: green; }
+ 14: .b ~ .f { color: green; }
+ 15: .b ~ .g { color: green; }
+ ^
+ 16:
+ 17:`,
+ message: 'Unused CSS selector ".b ~ .g"',
+ pos: 246,
+ start: { character: 246, column: 1, line: 15 },
+ end: { character: 253, column: 8, line: 15 },
+ },
+ ],
+};
diff --git a/test/css/samples/general-siblings-combinator-slot/expected.css b/test/css/samples/general-siblings-combinator-slot/expected.css
new file mode 100644
index 0000000000..29325e0cef
--- /dev/null
+++ b/test/css/samples/general-siblings-combinator-slot/expected.css
@@ -0,0 +1 @@
+.d.svelte-xyz~.e.svelte-xyz{color:green}.a.svelte-xyz~.g.svelte-xyz{color:green}
\ No newline at end of file
diff --git a/test/css/samples/general-siblings-combinator-slot/input.svelte b/test/css/samples/general-siblings-combinator-slot/input.svelte
new file mode 100644
index 0000000000..e5af4c0962
--- /dev/null
+++ b/test/css/samples/general-siblings-combinator-slot/input.svelte
@@ -0,0 +1,30 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/test/css/samples/general-siblings-combinator/_config.js b/test/css/samples/general-siblings-combinator/_config.js
index 52addc4741..adac80e7d5 100644
--- a/test/css/samples/general-siblings-combinator/_config.js
+++ b/test/css/samples/general-siblings-combinator/_config.js
@@ -3,58 +3,58 @@ export default {
{
code: "css-unused-selector",
frame: `
- 17:
- 18: /* no match */
- 19: article ~ div {
+ 10:
+ 11: /* no match */
+ 12: article ~ div { color: green; }
^
- 20: color: green;
- 21: }`,
+ 13: span ~ article { color: green; }
+ 14: b ~ article { color: green; }`,
message: 'Unused CSS selector "article ~ div"',
- pos: 194,
- start: { character: 194, column: 1, line: 19 },
- end: { character: 207, column: 14, line: 19 }
+ pos: 275,
+ start: { character: 275, column: 1, line: 12 },
+ end: { character: 288, column: 14, line: 12 },
},
{
code: "css-unused-selector",
frame: `
- 20: color: green;
- 21: }
- 22: span ~ article {
+ 11: /* no match */
+ 12: article ~ div { color: green; }
+ 13: span ~ article { color: green; }
^
- 23: color: green;
- 24: }`,
+ 14: b ~ article { color: green; }
+ 15: span ~ div { color: green; }`,
message: 'Unused CSS selector "span ~ article"',
- pos: 230,
- start: { character: 230, column: 1, line: 22 },
- end: { character: 244, column: 15, line: 22 }
+ pos: 308,
+ start: { character: 308, column: 1, line: 13 },
+ end: { character: 322, column: 15, line: 13 },
},
{
code: "css-unused-selector",
frame: `
- 23: color: green;
- 24: }
- 25: b ~ article {
+ 12: article ~ div { color: green; }
+ 13: span ~ article { color: green; }
+ 14: b ~ article { color: green; }
^
- 26: color: green;
- 27: }`,
+ 15: span ~ div { color: green; }
+ 16: `,
message: 'Unused CSS selector "b ~ article"',
- pos: 267,
- start: { character: 267, column: 1, line: 25 },
- end: { character: 278, column: 12, line: 25 }
+ pos: 342,
+ start: { character: 342, column: 1, line: 14 },
+ end: { character: 353, column: 12, line: 14 },
},
{
code: "css-unused-selector",
frame: `
- 26: color: green;
- 27: }
- 28: span ~ div {
+ 13: span ~ article { color: green; }
+ 14: b ~ article { color: green; }
+ 15: span ~ div { color: green; }
^
- 29: color: green;
- 30: }`,
+ 16:
+ 17:`,
message: 'Unused CSS selector "span ~ div"',
- pos: 301,
- start: { character: 301, column: 1, line: 28 },
- end: { character: 311, column: 11, line: 28 }
- }
- ]
+ pos: 373,
+ start: { character: 373, column: 1, line: 15 },
+ end: { character: 383, column: 11, line: 15 },
+ },
+ ],
};
diff --git a/test/css/samples/general-siblings-combinator/expected.css b/test/css/samples/general-siblings-combinator/expected.css
index 52944a303a..647a53f778 100644
--- a/test/css/samples/general-siblings-combinator/expected.css
+++ b/test/css/samples/general-siblings-combinator/expected.css
@@ -1 +1 @@
-div.svelte-xyz~article.svelte-xyz.svelte-xyz{color:green}span.svelte-xyz~b.svelte-xyz.svelte-xyz{color:green}div.svelte-xyz span.svelte-xyz~b.svelte-xyz{color:green}.a.svelte-xyz~article.svelte-xyz.svelte-xyz{color:green}div.svelte-xyz~.b.svelte-xyz.svelte-xyz{color:green}
\ No newline at end of file
+div.svelte-xyz~article.svelte-xyz.svelte-xyz{color:green}span.svelte-xyz~b.svelte-xyz.svelte-xyz{color:green}div.svelte-xyz span.svelte-xyz~b.svelte-xyz{color:green}.a.svelte-xyz~article.svelte-xyz.svelte-xyz{color:green}div.svelte-xyz~.b.svelte-xyz.svelte-xyz{color:green}.a.svelte-xyz~.c.svelte-xyz.svelte-xyz{color:green}article.svelte-xyz~details.svelte-xyz.svelte-xyz{color:green}.a.svelte-xyz~details.svelte-xyz.svelte-xyz{color:green}
\ No newline at end of file
diff --git a/test/css/samples/general-siblings-combinator/expected.html b/test/css/samples/general-siblings-combinator/expected.html
index f4692365dd..01fbffcae4 100644
--- a/test/css/samples/general-siblings-combinator/expected.html
+++ b/test/css/samples/general-siblings-combinator/expected.html
@@ -2,4 +2,6 @@
-
\ No newline at end of file
+
+
+
\ No newline at end of file
diff --git a/test/css/samples/general-siblings-combinator/input.svelte b/test/css/samples/general-siblings-combinator/input.svelte
index 57f219d792..533702a3a3 100644
--- a/test/css/samples/general-siblings-combinator/input.svelte
+++ b/test/css/samples/general-siblings-combinator/input.svelte
@@ -1,37 +1,24 @@
-
\ No newline at end of file
+
+
+
\ No newline at end of file
diff --git a/test/css/samples/siblings-combinator-slot/_config.js b/test/css/samples/siblings-combinator-slot/_config.js
new file mode 100644
index 0000000000..c0a00500d4
--- /dev/null
+++ b/test/css/samples/siblings-combinator-slot/_config.js
@@ -0,0 +1,46 @@
+export default {
+ warnings: [
+ {
+ code: "css-unused-selector",
+ frame: `
+ 7:
+ 8: /* no match */
+ 9: .a + .b { color: green; }
+ ^
+ 10: .b + .c { color: green; }
+ 11: .c + .f { color: green; }`,
+ message: 'Unused CSS selector ".a + .b"',
+ pos: 84,
+ start: { character: 84, column: 1, line: 9 },
+ end: { character: 91, column: 8, line: 9 }
+ },
+ {
+ code: "css-unused-selector",
+ frame: `
+ 8: /* no match */
+ 9: .a + .b { color: green; }
+ 10: .b + .c { color: green; }
+ ^
+ 11: .c + .f { color: green; }
+ 12: `,
+ message: 'Unused CSS selector ".b + .c"',
+ pos: 111,
+ start: { character: 111, column: 1, line: 10 },
+ end: { character: 118, column: 8, line: 10 }
+ },
+ {
+ code: "css-unused-selector",
+ frame: `
+ 9: .a + .b { color: green; }
+ 10: .b + .c { color: green; }
+ 11: .c + .f { color: green; }
+ ^
+ 12:
+ 13:`,
+ message: 'Unused CSS selector ".c + .f"',
+ pos: 138,
+ start: { character: 138, column: 1, line: 11 },
+ end: { character: 145, column: 8, line: 11 }
+ }
+ ]
+};
diff --git a/test/css/samples/siblings-combinator-slot/expected.css b/test/css/samples/siblings-combinator-slot/expected.css
new file mode 100644
index 0000000000..bbdd03f274
--- /dev/null
+++ b/test/css/samples/siblings-combinator-slot/expected.css
@@ -0,0 +1 @@
+.d.svelte-xyz+.e.svelte-xyz{color:green}
\ No newline at end of file
diff --git a/test/css/samples/siblings-combinator-slot/input.svelte b/test/css/samples/siblings-combinator-slot/input.svelte
new file mode 100644
index 0000000000..42fe0e4c30
--- /dev/null
+++ b/test/css/samples/siblings-combinator-slot/input.svelte
@@ -0,0 +1,24 @@
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file