diff --git a/src/compiler/compile/nodes/Element.ts b/src/compiler/compile/nodes/Element.ts index a4a22a39f6..d26cad8bb7 100644 --- a/src/compiler/compile/nodes/Element.ts +++ b/src/compiler/compile/nodes/Element.ts @@ -117,7 +117,7 @@ function get_namespace(parent: Element, element: Element, explicit_namespace: st } export default class Element extends Node { - type: 'Element' | 'DynamicElement'; + type: 'Element'; name: string; scope: TemplateScope; attributes: Attribute[] = []; @@ -140,10 +140,8 @@ export default class Element extends Node { if (this.name === 'svelte:element') { if (typeof info.tag === 'string') { - this.type = 'Element'; this.name = info.tag; } else { - this.type = 'DynamicElement'; this.dynamic_tag_expr = new Expression(component, this, scope, info.tag); } } diff --git a/src/compiler/compile/nodes/InlineComponent.ts b/src/compiler/compile/nodes/InlineComponent.ts index 3d9a8ab0db..bf7c58a327 100644 --- a/src/compiler/compile/nodes/InlineComponent.ts +++ b/src/compiler/compile/nodes/InlineComponent.ts @@ -106,7 +106,7 @@ export default class InlineComponent extends Node { if (child.type === 'SlotTemplate') { children.push(child); info.children.splice(i, 1); - } else if ((child.type === 'Element' || child.type === 'DynamicElement' || child.type === 'InlineComponent' || child.type === 'Slot') && child.attributes.find(attribute => attribute.name === 'slot')) { + } else if ((child.type === 'Element' || child.type === 'InlineComponent' || child.type === 'Slot') && child.attributes.find(attribute => attribute.name === 'slot')) { const slot_template = { start: child.start, end: child.end, diff --git a/src/compiler/compile/nodes/shared/map_children.ts b/src/compiler/compile/nodes/shared/map_children.ts index c6a9ac1747..b1d0816aac 100644 --- a/src/compiler/compile/nodes/shared/map_children.ts +++ b/src/compiler/compile/nodes/shared/map_children.ts @@ -25,7 +25,6 @@ function get_constructor(type) { case 'AwaitBlock': return AwaitBlock; case 'Body': return Body; case 'Comment': return Comment; - case 'DynamicElement' : return Element; case 'EachBlock': return EachBlock; case 'Element': return Element; case 'Head': return Head; diff --git a/src/compiler/compile/render_dom/wrappers/Element/index.ts b/src/compiler/compile/render_dom/wrappers/Element/index.ts index c2f32633c8..9b76078b5b 100644 --- a/src/compiler/compile/render_dom/wrappers/Element/index.ts +++ b/src/compiler/compile/render_dom/wrappers/Element/index.ts @@ -248,7 +248,7 @@ export default class ElementWrapper extends Wrapper { b`${node} = ${render_statement};` ); - if (this.node.type === 'DynamicElement' && this.renderer.options.dev) { + if (this.node.dynamic_tag_expr && this.renderer.options.dev) { block.chunks.create.push(b`@validate_dynamic_element(${this.node.dynamic_tag_expr.manipulate(block)});`); if (renderer.options.hydratable) { @@ -354,7 +354,7 @@ export default class ElementWrapper extends Wrapper { this.add_classes(block); this.add_manual_style_scoping(block); - if (this.node.type === 'DynamicElement') { + if (this.node.dynamic_tag_expr) { const dependencies = this.node.dynamic_tag_expr.dynamic_dependencies(); if (dependencies.length) { const condition = block.renderer.dirty( @@ -405,7 +405,7 @@ export default class ElementWrapper extends Wrapper { return x`@element_is("${name}", ${is.render_chunks(block).reduce((lhs, rhs) => x`${lhs} + ${rhs}`)})`; } - const reference = this.node.type === 'DynamicElement' ? this.node.dynamic_tag_expr.manipulate(block) : `"${name}"`; + const reference = this.node.dynamic_tag_expr ? this.node.dynamic_tag_expr.manipulate(block) : `"${name}"`; return x`@element(${reference})`; } @@ -417,7 +417,7 @@ export default class ElementWrapper extends Wrapper { const name = this.node.namespace ? this.node.name : this.node.name.toUpperCase(); - const reference = this.node.type === 'DynamicElement' ? this.node.dynamic_tag_expr.manipulate(block) : `"${name}"`; + const reference = this.node.dynamic_tag_expr ? this.node.dynamic_tag_expr.manipulate(block) : `"${name}"`; if (this.node.namespace === namespaces.svg) { return x`@claim_svg_element(${nodes}, ${reference}, { ${attributes} })`; diff --git a/src/compiler/compile/render_dom/wrappers/Fragment.ts b/src/compiler/compile/render_dom/wrappers/Fragment.ts index 134f51b18c..26a4e32bce 100644 --- a/src/compiler/compile/render_dom/wrappers/Fragment.ts +++ b/src/compiler/compile/render_dom/wrappers/Fragment.ts @@ -117,8 +117,8 @@ export default class FragmentWrapper { link(last_child, last_child = wrapper); } else { const Wrapper = (function () { - if (child.type === 'DynamicElement' && child.dynamic_tag_expr.dynamic_dependencies().length === 0) { - return wrappers['Element']; + if (child.type === 'Element' && child.dynamic_tag_expr) { + return wrappers['DynamicElement']; } else { return wrappers[child.type]; } diff --git a/src/compiler/compile/render_ssr/Renderer.ts b/src/compiler/compile/render_ssr/Renderer.ts index b013fdd98d..997392572e 100644 --- a/src/compiler/compile/render_ssr/Renderer.ts +++ b/src/compiler/compile/render_ssr/Renderer.ts @@ -113,7 +113,13 @@ export default class Renderer { render(nodes: INode[], options: RenderOptions) { nodes.forEach(node => { - const handler = handlers[node.type]; + const handler = (function () { + if (node.type === 'Element' && node.dynamic_tag_expr) { + return handlers['DynamicElement']; + } else { + return handlers[node.type]; + } + }()); if (!handler) { throw new Error(`No handler for '${node.type}' nodes`); diff --git a/src/compiler/interfaces.ts b/src/compiler/interfaces.ts index 85feb72ce0..b999fbd803 100644 --- a/src/compiler/interfaces.ts +++ b/src/compiler/interfaces.ts @@ -47,7 +47,7 @@ interface BaseDirective extends BaseNode { } export interface Element extends BaseNode { - type: 'InlineComponent' | 'SlotTemplate' | 'Title' | 'Slot' | 'Element' | 'DynamicElement' | 'Head' | 'Options' | 'Window' | 'Body'; + type: 'InlineComponent' | 'SlotTemplate' | 'Title' | 'Slot' | 'Element' | 'Head' | 'Options' | 'Window' | 'Body'; attributes: Array; name: string; } diff --git a/src/compiler/parse/state/tag.ts b/src/compiler/parse/state/tag.ts index 0703405126..b9fb296b58 100644 --- a/src/compiler/parse/state/tag.ts +++ b/src/compiler/parse/state/tag.ts @@ -106,9 +106,9 @@ export default function tag(parser: Parser) { if (meta_tags.has(name)) return meta_tags.get(name); if ((/[A-Z]/.test(name[0]) || name === 'svelte:self' || name === 'svelte:component')) return 'InlineComponent'; if (name === 'svelte:fragment') return 'SlotTemplate'; - if (name === 'svelte:element') return 'DynamicElement'; if (name === 'title' && parent_is_head(parser.stack)) return 'Title'; if (name === 'slot' && !parser.customElement) return 'Slot'; + if (name === 'svelte:element') return 'Element'; return 'Element'; })(); diff --git a/test/parser/samples/dynamic-element-string/output.json b/test/parser/samples/dynamic-element-string/output.json index b88e796bb9..9e9245b1ae 100644 --- a/test/parser/samples/dynamic-element-string/output.json +++ b/test/parser/samples/dynamic-element-string/output.json @@ -7,7 +7,7 @@ { "start": 0, "end": 44, - "type": "DynamicElement", + "type": "Element", "name": "svelte:element", "attributes": [], "children": [], @@ -23,7 +23,7 @@ { "start": 45, "end": 101, - "type": "DynamicElement", + "type": "Element", "name": "svelte:element", "attributes": [ { @@ -47,4 +47,4 @@ } ] } -} \ No newline at end of file +} diff --git a/test/parser/samples/dynamic-element-variable/output.json b/test/parser/samples/dynamic-element-variable/output.json index 7c5fe713d0..53769e94e3 100644 --- a/test/parser/samples/dynamic-element-variable/output.json +++ b/test/parser/samples/dynamic-element-variable/output.json @@ -7,7 +7,7 @@ { "start": 0, "end": 44, - "type": "DynamicElement", + "type": "Element", "name": "svelte:element", "attributes": [], "children": [], @@ -38,7 +38,7 @@ { "start": 45, "end": 101, - "type": "DynamicElement", + "type": "Element", "name": "svelte:element", "children": [], "attributes": [