From e7efc3e568d839c5472f57ef25cf823e7c3da33d Mon Sep 17 00:00:00 2001 From: Tan Li Hau Date: Sat, 22 Feb 2020 13:10:37 +0800 Subject: [PATCH] fix rest of the failed tests --- .../render_dom/wrappers/Element/index.ts | 7 ++- .../render_dom/wrappers/RawMustacheTag.ts | 7 ++- .../compile/render_ssr/handlers/HtmlTag.ts | 2 + src/runtime/internal/dom.ts | 44 +++++++++++++++++-- .../each-block-changed-check/expected.js | 1 + .../samples/component-namespaced/_config.js | 4 -- .../component-namespaced/components.js | 3 -- .../component-namespaced/components.svelte | 5 +++ .../samples/component-namespaced/main.svelte | 2 +- .../samples/deconflict-builtins-2/_config.js | 2 +- .../samples/deconflict-builtins-2/main.svelte | 5 ++- test/runtime/samples/raw-mustaches/_config.js | 1 - 12 files changed, 65 insertions(+), 18 deletions(-) delete mode 100644 test/runtime/samples/component-namespaced/components.js create mode 100644 test/runtime/samples/component-namespaced/components.svelte diff --git a/src/compiler/compile/render_dom/wrappers/Element/index.ts b/src/compiler/compile/render_dom/wrappers/Element/index.ts index 4e69c7369a..d40c17b631 100644 --- a/src/compiler/compile/render_dom/wrappers/Element/index.ts +++ b/src/compiler/compile/render_dom/wrappers/Element/index.ts @@ -232,7 +232,12 @@ export default class ElementWrapper extends Wrapper { render(block: Block, parent_node: Identifier, parent_nodes: Identifier) { const { renderer } = this; - if (this.node.name === 'noscript') return; + if (this.node.name === 'noscript') { + if (renderer.options.hydratable) { + block.chunks.claim.push(b`@claim_noscript(${parent_nodes});`); + } + return; + } const node = this.var; const nodes = parent_nodes && block.get_unique_name(`${this.var.name}_nodes`); // if we're in unclaimable territory, i.e. , parent_nodes is null diff --git a/src/compiler/compile/render_dom/wrappers/RawMustacheTag.ts b/src/compiler/compile/render_dom/wrappers/RawMustacheTag.ts index fd43ffcc32..51e7213cd9 100644 --- a/src/compiler/compile/render_dom/wrappers/RawMustacheTag.ts +++ b/src/compiler/compile/render_dom/wrappers/RawMustacheTag.ts @@ -51,8 +51,11 @@ export default class RawMustacheTagWrapper extends Tag { const update_anchor = needs_anchor ? html_anchor : this.next ? this.next.var : 'null'; - block.chunks.hydrate.push(b`${html_tag} = new @HtmlTag(${update_anchor});`); - block.chunks.mount.push(b`${html_tag}.m(${init}, ${parent_node || '#target'}, ${parent_node ? null : '#anchor'});`); + block.chunks.create.push(b`${html_tag} = new @HtmlTag(${update_anchor});`); + if (this.renderer.options.hydratable) { + block.chunks.claim.push(b`${html_tag} = @claim_html_tag(${update_anchor}, ${_parent_nodes});`); + } + block.chunks.mount.push(b`${html_tag}.m(${init}, ${parent_node || '#target'}, ${parent_node ? null : 'anchor'});`); if (needs_anchor) { block.add_element(html_anchor, x`@empty()`, x`@empty()`, parent_node); diff --git a/src/compiler/compile/render_ssr/handlers/HtmlTag.ts b/src/compiler/compile/render_ssr/handlers/HtmlTag.ts index c0a7952e65..13744d0759 100644 --- a/src/compiler/compile/render_ssr/handlers/HtmlTag.ts +++ b/src/compiler/compile/render_ssr/handlers/HtmlTag.ts @@ -3,5 +3,7 @@ import RawMustacheTag from '../../nodes/RawMustacheTag'; import { Expression } from 'estree'; export default function(node: RawMustacheTag, renderer: Renderer, _options: RenderOptions) { + renderer.add_string(''); renderer.add_expression(node.expression.node as Expression); + renderer.add_string(''); } diff --git a/src/runtime/internal/dom.ts b/src/runtime/internal/dom.ts index 40471c2980..8151882c9e 100644 --- a/src/runtime/internal/dom.ts +++ b/src/runtime/internal/dom.ts @@ -191,6 +191,33 @@ export function claim_space(nodes) { return claim_text(nodes, ' '); } +export function claim_noscript(nodes) { + detach(claim_element(nodes, 'NOSCRIPT', {}, false)); +} + +function find_comment(nodes, text, start) { + for (let i = start; i < nodes.length; i += 1) { + const node = nodes[i]; + if (node.nodeType === 8 /* comment node */ && node.textContent.trim() === text) { + return i; + } + } + return nodes.length; +} + +export function claim_html_tag(update_anchor, nodes) { + // find html opening tag + const start_index = find_comment(nodes, 'HTML_TAG_START', 0); + const end_index = find_comment(nodes, 'HTML_TAG_END', start_index); + if (start_index === end_index) { + return new HtmlTag(update_anchor); + } + const html_tag_nodes = nodes.splice(start_index, end_index + 1); + detach(html_tag_nodes[0]); + detach(html_tag_nodes[html_tag_nodes.length - 1]); + return new HtmlTag(update_anchor, html_tag_nodes.slice(1, html_tag_nodes.length - 1)); +} + export function set_data(text, data) { data = '' + data; if (text.wholeText !== data) text.data = data; @@ -318,27 +345,38 @@ export function query_selector_all(selector: string, parent: HTMLElement = docum } export class HtmlTag { + // parent for creating node e: HTMLElement; + // html tag nodes n: ChildNode[]; + // hydration claimed nodes + l: ChildNode[] | void; + // target t: HTMLElement; + // anchor a: HTMLElement; - constructor(anchor: HTMLElement = null) { + constructor(anchor: HTMLElement = null, claimed_nodes?: ChildNode[]) { this.a = anchor; this.e = this.n = null; + this.l = claimed_nodes; } m(html: string, target: HTMLElement, anchor: HTMLElement = null) { if (!this.e) { this.e = element(target.nodeName as keyof HTMLElementTagNameMap); this.t = target; - this.h(html); + if (this.l) { + this.n = this.l; + } else { + this.h(html); + } } this.i(anchor); } - h(html) { + h(html: string) { this.e.innerHTML = html; this.n = Array.from(this.e.childNodes); } diff --git a/test/js/samples/each-block-changed-check/expected.js b/test/js/samples/each-block-changed-check/expected.js index 63bc1d8607..6ae6f81dcc 100644 --- a/test/js/samples/each-block-changed-check/expected.js +++ b/test/js/samples/each-block-changed-check/expected.js @@ -52,6 +52,7 @@ function create_each_block(ctx) { t4 = text(t4_value); t5 = text(" ago:"); t6 = space(); + html_tag = new HtmlTag(raw_value); attr(span, "class", "meta"); html_tag = new HtmlTag(null); attr(div, "class", "comment"); diff --git a/test/runtime/samples/component-namespaced/_config.js b/test/runtime/samples/component-namespaced/_config.js index 35a5e46d47..9ee6b5e788 100644 --- a/test/runtime/samples/component-namespaced/_config.js +++ b/test/runtime/samples/component-namespaced/_config.js @@ -9,10 +9,6 @@ export default {

foo 1

`, - before_test() { - delete require.cache[path.resolve(__dirname, 'components.js')]; - }, - test({ assert, component, target }) { component.a = 2; assert.htmlEqual(target.innerHTML, ` diff --git a/test/runtime/samples/component-namespaced/components.js b/test/runtime/samples/component-namespaced/components.js deleted file mode 100644 index 7dcfcf157c..0000000000 --- a/test/runtime/samples/component-namespaced/components.js +++ /dev/null @@ -1,3 +0,0 @@ -import Foo from './Foo.svelte'; - -export default { Foo }; diff --git a/test/runtime/samples/component-namespaced/components.svelte b/test/runtime/samples/component-namespaced/components.svelte new file mode 100644 index 0000000000..5b9a6c5167 --- /dev/null +++ b/test/runtime/samples/component-namespaced/components.svelte @@ -0,0 +1,5 @@ + \ No newline at end of file diff --git a/test/runtime/samples/component-namespaced/main.svelte b/test/runtime/samples/component-namespaced/main.svelte index 541b68e47e..25862cf6f2 100644 --- a/test/runtime/samples/component-namespaced/main.svelte +++ b/test/runtime/samples/component-namespaced/main.svelte @@ -1,5 +1,5 @@ diff --git a/test/runtime/samples/deconflict-builtins-2/_config.js b/test/runtime/samples/deconflict-builtins-2/_config.js index e136b0410d..fba811b880 100644 --- a/test/runtime/samples/deconflict-builtins-2/_config.js +++ b/test/runtime/samples/deconflict-builtins-2/_config.js @@ -1,4 +1,4 @@ export default { - html: 'hello world', + html: 'hello world', preserveIdentifiers: true }; diff --git a/test/runtime/samples/deconflict-builtins-2/main.svelte b/test/runtime/samples/deconflict-builtins-2/main.svelte index 82f9213045..db10a81c74 100644 --- a/test/runtime/samples/deconflict-builtins-2/main.svelte +++ b/test/runtime/samples/deconflict-builtins-2/main.svelte @@ -1,5 +1,6 @@ - -{foo} \ No newline at end of file + + {foo} + \ No newline at end of file diff --git a/test/runtime/samples/raw-mustaches/_config.js b/test/runtime/samples/raw-mustaches/_config.js index 9eda8289ce..a69b91d2d8 100644 --- a/test/runtime/samples/raw-mustaches/_config.js +++ b/test/runtime/samples/raw-mustaches/_config.js @@ -1,5 +1,4 @@ export default { - skip_if_ssr: true, props: { raw: 'raw html!!!\\o/'