complain if named slots other than direct descendant of component

pull/4509/head
Tan Li Hau 6 years ago
parent fd378f2d37
commit d185a20ea1

@ -278,7 +278,7 @@ export default class Element extends Node {
}
validate_attributes() {
const { component } = this;
const { component, parent } = this;
const attribute_map = new Map();
@ -395,26 +395,20 @@ export default class Element extends Node {
component.slot_outlets.add(name);
}
let ancestor = this.parent;
do {
if (ancestor.type === 'InlineComponent') break;
if (ancestor.type === 'Element' && /-/.test(ancestor.name)) break;
if (ancestor.type === 'IfBlock' || ancestor.type === 'EachBlock') {
const type = ancestor.type === 'IfBlock' ? 'if' : 'each';
const message = `Cannot place slotted elements inside an ${type}-block`;
if (parent.type === 'IfBlock' || parent.type === 'EachBlock') {
const type = parent.type === 'IfBlock' ? 'if' : 'each';
const message = `Cannot place slotted elements inside an ${type}-block`;
component.error(attribute, {
code: `invalid-slotted-content`,
message
});
}
} while (ancestor = ancestor.parent);
component.error(attribute, {
code: `invalid-slotted-content`,
message
});
}
if (!ancestor) {
if (!(parent.type === 'InlineComponent' || (parent.type === 'Element' && /-/.test(parent.name)))) {
component.error(attribute, {
code: `invalid-slotted-content`,
message: `Element with a slot='...' attribute must be a descendant of a component or custom element`
message: `Element with a slot='...' attribute must be a direct descendant of a component or custom element`,
});
}
}

@ -0,0 +1,3 @@
export default {
error: [`Element with a slot='...' attribute must be a direct descendant of a component or custom element`]
};

@ -0,0 +1,11 @@
<script>
import Nested from "./Nested.svelte";
</script>
<Nested>
<div slot="slot1">
<div>
<div slot="slot2" />
</div>
</div>
</Nested>

@ -0,0 +1,3 @@
export default {
error: [`Element with a slot='...' attribute must be a direct descendant of a component or custom element`]
};

@ -0,0 +1,11 @@
<script>
import Nested from "./Nested.svelte";
</script>
<Nested>
<div>
<div>
<div slot="slot2" />
</div>
</div>
</Nested>

@ -0,0 +1,3 @@
export default {
error: [`Element with a slot='...' attribute must be a direct descendant of a component or custom element`]
};

@ -0,0 +1,9 @@
<script>
import Nested from "./Nested.svelte";
</script>
<Nested>
<div slot="slot1">
<div slot="slot2" />
</div>
</Nested>

@ -1,6 +1,6 @@
[{
"code": "invalid-slotted-content",
"message": "Element with a slot='...' attribute must be a descendant of a component or custom element",
"message": "Element with a slot='...' attribute must be a direct descendant of a component or custom element",
"start": {
"line": 1,
"column": 5,

Loading…
Cancel
Save