diff --git a/src/generators/dom/index.js b/src/generators/dom/index.js index fb968c1263..b75fb69c43 100644 --- a/src/generators/dom/index.js +++ b/src/generators/dom/index.js @@ -86,26 +86,26 @@ class DomGenerator extends Generator { ` ); } - generateBlock ( node, name, type ) { - const childFragment = this.current.child({ - type, - name, - target: 'target', - localElementDepth: 0, - builders: getBuilders(), - getUniqueName: this.getUniqueNameMaker( this.current.params ) - }); - - this.push( childFragment ); - - // walk the children here - node.children.forEach( node => visit( node, this ) ); - this.addRenderer( this.current ); - this.pop(); - - // unset the children, to avoid them being visited again - node.children = []; - } + // generateBlock ( node, name, type ) { + // const childFragment = this.current.child({ + // type, + // name, + // target: 'target', + // localElementDepth: 0, + // builders: getBuilders(), + // getUniqueName: this.getUniqueNameMaker( this.current.params ) + // }); + + // this.push( childFragment ); + + // // walk the children here + // node.children.forEach( node => visit( node, this ) ); + // this.addRenderer( this.current ); + // this.pop(); + + // // unset the children, to avoid them being visited again + // node.children = []; + // } helper ( name ) { if ( this.options.dev && `${name}Dev` in shared ) { diff --git a/src/generators/dom/visitors/Component.js b/src/generators/dom/visitors/Component.js index 623332a334..95c3e737b5 100644 --- a/src/generators/dom/visitors/Component.js +++ b/src/generators/dom/visitors/Component.js @@ -78,7 +78,16 @@ export default function visitComponent ( generator, fragment, node ) { const yieldName = generator.getUniqueName( `render_${name}_yield_fragment` ); const params = fragment.params.join( ', ' ); - generator.generateBlock( node, yieldName, 'block' ); + const childFragment = this.current.child({ + type: 'component', + name: generator.getUniqueName( `render_${name}_yield_fragment` ), // TODO should getUniqueName happen inside Fragment? probably + target: 'target', + localElementDepth: 0 + }); + + node.children.forEach( child => { + visit( generator, childFragment, child ); + }); const yieldFragment = fragment.getUniqueName( `${name}_yield_fragment` ); @@ -156,24 +165,4 @@ export default function visitComponent ( generator, fragment, node ) { fragment.builders.create.addBlock( local.create ); if ( !local.update.isEmpty() ) fragment.builders.update.addBlock( local.update ); - - const childFragment = fragment.child({ - type: 'component', - namespace: local.namespace, - target: name, - parent: fragment, - localElementDepth: fragment.localElementDepth + 1, - key: null - }); - generator.push( childFragment ); - - generator.elementDepth += 1; - - node.children.forEach( child => { - visit( generator, childFragment, child ); - }); - - generator.elementDepth -= 1; - - generator.pop(); } \ No newline at end of file diff --git a/src/generators/dom/visitors/EachBlock.js b/src/generators/dom/visitors/EachBlock.js index 369b597048..00f6a0ae7e 100644 --- a/src/generators/dom/visitors/EachBlock.js +++ b/src/generators/dom/visitors/EachBlock.js @@ -167,10 +167,6 @@ export default function visitEachBlock ( generator, fragment, node ) { ` ); } - if ( node.else ) { - generator.generateBlock( node.else, renderElse, 'block' ); - } - const indexNames = new Map( fragment.indexNames ); const indexName = node.index || fragment.getUniqueName( `${node.context}_index` ); indexNames.set( node.context, indexName ); @@ -223,4 +219,19 @@ export default function visitEachBlock ( generator, fragment, node ) { generator.addRenderer( childFragment ); generator.pop(); + + if ( node.else ) { + const childFragment = this.current.child({ + type: 'block', + name: renderElse, + target: 'target', + localElementDepth: 0, + builders: getBuilders(), + getUniqueName: this.getUniqueNameMaker( this.current.params ) + }); + + node.else.children.forEach( child => { + visit( generator, childFragment, child ); + }); + } } \ No newline at end of file diff --git a/src/generators/dom/visitors/IfBlock.js b/src/generators/dom/visitors/IfBlock.js index dd4dbaa719..4d1adcb4f7 100644 --- a/src/generators/dom/visitors/IfBlock.js +++ b/src/generators/dom/visitors/IfBlock.js @@ -1,6 +1,8 @@ import deindent from '../../../utils/deindent.js'; +import getBuilders from '../utils/getBuilders.js'; +import visit from '../visit.js'; -function getConditionsAndBlocks ( generator, node, _name, i = 0 ) { +function getConditionsAndBlocks ( generator, fragment, node, _name, i = 0 ) { generator.addSourcemapLocations( node.expression ); const name = generator.getUniqueName( `${_name}_${i}` ); @@ -9,12 +11,12 @@ function getConditionsAndBlocks ( generator, node, _name, i = 0 ) { block: name }]; - generator.generateBlock( node, name, 'block' ); + generateBlock( generator, fragment, node, name, 'block' ); if ( node.else && node.else.children.length === 1 && node.else.children[0].type === 'IfBlock' ) { conditionsAndBlocks.push( - ...getConditionsAndBlocks( generator, node.else.children[0], _name, i + 1 ) + ...getConditionsAndBlocks( generator, fragment, node.else.children[0], _name, i + 1 ) ); } else { const name = generator.getUniqueName( `${_name}_${i + 1}` ); @@ -24,12 +26,30 @@ function getConditionsAndBlocks ( generator, node, _name, i = 0 ) { }); if ( node.else ) { - generator.generateBlock( node.else, name, 'block' ); + generateBlock( generator, fragment, node.else, name, 'block' ); } } return conditionsAndBlocks; } +function generateBlock ( generator, fragment, node, name, type ) { + const childFragment = fragment.child({ + type, + isIfBlock: true, + name, + target: 'target', + builders: getBuilders(), + localElementDepth: 0 + }); + + // walk the children here + node.children.forEach( node => { + visit( generator, childFragment, node ); + }); + + generator.addRenderer( childFragment ); +} + export default function visitIfBlock ( generator, fragment, node ) { const params = fragment.params.join( ', ' ); const name = generator.getUniqueName( `if_block` ); @@ -38,7 +58,7 @@ export default function visitIfBlock ( generator, fragment, node ) { const _currentBlock = fragment.getUniqueName( `_current_block` ); const isToplevel = fragment.localElementDepth === 0; - const conditionsAndBlocks = getConditionsAndBlocks( generator, node, generator.getUniqueName( `render_if_block` ) ); + const conditionsAndBlocks = getConditionsAndBlocks( generator, fragment, node, generator.getUniqueName( `render_if_block` ) ); const anchor = `${name}_anchor`; fragment.createAnchor( anchor ); diff --git a/src/generators/dom/visitors/attributes/addComponentBinding.js b/src/generators/dom/visitors/attributes/addComponentBinding.js index 66be449133..0025c6f7ee 100644 --- a/src/generators/dom/visitors/attributes/addComponentBinding.js +++ b/src/generators/dom/visitors/attributes/addComponentBinding.js @@ -2,7 +2,7 @@ import deindent from '../../../../utils/deindent.js'; import flattenReference from '../../../../utils/flattenReference.js'; import getSetter from './binding/getSetter.js'; -export default function createBinding ( generator, node, attribute, fragment, local ) { +export default function addComponentBinding ( generator, node, attribute, fragment, local ) { const { name, keypath } = flattenReference( attribute.value ); const { snippet, contexts, dependencies } = generator.contextualise( attribute.value ); diff --git a/src/generators/dom/visitors/attributes/addElementBinding.js b/src/generators/dom/visitors/attributes/addElementBinding.js index 1b2bc35ba5..091e3957b9 100644 --- a/src/generators/dom/visitors/attributes/addElementBinding.js +++ b/src/generators/dom/visitors/attributes/addElementBinding.js @@ -3,7 +3,7 @@ import flattenReference from '../../../../utils/flattenReference.js'; import getSetter from './binding/getSetter.js'; import getStaticAttributeValue from './binding/getStaticAttributeValue.js'; -export default function createBinding ( generator, node, attribute, fragment, local ) { +export default function addElementBinding ( generator, node, attribute, fragment, local ) { const { name, keypath } = flattenReference( attribute.value ); const { snippet, contexts, dependencies } = generator.contextualise( attribute.value ); @@ -18,7 +18,7 @@ export default function createBinding ( generator, node, attribute, fragment, lo const isMultipleSelect = node.name === 'select' && node.attributes.find( attr => attr.name.toLowerCase() === 'multiple' ); // TODO use getStaticAttributeValue const type = getStaticAttributeValue( node, 'type' ); const bindingGroup = attribute.name === 'group' ? getBindingGroup( generator, fragment, attribute, keypath ) : null; - const value = getBindingValue( generator, local, node, attribute, isMultipleSelect, bindingGroup, type ); + const value = getBindingValue( generator, fragment, local, node, attribute, isMultipleSelect, bindingGroup, type ); const eventName = getBindingEventName( node ); let setter = getSetter({ fragment, name, keypath, context: '__svelte', attribute, dependencies, value }); @@ -82,7 +82,7 @@ export default function createBinding ( generator, node, attribute, fragment, lo updateElement = `${local.name}.${attribute.name} = ${snippet};`; } - const updating = generator.fragment.getUniqueName( `${local.name}_updating` ); + const updating = fragment.getUniqueName( `${local.name}_updating` ); local.create.addBlock( deindent` var ${updating} = false; @@ -124,7 +124,7 @@ function getBindingEventName ( node ) { return 'change'; } -function getBindingValue ( generator, local, node, attribute, isMultipleSelect, bindingGroup, type ) { +function getBindingValue ( generator, fragment, local, node, attribute, isMultipleSelect, bindingGroup, type ) { //