diff --git a/packages/svelte/src/internal/client/dom/blocks/css-props.js b/packages/svelte/src/internal/client/dom/blocks/css-props.js index ef361987539f..084a5561bebf 100644 --- a/packages/svelte/src/internal/client/dom/blocks/css-props.js +++ b/packages/svelte/src/internal/client/dom/blocks/css-props.js @@ -1,5 +1,4 @@ -/** @import { TemplateNode } from '#client' */ -import { render_effect, teardown } from '../../reactivity/effects.js'; +import { render_effect } from '../../reactivity/effects.js'; import { hydrating, set_hydrate_node } from '../hydration.js'; import { get_first_child } from '../operations.js'; @@ -10,7 +9,7 @@ import { get_first_child } from '../operations.js'; */ export function css_props(element, get_styles) { if (hydrating) { - set_hydrate_node(/** @type {TemplateNode} */ (get_first_child(element))); + set_hydrate_node(get_first_child(element)); } render_effect(() => { diff --git a/packages/svelte/src/internal/client/dom/blocks/each.js b/packages/svelte/src/internal/client/dom/blocks/each.js index 9a54ab2f5b64..191152b927f7 100644 --- a/packages/svelte/src/internal/client/dom/blocks/each.js +++ b/packages/svelte/src/internal/client/dom/blocks/each.js @@ -131,7 +131,7 @@ export function each(node, flags, get_collection, get_key, render_fn, fallback_f var parent_node = /** @type {Element} */ (node); anchor = hydrating - ? set_hydrate_node(/** @type {Comment | Text} */ (get_first_child(parent_node))) + ? set_hydrate_node(get_first_child(parent_node)) : parent_node.appendChild(create_text()); } diff --git a/packages/svelte/src/internal/client/dom/blocks/html.js b/packages/svelte/src/internal/client/dom/blocks/html.js index f7c11f42ca90..1d337c1f74dd 100644 --- a/packages/svelte/src/internal/client/dom/blocks/html.js +++ b/packages/svelte/src/internal/client/dom/blocks/html.js @@ -65,6 +65,8 @@ export function html(node, get_value, svg = false, mathml = false, skip_warning // We're deliberately not trying to repair mismatches between server and client, // as it's costly and error-prone (and it's an edge case to have a mismatch anyway) var hash = /** @type {Comment} */ (hydrate_node).data; + + /** @type {TemplateNode | null} */ var next = hydrate_next(); var last = next; @@ -73,7 +75,7 @@ export function html(node, get_value, svg = false, mathml = false, skip_warning (next.nodeType !== COMMENT_NODE || /** @type {Comment} */ (next).data !== '') ) { last = next; - next = /** @type {TemplateNode} */ (get_next_sibling(next)); + next = get_next_sibling(next); } if (next === null) { @@ -110,7 +112,7 @@ export function html(node, get_value, svg = false, mathml = false, skip_warning if (svg || mathml) { while (get_first_child(node)) { - anchor.before(/** @type {Node} */ (get_first_child(node))); + anchor.before(/** @type {TemplateNode} */ (get_first_child(node))); } } else { anchor.before(node); diff --git a/packages/svelte/src/internal/client/dom/blocks/svelte-element.js b/packages/svelte/src/internal/client/dom/blocks/svelte-element.js index 35d2aaa1d9ed..47dfe7707dbc 100644 --- a/packages/svelte/src/internal/client/dom/blocks/svelte-element.js +++ b/packages/svelte/src/internal/client/dom/blocks/svelte-element.js @@ -95,9 +95,9 @@ export function element(node, get_tag, is_svg, render_fn, get_namespace, locatio // If hydrating, use the existing ssr comment as the anchor so that the // inner open and close methods can pick up the existing nodes correctly - var child_anchor = /** @type {TemplateNode} */ ( - hydrating ? get_first_child(element) : element.appendChild(create_text()) - ); + var child_anchor = hydrating + ? get_first_child(element) + : element.appendChild(create_text()); if (hydrating) { if (child_anchor === null) { diff --git a/packages/svelte/src/internal/client/dom/blocks/svelte-head.js b/packages/svelte/src/internal/client/dom/blocks/svelte-head.js index 13926ccc4b83..7c7eed24f71a 100644 --- a/packages/svelte/src/internal/client/dom/blocks/svelte-head.js +++ b/packages/svelte/src/internal/client/dom/blocks/svelte-head.js @@ -21,7 +21,7 @@ export function head(hash, render_fn) { if (hydrating) { previous_hydrate_node = hydrate_node; - var head_anchor = /** @type {TemplateNode} */ (get_first_child(document.head)); + var head_anchor = get_first_child(document.head); // There might be multiple head blocks in our app, and they could have been // rendered in an arbitrary order — find one corresponding to this component @@ -29,7 +29,7 @@ export function head(hash, render_fn) { head_anchor !== null && (head_anchor.nodeType !== COMMENT_NODE || /** @type {Comment} */ (head_anchor).data !== hash) ) { - head_anchor = /** @type {TemplateNode} */ (get_next_sibling(head_anchor)); + head_anchor = get_next_sibling(head_anchor); } // If we can't find an opening hydration marker, skip hydration (this can happen diff --git a/packages/svelte/src/internal/client/dom/hydration.js b/packages/svelte/src/internal/client/dom/hydration.js index 5df9536d4d6a..7a9ef33d1bce 100644 --- a/packages/svelte/src/internal/client/dom/hydration.js +++ b/packages/svelte/src/internal/client/dom/hydration.js @@ -30,7 +30,7 @@ export function set_hydrating(value) { */ export let hydrate_node; -/** @param {TemplateNode} node */ +/** @param {TemplateNode | null} node */ export function set_hydrate_node(node) { if (node === null) { w.hydration_mismatch(); @@ -41,7 +41,7 @@ export function set_hydrate_node(node) { } export function hydrate_next() { - return set_hydrate_node(/** @type {TemplateNode} */ (get_next_sibling(hydrate_node))); + return set_hydrate_node(get_next_sibling(hydrate_node)); } /** @param {TemplateNode} node */ diff --git a/packages/svelte/src/internal/client/dom/operations.js b/packages/svelte/src/internal/client/dom/operations.js index c527ca23e372..479c2ba0a576 100644 --- a/packages/svelte/src/internal/client/dom/operations.js +++ b/packages/svelte/src/internal/client/dom/operations.js @@ -83,21 +83,19 @@ export function create_text(value = '') { /** * @template {Node} N * @param {N} node - * @returns {Node | null} */ /*@__NO_SIDE_EFFECTS__*/ export function get_first_child(node) { - return first_child_getter.call(node); + return /** @type {TemplateNode | null} */ (first_child_getter.call(node)); } /** * @template {Node} N * @param {N} node - * @returns {Node | null} */ /*@__NO_SIDE_EFFECTS__*/ export function get_next_sibling(node) { - return next_sibling_getter.call(node); + return /** @type {TemplateNode | null} */ (next_sibling_getter.call(node)); } /** @@ -105,14 +103,14 @@ export function get_next_sibling(node) { * @template {Node} N * @param {N} node * @param {boolean} is_text - * @returns {Node | null} + * @returns {TemplateNode | null} */ export function child(node, is_text) { if (!hydrating) { return get_first_child(node); } - var child = /** @type {TemplateNode} */ (get_first_child(hydrate_node)); + var child = get_first_child(hydrate_node); // Child can be null if we have an element with a single child, like `

{text}

`, where `text` is empty if (child === null) { @@ -130,14 +128,13 @@ export function child(node, is_text) { /** * Don't mark this as side-effect-free, hydration needs to walk all nodes - * @param {DocumentFragment | TemplateNode | TemplateNode[]} fragment + * @param {TemplateNode} node * @param {boolean} [is_text] - * @returns {Node | null} + * @returns {TemplateNode | null} */ -export function first_child(fragment, is_text = false) { +export function first_child(node, is_text = false) { if (!hydrating) { - // when not hydrating, `fragment` is a `DocumentFragment` (the result of calling `open_frag`) - var first = /** @type {DocumentFragment} */ (get_first_child(/** @type {Node} */ (fragment))); + var first = get_first_child(node); // TODO prevent user comments with the empty string when preserveComments is true if (first instanceof Comment && first.data === '') return get_next_sibling(first); @@ -163,7 +160,7 @@ export function first_child(fragment, is_text = false) { * @param {TemplateNode} node * @param {number} count * @param {boolean} is_text - * @returns {Node | null} + * @returns {TemplateNode | null} */ export function sibling(node, count = 1, is_text = false) { let next_sibling = hydrating ? hydrate_node : node; @@ -195,7 +192,7 @@ export function sibling(node, count = 1, is_text = false) { } set_hydrate_node(next_sibling); - return /** @type {TemplateNode} */ (next_sibling); + return next_sibling; } /** diff --git a/packages/svelte/src/internal/client/dom/template.js b/packages/svelte/src/internal/client/dom/template.js index 7382da7fb5bc..0d827218bc04 100644 --- a/packages/svelte/src/internal/client/dom/template.js +++ b/packages/svelte/src/internal/client/dom/template.js @@ -60,7 +60,7 @@ export function from_html(content, flags) { if (node === undefined) { node = create_fragment_from_html(has_start ? content : '' + content); - if (!is_fragment) node = /** @type {Node} */ (get_first_child(node)); + if (!is_fragment) node = /** @type {TemplateNode} */ (get_first_child(node)); } var clone = /** @type {TemplateNode} */ ( @@ -113,7 +113,7 @@ function from_namespace(content, flags, ns = 'svg') { if (is_fragment) { node = document.createDocumentFragment(); while (get_first_child(root)) { - node.appendChild(/** @type {Node} */ (get_first_child(root))); + node.appendChild(/** @type {TemplateNode} */ (get_first_child(root))); } } else { node = /** @type {Element} */ (get_first_child(root)); @@ -227,7 +227,7 @@ export function from_tree(structure, flags) { : undefined; node = fragment_from_tree(structure, ns); - if (!is_fragment) node = /** @type {Node} */ (get_first_child(node)); + if (!is_fragment) node = /** @type {TemplateNode} */ (get_first_child(node)); } var clone = /** @type {TemplateNode} */ ( diff --git a/packages/svelte/src/internal/client/reactivity/effects.js b/packages/svelte/src/internal/client/reactivity/effects.js index 4e8565ab8fef..be5ad773e0f8 100644 --- a/packages/svelte/src/internal/client/reactivity/effects.js +++ b/packages/svelte/src/internal/client/reactivity/effects.js @@ -548,7 +548,7 @@ export function destroy_effect(effect, remove_dom = true) { export function remove_effect_dom(node, end) { while (node !== null) { /** @type {TemplateNode | null} */ - var next = node === end ? null : /** @type {TemplateNode} */ (get_next_sibling(node)); + var next = node === end ? null : get_next_sibling(node); node.remove(); node = next; @@ -715,7 +715,7 @@ export function move_effect(effect, fragment) { while (node !== null) { /** @type {TemplateNode | null} */ - var next = node === end ? null : /** @type {TemplateNode} */ (get_next_sibling(node)); + var next = node === end ? null : get_next_sibling(node); fragment.append(node); node = next; diff --git a/packages/svelte/src/internal/client/render.js b/packages/svelte/src/internal/client/render.js index 92b83dbd5ac3..c76f0b1ce73c 100644 --- a/packages/svelte/src/internal/client/render.js +++ b/packages/svelte/src/internal/client/render.js @@ -99,12 +99,13 @@ export function hydrate(component, options) { const previous_hydrate_node = hydrate_node; try { - var anchor = /** @type {TemplateNode} */ (get_first_child(target)); + var anchor = get_first_child(target); + while ( anchor && (anchor.nodeType !== COMMENT_NODE || /** @type {Comment} */ (anchor).data !== HYDRATION_START) ) { - anchor = /** @type {TemplateNode} */ (get_next_sibling(anchor)); + anchor = get_next_sibling(anchor); } if (!anchor) {