[fix] add logic to select and claim raw html tags in head (sveltejs#6463

)

src/compiler/compile/render_dom/wrappers/Head.ts

@@ -36,7 +36,11 @@ export default class HeadWrapper extends Wrapper {
 		let nodes;
 		if (this.renderer.options.hydratable && this.fragment.nodes.length) {
 			nodes = block.get_unique_name('head_nodes');
-			block.chunks.claim.push(b`const ${nodes} = @query_selector_all('[data-svelte="${this.node.id}"]', @_document.head);`);
+			block.chunks.claim.push(b`
+				const ${nodes} = [
+					...@query_selector_all('[data-svelte="${this.node.id}"]', @_document.head),
+					...@get_hydratable_elements(@_document.head)
+				];`);
 		}
 
 		this.fragment.render(block, x`@_document.head` as unknown as Identifier, nodes);

src/runtime/internal/dom.ts

@@ -640,6 +640,27 @@ export function query_selector_all(selector: string, parent: HTMLElement = docum
 	return Array.from(parent.querySelectorAll(selector)) as ChildNodeArray;
 }
 
+export function get_hydratable_elements(parent: HTMLElement = document.body) {
+	const elements = Array.from(parent.childNodes);
+	let cursor = 0;
+	while (cursor < elements.length) {
+		const start_index = find_comment(elements, 'HTML_TAG_START', cursor);
+		const end_index = find_comment(elements, 'HTML_TAG_END', start_index);
+		if (start_index === end_index) {
+			elements.splice(cursor, elements.length - cursor);
+			break;
+		}
+
+		detach(elements[start_index]);
+		detach(elements[end_index]);
+
+		elements.splice(cursor, 1 + start_index - cursor);
+		cursor += end_index - start_index - 1;
+	}
+	console.log(elements);
+	return elements;
+}
+
 export class HtmlTag {
 	// parent for creating node
 	e: HTMLElement;