diff --git a/src/generators/dom/visitors/Element/Attribute.js b/src/generators/dom/visitors/Element/Attribute.js index 9addde05ef..8dd976d406 100644 --- a/src/generators/dom/visitors/Element/Attribute.js +++ b/src/generators/dom/visitors/Element/Attribute.js @@ -43,7 +43,7 @@ export default function visitAttribute ( generator, block, state, node, attribut ); } - const last = `last_${state.parentNode}_${name.replace( /[^a-zA-Z_$]/g, '_')}`; + const last = block.getUniqueName( `${state.parentNode}_${name.replace( /[^a-zA-Z_$]/g, '_')}_value` ); block.builders.create.addLine( `var ${last} = ${value};` ); const isSelectValueAttribute = name === 'value' && state.parentNodeName === 'select'; diff --git a/src/generators/dom/visitors/MustacheTag.js b/src/generators/dom/visitors/MustacheTag.js index 33fe569e88..301345e6cc 100644 --- a/src/generators/dom/visitors/MustacheTag.js +++ b/src/generators/dom/visitors/MustacheTag.js @@ -2,15 +2,16 @@ import deindent from '../../../utils/deindent.js'; export default function visitMustacheTag ( generator, block, state, node ) { const name = block.getUniqueName( 'text' ); + const value = block.getUniqueName( `${name}_value` ); const { snippet } = block.contextualise( node.expression ); - block.builders.create.addLine( `var last_${name} = ${snippet};` ); - block.addElement( name, `${generator.helper( 'createText' )}( last_${name} )`, state.parentNode, true ); + block.builders.create.addLine( `var ${value} = ${snippet};` ); + block.addElement( name, `${generator.helper( 'createText' )}( ${value} )`, state.parentNode, true ); block.builders.update.addBlock( deindent` - if ( last_${name} !== ( last_${name} = ${snippet} ) ) { - ${name}.data = last_${name}; + if ( ${value} !== ( ${value} = ${snippet} ) ) { + ${name}.data = ${value}; } ` ); } \ No newline at end of file diff --git a/src/generators/dom/visitors/RawMustacheTag.js b/src/generators/dom/visitors/RawMustacheTag.js index e0dc76e9f8..2eed5bfdb6 100644 --- a/src/generators/dom/visitors/RawMustacheTag.js +++ b/src/generators/dom/visitors/RawMustacheTag.js @@ -2,21 +2,21 @@ import deindent from '../../../utils/deindent.js'; export default function visitRawMustacheTag ( generator, block, state, node ) { const name = block.getUniqueName( 'raw' ); + const value = block.getUniqueName( `${name}_value` ); + const before = block.getUniqueName( `${name}_before` ); + const after = block.getUniqueName( `${name}_after` ); const { snippet } = block.contextualise( node.expression ); // we would have used comments here, but the `insertAdjacentHTML` api only // exists for `Element`s. - const before = `${name}_before`; block.addElement( before, `${generator.helper( 'createElement' )}( 'noscript' )`, state.parentNode, true ); - - const after = `${name}_after`; block.addElement( after, `${generator.helper( 'createElement' )}( 'noscript' )`, state.parentNode, true ); const isToplevel = !state.parentNode; - block.builders.create.addLine( `var last_${name} = ${snippet};` ); - const mountStatement = `${before}.insertAdjacentHTML( 'afterend', last_${name} );`; + block.builders.create.addLine( `var ${value} = ${snippet};` ); + const mountStatement = `${before}.insertAdjacentHTML( 'afterend', ${value} );`; const detachStatement = `${generator.helper( 'detachBetween' )}( ${before}, ${after} );`; if ( isToplevel ) { @@ -26,7 +26,7 @@ export default function visitRawMustacheTag ( generator, block, state, node ) { } block.builders.update.addBlock( deindent` - if ( last_${name} !== ( last_${name} = ${snippet} ) ) { + if ( ${value} !== ( ${value} = ${snippet} ) ) { ${detachStatement} ${mountStatement} } diff --git a/test/js/samples/each-block-changed-check/expected.js b/test/js/samples/each-block-changed-check/expected.js index 0693c6f320..537390d431 100644 --- a/test/js/samples/each-block-changed-check/expected.js +++ b/test/js/samples/each-block-changed-check/expected.js @@ -53,12 +53,12 @@ function create_each_block ( root, each_block_value, comment, comment_index, com var span = createElement( 'span' ); appendNode( span, div ); span.className = "meta"; - var last_text = comment.author; - var text = createText( last_text ); + var text_value = comment.author; + var text = createText( text_value ); appendNode( text, span ); appendNode( createText( " wrote " ), span ); - var last_text_2 = root.elapsed(comment.time, root.time); - var text_2 = createText( last_text_2 ); + var text_2_value = root.elapsed(comment.time, root.time); + var text_2 = createText( text_2_value ); appendNode( text_2, span ); appendNode( createText( " ago:" ), span ); appendNode( createText( "\n\n\t\t" ), div ); @@ -66,8 +66,8 @@ function create_each_block ( root, each_block_value, comment, comment_index, com appendNode( raw_before, div ); var raw_after = createElement( 'noscript' ); appendNode( raw_after, div ); - var last_raw = comment.html; - raw_before.insertAdjacentHTML( 'afterend', last_raw ); + var raw_value = comment.html; + raw_before.insertAdjacentHTML( 'afterend', raw_value ); return { mount: function ( target, anchor ) { @@ -75,17 +75,17 @@ function create_each_block ( root, each_block_value, comment, comment_index, com }, update: function ( changed, root, each_block_value, comment, comment_index ) { - if ( last_text !== ( last_text = comment.author ) ) { - text.data = last_text; + if ( text_value !== ( text_value = comment.author ) ) { + text.data = text_value; } - if ( last_text_2 !== ( last_text_2 = root.elapsed(comment.time, root.time) ) ) { - text_2.data = last_text_2; + if ( text_2_value !== ( text_2_value = root.elapsed(comment.time, root.time) ) ) { + text_2.data = text_2_value; } - if ( last_raw !== ( last_raw = comment.html ) ) { + if ( raw_value !== ( raw_value = comment.html ) ) { detachBetween( raw_before, raw_after ); - raw_before.insertAdjacentHTML( 'afterend', last_raw ); + raw_before.insertAdjacentHTML( 'afterend', raw_value ); } },