diff --git a/src/compile/render-dom/Block.ts b/src/compile/render-dom/Block.ts index d036fc16da..db8d846232 100644 --- a/src/compile/render-dom/Block.ts +++ b/src/compile/render-dom/Block.ts @@ -162,7 +162,10 @@ export default class Block { ) { this.addVariable(name); this.builders.create.addLine(`${name} = ${renderStatement};`); - this.builders.claim.addLine(`${name} = ${claimStatement || renderStatement};`); + + if (this.renderer.options.hydratable) { + this.builders.claim.addLine(`${name} = ${claimStatement || renderStatement};`); + } if (parentNode) { this.builders.mount.addLine(`@append(${parentNode}, ${name});`); @@ -259,14 +262,14 @@ export default class Block { `); } - if (this.renderer.options.hydratable) { + if (this.renderer.options.hydratable || !this.builders.claim.isEmpty()) { if (this.builders.claim.isEmpty() && this.builders.hydrate.isEmpty()) { properties.addBlock(`l: @noop,`); } else { properties.addBlock(deindent` ${dev ? 'l: function claim' : 'l'}(nodes) { ${this.builders.claim} - ${!this.builders.hydrate.isEmpty() && `this.h();`} + ${this.renderer.options.hydratable && !this.builders.hydrate.isEmpty() && `this.h();`} }, `); } diff --git a/src/compile/render-dom/wrappers/AwaitBlock.ts b/src/compile/render-dom/wrappers/AwaitBlock.ts index bfd3143333..fe092f5b1d 100644 --- a/src/compile/render-dom/wrappers/AwaitBlock.ts +++ b/src/compile/render-dom/wrappers/AwaitBlock.ts @@ -160,7 +160,7 @@ export default class AwaitBlockWrapper extends Wrapper { ${info}.block.c(); `); - if (parentNodes) { + if (parentNodes && this.renderer.options.hydratable) { block.builders.claim.addBlock(deindent` ${info}.block.l(${parentNodes}); `); diff --git a/src/compile/render-dom/wrappers/EachBlock.ts b/src/compile/render-dom/wrappers/EachBlock.ts index 910b83069c..ec46bf4423 100644 --- a/src/compile/render-dom/wrappers/EachBlock.ts +++ b/src/compile/render-dom/wrappers/EachBlock.ts @@ -316,7 +316,7 @@ export default class EachBlockWrapper extends Wrapper { for (#i = 0; #i < ${blocks}.length; #i += 1) ${blocks}[#i].c(); `); - if (parentNodes) { + if (parentNodes && this.renderer.options.hydratable) { block.builders.claim.addBlock(deindent` for (#i = 0; #i < ${blocks}.length; #i += 1) ${blocks}[#i].l(${parentNodes}); `); @@ -389,7 +389,7 @@ export default class EachBlockWrapper extends Wrapper { } `); - if (parentNodes) { + if (parentNodes && this.renderer.options.hydratable) { block.builders.claim.addBlock(deindent` for (var #i = 0; #i < ${iterations}.length; #i += 1) { ${iterations}[#i].l(${parentNodes}); diff --git a/src/compile/render-dom/wrappers/Element/index.ts b/src/compile/render-dom/wrappers/Element/index.ts index 2f9d0c5adf..782f82f429 100644 --- a/src/compile/render-dom/wrappers/Element/index.ts +++ b/src/compile/render-dom/wrappers/Element/index.ts @@ -335,7 +335,7 @@ export default class ElementWrapper extends Wrapper { block.builders.mount.addBlock(this.initialUpdate); } - if (nodes) { + if (nodes && this.renderer.options.hydratable) { block.builders.claim.addLine( `${nodes}.forEach(@detachNode);` ); diff --git a/src/compile/render-dom/wrappers/IfBlock.ts b/src/compile/render-dom/wrappers/IfBlock.ts index 3505ec9ce0..e9ebf58896 100644 --- a/src/compile/render-dom/wrappers/IfBlock.ts +++ b/src/compile/render-dom/wrappers/IfBlock.ts @@ -185,7 +185,7 @@ export default class IfBlockWrapper extends Wrapper { block.builders.create.addLine(`${if_name}${name}.c();`); - if (parentNodes) { + if (parentNodes && this.renderer.options.hydratable) { block.builders.claim.addLine( `${if_name}${name}.l(${parentNodes});` ); diff --git a/src/compile/render-dom/wrappers/InlineComponent/index.ts b/src/compile/render-dom/wrappers/InlineComponent/index.ts index 2769ab9573..4586761a71 100644 --- a/src/compile/render-dom/wrappers/InlineComponent/index.ts +++ b/src/compile/render-dom/wrappers/InlineComponent/index.ts @@ -293,7 +293,7 @@ export default class InlineComponentWrapper extends Wrapper { `if (${name}) ${name}.$$fragment.c();` ); - if (parentNodes) { + if (parentNodes && this.renderer.options.hydratable) { block.builders.claim.addLine( `if (${name}) ${name}.$$fragment.l(${parentNodes});` ); @@ -385,7 +385,7 @@ export default class InlineComponentWrapper extends Wrapper { block.builders.create.addLine(`${name}.$$fragment.c();`); - if (parentNodes) { + if (parentNodes && this.renderer.options.hydratable) { block.builders.claim.addLine( `${name}.$$fragment.l(${parentNodes});` ); diff --git a/src/internal/Component.js b/src/internal/Component.js index eec3cd15cd..120dc2b4ef 100644 --- a/src/internal/Component.js +++ b/src/internal/Component.js @@ -38,7 +38,7 @@ export class $$Component { if (options.target) { intro.enabled = !!options.intro; - this.$$mount(options.target); + this.$$mount(options.target, options.anchor, options.hydrate); flush(); intro.enabled = true; @@ -91,9 +91,14 @@ export class $$Component { this.$$dirty[key] = true; } - $$mount(target, anchor) { - this.$$fragment.c(); - this.$$fragment[this.$$fragment.i ? 'i' : 'm'](target, anchor); + $$mount(target, anchor, hydrate) { + if (hydrate) { + this.$$fragment.l(target.childNodes); + } else { + this.$$fragment.c(); + this.$$fragment[this.$$fragment.i ? 'i' : 'm'](target, anchor); + } + this.$$.inject_refs(this.$$refs); // onMount happens after the initial afterRender. Because