diff --git a/src/generators/dom/index.js b/src/generators/dom/index.js index 366962da62..d32f9e9adb 100644 --- a/src/generators/dom/index.js +++ b/src/generators/dom/index.js @@ -119,8 +119,9 @@ class DomGenerator extends Generator { } } - generateBlock ( node, name ) { + generateBlock ( node, name, type ) { this.push({ + type, name, target: 'target', localElementDepth: 0, @@ -203,6 +204,7 @@ export default function dom ( parsed, source, options ) { const component = getUniqueName( 'component' ); generator.push({ + type: 'block', name: generator.alias( 'render_main_fragment' ), namespace, target: 'target', diff --git a/src/generators/dom/utils/findBlock.js b/src/generators/dom/utils/findBlock.js new file mode 100644 index 0000000000..59f71e3552 --- /dev/null +++ b/src/generators/dom/utils/findBlock.js @@ -0,0 +1,4 @@ +export default function findBlock ( fragment ) { + while ( fragment.type !== 'block' ) fragment = fragment.parent; + return fragment; +} \ No newline at end of file diff --git a/src/generators/dom/visitors/Component.js b/src/generators/dom/visitors/Component.js index e79eac3044..29d23b30f8 100644 --- a/src/generators/dom/visitors/Component.js +++ b/src/generators/dom/visitors/Component.js @@ -67,7 +67,7 @@ export default { const yieldName = generator.getUniqueName( `render_${name}_yield_fragment` ); const params = current.params.join( ', ' ); - generator.generateBlock( node, yieldName ); + generator.generateBlock( node, yieldName, 'yield' ); const yieldFragment = current.getUniqueName( `${name}_yield_fragment` ); @@ -151,6 +151,7 @@ export default { if ( !local.update.isEmpty() ) current.builders.update.addBlock( local.update ); generator.push({ + type: 'component', namespace: local.namespace, target: name, parent: current, diff --git a/src/generators/dom/visitors/EachBlock.js b/src/generators/dom/visitors/EachBlock.js index 26873d4ad5..df9936197f 100644 --- a/src/generators/dom/visitors/EachBlock.js +++ b/src/generators/dom/visitors/EachBlock.js @@ -168,7 +168,7 @@ export default { } if ( node.else ) { - generator.generateBlock( node.else, renderElse ); + generator.generateBlock( node.else, renderElse, 'block' ); } const indexNames = new Map( generator.current.indexNames ); @@ -193,6 +193,7 @@ export default { const getUniqueName = generator.getUniqueNameMaker( blockParams ); generator.push({ + type: 'block', name: renderer, target: 'target', expression: node.expression, diff --git a/src/generators/dom/visitors/Element.js b/src/generators/dom/visitors/Element.js index 478bc39e2e..566a535bab 100644 --- a/src/generators/dom/visitors/Element.js +++ b/src/generators/dom/visitors/Element.js @@ -101,6 +101,7 @@ export default { generator.createMountStatement( name ); generator.push({ + type: 'element', namespace: local.namespace, target: name, parent: generator.current, diff --git a/src/generators/dom/visitors/IfBlock.js b/src/generators/dom/visitors/IfBlock.js index bb0bc82c4d..0de7e936b2 100644 --- a/src/generators/dom/visitors/IfBlock.js +++ b/src/generators/dom/visitors/IfBlock.js @@ -9,7 +9,7 @@ function getConditionsAndBlocks ( generator, node, _name, i = 0 ) { block: name }]; - generator.generateBlock( node, name ); + generator.generateBlock( node, name, 'block' ); if ( node.else && node.else.children.length === 1 && node.else.children[0].type === 'IfBlock' ) { @@ -24,7 +24,7 @@ function getConditionsAndBlocks ( generator, node, _name, i = 0 ) { }); if ( node.else ) { - generator.generateBlock( node.else, name ); + generator.generateBlock( node.else, name, 'block' ); } } return conditionsAndBlocks; diff --git a/src/generators/dom/visitors/MustacheTag.js b/src/generators/dom/visitors/MustacheTag.js index 50360e1db4..6e0ba72e63 100644 --- a/src/generators/dom/visitors/MustacheTag.js +++ b/src/generators/dom/visitors/MustacheTag.js @@ -1,4 +1,5 @@ import deindent from '../../../utils/deindent.js'; +import findBlock from '../utils/findBlock.js'; export default { enter ( generator, node ) { @@ -9,12 +10,12 @@ export default { generator.current.builders.init.addLine( `var last_${name} = ${snippet};` ); generator.addElement( name, `${generator.helper( 'createText' )}( last_${name} )`, true ); - if ( !generator.current.tmp ) { - generator.current.tmp = generator.current.getUniqueName( 'tmp' ); - } + const fragment = findBlock( generator.current ); + if ( !fragment.tmp ) fragment.tmp = fragment.getUniqueName( 'tmp' ); + generator.current.builders.update.addBlock( deindent` - if ( ( ${generator.current.tmp} = ${snippet} ) !== last_${name} ) { - ${name}.data = last_${name} = ${generator.current.tmp}; + if ( ( ${fragment.tmp} = ${snippet} ) !== last_${name} ) { + ${name}.data = last_${name} = ${fragment.tmp}; } ` ); } diff --git a/src/generators/dom/visitors/RawMustacheTag.js b/src/generators/dom/visitors/RawMustacheTag.js index 7ad822a17a..2a5cf46381 100644 --- a/src/generators/dom/visitors/RawMustacheTag.js +++ b/src/generators/dom/visitors/RawMustacheTag.js @@ -1,4 +1,5 @@ import deindent from '../../../utils/deindent.js'; +import findBlock from '../utils/findBlock.js'; export default { enter ( generator, node ) { @@ -26,12 +27,12 @@ export default { generator.current.builders.init.addLine( mountStatement ); } - if ( !generator.current.tmp ) { - generator.current.tmp = generator.current.getUniqueName( 'tmp' ); - } + const fragment = findBlock( generator.current ); + if ( !fragment.tmp ) fragment.tmp = fragment.getUniqueName( 'tmp' ); + generator.current.builders.update.addBlock( deindent` - if ( ( ${generator.current.tmp} = ${snippet} ) !== last_${name} ) { - last_${name} = ${generator.current.tmp}; + if ( ( ${fragment.tmp} = ${snippet} ) !== last_${name} ) { + last_${name} = ${fragment.tmp}; ${detachStatement} ${mountStatement} } diff --git a/src/generators/dom/visitors/attributes/addElementAttributes.js b/src/generators/dom/visitors/attributes/addElementAttributes.js index b9dde2b172..5d3967b774 100644 --- a/src/generators/dom/visitors/attributes/addElementAttributes.js +++ b/src/generators/dom/visitors/attributes/addElementAttributes.js @@ -3,6 +3,7 @@ import addElementBinding from './addElementBinding'; import deindent from '../../../../utils/deindent.js'; import flattenReference from '../../../../utils/flattenReference.js'; import getStaticAttributeValue from './binding/getStaticAttributeValue.js'; +import findBlock from '../../utils/findBlock.js'; export default function addElementAttributes ( generator, node, local ) { node.attributes.forEach( attribute => { @@ -105,12 +106,12 @@ export default function addElementAttributes ( generator, node, local ) { } local.init.addLine( updater ); - if ( !generator.current.tmp ) { - generator.current.tmp = generator.current.getUniqueName( 'tmp' ); - } + const fragment = findBlock( generator.current ); + if ( !fragment.tmp ) fragment.tmp = fragment.getUniqueName( 'tmp' ); + local.update.addBlock( deindent` - if ( ( ${generator.current.tmp} = ${snippet} ) !== ${last} ) { - ${last} = ${generator.current.tmp}; + if ( ( ${fragment.tmp} = ${snippet} ) !== ${last} ) { + ${last} = ${fragment.tmp}; ${updater} } ` );