diff --git a/src/compiler/compile/render_dom/wrappers/Element/index.ts b/src/compiler/compile/render_dom/wrappers/Element/index.ts index 7e681ac2fd..71adf0c51f 100644 --- a/src/compiler/compile/render_dom/wrappers/Element/index.ts +++ b/src/compiler/compile/render_dom/wrappers/Element/index.ts @@ -169,8 +169,17 @@ export default class ElementWrapper extends Wrapper { next_sibling: Wrapper ) { super(renderer, block, parent, node); - const is_original_dynamic_element = node.is_dynamic_element && block.type !== CHILD_DYNAMIC_ELEMENT_BLOCK; - if (is_original_dynamic_element) { + + this.var = { + type: 'Identifier', + name: node.name.replace(regex_invalid_variable_identifier_characters, '_') + }; + + this.void = is_void(node.name); + + this.class_dependencies = []; + + if (node.is_dynamic_element && block.type !== CHILD_DYNAMIC_ELEMENT_BLOCK) { this.child_dynamic_element_block = block.child({ comment: create_debugging_comment(node, renderer.component), name: renderer.component.get_unique_name('create_dynamic_element'), @@ -185,90 +194,81 @@ export default class ElementWrapper extends Wrapper { strip_whitespace, next_sibling ); - } - this.var = { - type: 'Identifier', - name: node.name.replace(regex_invalid_variable_identifier_characters, '_') - }; - - this.void = is_void(node.name); - - this.class_dependencies = []; + // the original svelte:element is never used for rendering, because + // it gets assigned a child_dynamic_element which is used in all rendering logic. + // so doing all of this on the original svelte:element will just cause double + // code, because it will be done again on the child_dynamic_element. + return; + } - // the original svelte:element is never used for rendering, because - // it gets assigned a child_dynamic_element which is used in all rendering logic. - // so doing all of this on the original svelte:element will just cause double - // code, because it will be done again on the child_dynamic_element. - if (!is_original_dynamic_element) { - if (this.node.children.length) { - this.node.lets.forEach(l => { - extract_names(l.value || l.name).forEach(name => { - renderer.add_to_context(name, true); - }); + if (this.node.children.length) { + this.node.lets.forEach(l => { + extract_names(l.value || l.name).forEach(name => { + renderer.add_to_context(name, true); }); - } - - this.attributes = this.node.attributes.map(attribute => { - if (attribute.name === 'style') { - return new StyleAttributeWrapper(this, block, attribute); - } - if (attribute.type === 'Spread') { - return new SpreadAttributeWrapper(this, block, attribute); - } - return new AttributeWrapper(this, block, attribute); }); + } - // ordinarily, there'll only be one... but we need to handle - // the rare case where an element can have multiple bindings, - // e.g.