diff --git a/src/generators/dom/index.js b/src/generators/dom/index.js
index 2e2a17117a..1309c4ddb2 100644
--- a/src/generators/dom/index.js
+++ b/src/generators/dom/index.js
@@ -43,7 +43,7 @@ export default function dom ( parsed, source, options ) {
const { computations, hasJs, templateProperties, namespace } = generator.parseJs();
- const block = preprocess( generator, parsed.html.children );
+ const block = preprocess( generator, parsed.html );
const state = {
namespace,
diff --git a/src/generators/dom/preprocess.js b/src/generators/dom/preprocess.js
index 37481f478c..68b783aaaa 100644
--- a/src/generators/dom/preprocess.js
+++ b/src/generators/dom/preprocess.js
@@ -1,4 +1,5 @@
import Block from './Block.js';
+import { trimStart, trimEnd } from '../../utils/trim.js';
function isElseIf ( node ) {
return node && node.children.length === 1 && node.children[0].type === 'IfBlock';
@@ -23,7 +24,7 @@ const preprocessors = {
});
blocks.push( node._block );
- preprocessChildren( generator, node._block, node.children );
+ preprocessChildren( generator, node._block, node );
if ( node._block.dependencies.size > 0 ) {
dynamic = true;
@@ -38,7 +39,7 @@ const preprocessors = {
});
blocks.push( node.else._block );
- preprocessChildren( generator, node.else._block, node.else.children );
+ preprocessChildren( generator, node.else._block, node.else );
if ( node.else._block.dependencies.size > 0 ) {
dynamic = true;
@@ -97,7 +98,7 @@ const preprocessors = {
});
generator.blocks.push( node._block );
- preprocessChildren( generator, node._block, node.children );
+ preprocessChildren( generator, node._block, node );
block.addDependencies( node._block.dependencies );
node._block.hasUpdateMethod = node._block.dependencies.size > 0;
@@ -107,7 +108,7 @@ const preprocessors = {
});
generator.blocks.push( node.else._block );
- preprocessChildren( generator, node.else._block, node.else.children );
+ preprocessChildren( generator, node.else._block, node.else );
node.else._block.hasUpdateMethod = node.else._block.dependencies.size > 0;
}
},
@@ -140,13 +141,13 @@ const preprocessors = {
});
generator.blocks.push( node._block );
- preprocessChildren( generator, node._block, node.children );
+ preprocessChildren( generator, node._block, node );
block.addDependencies( node._block.dependencies );
node._block.hasUpdateMethod = node._block.dependencies.size > 0;
}
else {
- preprocessChildren( generator, block, node.children );
+ preprocessChildren( generator, block, node );
}
}
}
@@ -154,14 +155,33 @@ const preprocessors = {
preprocessors.RawMustacheTag = preprocessors.MustacheTag;
-function preprocessChildren ( generator, block, children ) {
- children.forEach( child => {
+function preprocessChildren ( generator, block, node ) {
+ // glue text nodes together
+ const cleaned = [];
+ let lastChild;
+
+ node.children.forEach( child => {
+ if ( child.type === 'Comment' ) return;
+
+ if ( child.type === 'Text' && lastChild && lastChild.type === 'Text' ) {
+ lastChild.data += child.data;
+ lastChild.end = child.end;
+ } else {
+ cleaned.push( child );
+ }
+
+ lastChild = child;
+ });
+
+ node.children = cleaned;
+
+ cleaned.forEach( child => {
const preprocess = preprocessors[ child.type ];
if ( preprocess ) preprocess( generator, block, child );
});
}
-export default function preprocess ( generator, children ) {
+export default function preprocess ( generator, node ) {
const block = new Block({
generator,
name: generator.alias( 'create_main_fragment' ),
@@ -179,8 +199,21 @@ export default function preprocess ( generator, children ) {
});
generator.blocks.push( block );
- preprocessChildren( generator, block, children );
+ preprocessChildren( generator, block, node );
block.hasUpdateMethod = block.dependencies.size > 0;
+ // trim leading and trailing whitespace from the top level
+ const firstChild = node.children[0];
+ if ( firstChild && firstChild.type === 'Text' ) {
+ firstChild.data = trimStart( firstChild.data );
+ if ( !firstChild.data ) node.children.shift();
+ }
+
+ const lastChild = node.children[ node.children.length - 1 ];
+ if ( lastChild && lastChild.type === 'Text' ) {
+ lastChild.data = trimEnd( lastChild.data );
+ if ( !lastChild.data ) node.children.pop();
+ }
+
return block;
}
\ No newline at end of file
diff --git a/src/generators/dom/visitors/Comment.js b/src/generators/dom/visitors/Comment.js
deleted file mode 100644
index 4d3477d7ef..0000000000
--- a/src/generators/dom/visitors/Comment.js
+++ /dev/null
@@ -1,3 +0,0 @@
-export default function visitComment () {
- // do nothing
-}
diff --git a/src/generators/dom/visitors/index.js b/src/generators/dom/visitors/index.js
index 7a3d2fecd4..4bdf5b4591 100644
--- a/src/generators/dom/visitors/index.js
+++ b/src/generators/dom/visitors/index.js
@@ -1,4 +1,3 @@
-import Comment from './Comment.js';
import EachBlock from './EachBlock.js';
import Element from './Element/Element.js';
import IfBlock from './IfBlock.js';
@@ -8,7 +7,6 @@ import Text from './Text.js';
import YieldTag from './YieldTag.js';
export default {
- Comment,
EachBlock,
Element,
IfBlock,
diff --git a/src/parse/index.js b/src/parse/index.js
index 29122d69bc..7ea7be222f 100644
--- a/src/parse/index.js
+++ b/src/parse/index.js
@@ -1,7 +1,7 @@
import { locate } from 'locate-character';
import fragment from './state/fragment.js';
-import { whitespace } from './patterns.js';
-import { trimStart, trimEnd } from './utils/trim.js';
+import { whitespace } from '../utils/patterns.js';
+import { trimStart, trimEnd } from '../utils/trim.js';
import getCodeFrame from '../utils/getCodeFrame.js';
import hash from './utils/hash.js';
diff --git a/src/parse/state/mustache.js b/src/parse/state/mustache.js
index bb25fcfc16..9a9dd33886 100644
--- a/src/parse/state/mustache.js
+++ b/src/parse/state/mustache.js
@@ -1,6 +1,6 @@
import readExpression from '../read/expression.js';
-import { whitespace } from '../patterns.js';
-import { trimStart, trimEnd } from '../utils/trim.js';
+import { whitespace } from '../../utils/patterns.js';
+import { trimStart, trimEnd } from '../../utils/trim.js';
const validIdentifier = /[a-zA-Z_$][a-zA-Z0-9_$]*/;
diff --git a/src/parse/state/tag.js b/src/parse/state/tag.js
index 5069c5c85c..48e8cd197e 100644
--- a/src/parse/state/tag.js
+++ b/src/parse/state/tag.js
@@ -2,7 +2,7 @@ import readExpression from '../read/expression.js';
import readScript from '../read/script.js';
import readStyle from '../read/style.js';
import { readEventHandlerDirective, readBindingDirective } from '../read/directives.js';
-import { trimStart, trimEnd } from '../utils/trim.js';
+import { trimStart, trimEnd } from '../../utils/trim.js';
import { decodeCharacterReferences } from '../utils/html.js';
import isVoidElementName from '../../utils/isVoidElementName.js';
diff --git a/src/parse/patterns.js b/src/utils/patterns.js
similarity index 100%
rename from src/parse/patterns.js
rename to src/utils/patterns.js
diff --git a/src/parse/utils/trim.js b/src/utils/trim.js
similarity index 85%
rename from src/parse/utils/trim.js
rename to src/utils/trim.js
index 012203cd22..c64d7b26a2 100644
--- a/src/parse/utils/trim.js
+++ b/src/utils/trim.js
@@ -1,4 +1,4 @@
-import { whitespace } from '../patterns.js';
+import { whitespace } from './patterns.js';
export function trimStart ( str ) {
let i = 0;
diff --git a/test/js/samples/collapses-text-around-comments/expected.js b/test/js/samples/collapses-text-around-comments/expected.js
new file mode 100644
index 0000000000..d126127689
--- /dev/null
+++ b/test/js/samples/collapses-text-around-comments/expected.js
@@ -0,0 +1,87 @@
+import { appendNode, assign, createElement, createText, detachNode, dispatchObservers, insertNode, proto, setAttribute } from "svelte/shared.js";
+
+var template = (function () {
+ return {
+ data: function () {
+ return { foo: 42 }
+ }
+ };
+}());
+
+var added_css = false;
+function add_css () {
+ var style = createElement( 'style' );
+ style.textContent = "\n\tp[svelte-3842350206], [svelte-3842350206] p {\n\t\tcolor: red;\n\t}\n";
+ appendNode( style, document.head );
+
+ added_css = true;
+}
+
+function create_main_fragment ( root, component ) {
+ var p = createElement( 'p' );
+ setAttribute( p, 'svelte-3842350206', '' );
+ var text_value = root.foo;
+ var text = createText( text_value );
+ appendNode( text, p );
+
+ return {
+ mount: function ( target, anchor ) {
+ insertNode( p, target, anchor );
+ },
+
+ update: function ( changed, root ) {
+ if ( text_value !== ( text_value = root.foo ) ) {
+ text.data = text_value;
+ }
+ },
+
+ destroy: function ( detach ) {
+ if ( detach ) {
+ detachNode( p );
+ }
+ }
+ };
+}
+
+function SvelteComponent ( options ) {
+ options = options || {};
+ this._state = assign( template.data(), options.data );
+
+ this._observers = {
+ pre: Object.create( null ),
+ post: Object.create( null )
+ };
+
+ this._handlers = Object.create( null );
+
+ this._root = options._root;
+ this._yield = options._yield;
+
+ this._torndown = false;
+ if ( !added_css ) add_css();
+
+ this._fragment = create_main_fragment( this._state, this );
+ if ( options.target ) this._fragment.mount( options.target, null );
+}
+
+assign( SvelteComponent.prototype, proto );
+
+SvelteComponent.prototype._set = function _set ( newState ) {
+ var oldState = this._state;
+ this._state = assign( {}, oldState, newState );
+ dispatchObservers( this, this._observers.pre, newState, oldState );
+ if ( this._fragment ) this._fragment.update( newState, this._state );
+ dispatchObservers( this, this._observers.post, newState, oldState );
+};
+
+SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = function destroy ( detach ) {
+ this.fire( 'destroy' );
+
+ this._fragment.destroy( detach !== false );
+ this._fragment = null;
+
+ this._state = {};
+ this._torndown = true;
+};
+
+export default SvelteComponent;
\ No newline at end of file
diff --git a/test/js/samples/collapses-text-around-comments/input.html b/test/js/samples/collapses-text-around-comments/input.html
new file mode 100644
index 0000000000..a6c1ae40f7
--- /dev/null
+++ b/test/js/samples/collapses-text-around-comments/input.html
@@ -0,0 +1,30 @@
+
+
+
+
+
+{{foo}}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file