From 3e62171164d16ef576ae6e6bc99fb60ef2600b6d Mon Sep 17 00:00:00 2001
From: Mishig <dmishig@gmail.com>
Date: Fri, 3 Jul 2026 22:53:20 +0200
Subject: [PATCH] fix(kit): repair <table><tr> nesting for Svelte 5
 compatibility
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Svelte 5 raises a hard compile error (node_invalid_placement) when <tr>
is a direct child of <table>, which is a common raw-HTML idiom in doc
markdown (e.g. hub-docs transformers-js.md) and broke downstream doc
builds after #792. Wrap direct-child rows in an explicit <tbody> after
mdsvex processing — the resulting DOM is identical to what browsers
auto-inserted for the old output.

Also silence the new element_invalid_self_closing_tag warning, which
md-generated content triggers pervasively (<video ... />, <div ... />).

Verified with a full local hub-docs build (268 pages, previously failing).

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---
 kit/preprocessors/mdsvex/index.js | 15 +++++++++++++++
 kit/svelte.config.js              |  4 +++-
 2 files changed, 18 insertions(+), 1 deletion(-)

diff --git a/kit/preprocessors/mdsvex/index.js b/kit/preprocessors/mdsvex/index.js
index 39dceafb..40bd6a23 100644
--- a/kit/preprocessors/mdsvex/index.js
+++ b/kit/preprocessors/mdsvex/index.js
@@ -34,6 +34,20 @@ function renderCode(code) {
 	);
 }
 
+/**
+ * Svelte 5 raises a compile error (`node_invalid_placement`) when `<tr>` is a
+ * direct child of `<table>`, because browsers auto-insert `<tbody>` during
+ * parsing, which would break hydration. Raw-HTML tables in doc markdown
+ * commonly omit `<tbody>` (e.g. `<table><tr>...`), so add it explicitly —
+ * the resulting DOM is identical to what browsers produced for the old output.
+ * @param {string} code
+ */
+function wrapTableRowsInTbody(code) {
+	return code
+		.replace(/(<table\b[^>]*>)(\s*)(<tr\b)/g, "$1$2<tbody>$3")
+		.replace(/(<\/tr>)(\s*)(<\/table>)/g, "$1</tbody>$2$3");
+}
+
 function addFullWidthClassToTables(code) {
 	return code.replace(/<table\b([^>]*)>/g, (match, attrs) => {
 		if (attrs.includes('class="')) {
@@ -68,6 +82,7 @@ export const mdsvexPreprocess = {
 			const processed = await _mdsvexPreprocess.markup({ content, filename });
 			processed.code = renderKatex(processed.code, markedKatex);
 			processed.code = renderCode(processed.code, filename);
+			processed.code = wrapTableRowsInTbody(processed.code);
 			if (stretchTables) {
 				processed.code = addFullWidthClassToTables(processed.code);
 			}
diff --git a/kit/svelte.config.js b/kit/svelte.config.js
index 910d2bae..5ae59234 100644
--- a/kit/svelte.config.js
+++ b/kit/svelte.config.js
@@ -53,7 +53,9 @@ const config = {
 		if (
 			warning.message.includes("unused export property") ||
 			warning.code?.startsWith("a11y") ||
-			warning.message.includes("A11y")
+			warning.message.includes("A11y") ||
+			// md-generated doc content is full of `<video ... />` style self-closing tags
+			warning.code === "element_invalid_self_closing_tag"
 		) {
 			/// Too noisy
 			return;