fix: strip doctype using AST instead of regex (#2798)

jasonlyu123 · web-flow · commit 314ad4d76c3a · 2025-07-17T10:57:19.000+02:00
#2791
diff --git a/README.md b/README.md
@@ -25,14 +25,14 @@ A `.svelte` file would look something like this:
     let count = $state(1);
 
     let doubled = $derived(count * 2);
-    let quadrupled =  $derived(doubled * 2);
+    let quadrupled = $derived(doubled * 2);
 
     function handleClick() {
         count += 1;
     }
 </script>
 
-<button onclick={handleClick}>Count: {count}</button>
+<button onclick="{handleClick}">Count: {count}</button>
 
 <p>{count} * 2 = {doubled}</p>
 <p>{doubled} * 2 = {quadrupled}</p>
diff --git a/packages/svelte2tsx/src/htmlxtojsx_v2/index.ts b/packages/svelte2tsx/src/htmlxtojsx_v2/index.ts
@@ -64,14 +64,6 @@ export interface TemplateProcessResult {
     isRunes: boolean;
 }
 
-function stripDoctype(str: MagicString): void {
-    const regex = /<!doctype(.+?)>(\n)?/i;
-    const result = regex.exec(str.original);
-    if (result) {
-        str.remove(result.index, result.index + result[0].length);
-    }
-}
-
 /**
  * Walks the HTMLx part of the Svelte component
  * and converts it to JSX
@@ -92,8 +84,6 @@ export function convertHtmlxToJsx(
     options.typingsNamespace = options.typingsNamespace || 'svelteHTML';
     const preserveAttributeCase = options.namespace === 'foreign';
 
-    stripDoctype(str);
-
     const rootSnippets: Array<[number, number, Map<string, any>, string]> = [];
     let element: Element | InlineComponent | undefined;
 
@@ -325,7 +315,9 @@ export function convertHtmlxToJsx(
                             slotHandler.handleSlot(node, templateScope);
                         }
 
-                        if (node.name !== '!DOCTYPE') {
+                        if (node.name === '!DOCTYPE') {
+                            str.remove(node.start, node.end);
+                        } else {
                             if (element) {
                                 element.child = new Element(
                                     str,
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/doctype-script/expectedv2.ts b/packages/svelte2tsx/test/svelte2tsx/samples/doctype-script/expectedv2.ts
@@ -0,0 +1,10 @@
+///<reference types="svelte" />
+;function $$render() {
+
+    const regex = /<!DOCTYPE html>/i;
+;
+async () => {};
+return { props: /** @type {Record<string, never>} */ ({}), slots: {}, events: {} }}
+
+export default class Input__SvelteComponent_ extends __sveltets_2_createSvelte2TsxComponent(__sveltets_2_partial(__sveltets_2_with_any_event($$render()))) {
+}
diff --git a/packages/svelte2tsx/test/svelte2tsx/samples/doctype-script/input.svelte b/packages/svelte2tsx/test/svelte2tsx/samples/doctype-script/input.svelte
@@ -0,0 +1,3 @@
+<script>
+    const regex = /<!DOCTYPE html>/i;
+</script>

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+<script>`
	`2`	`+ const regex = /<!DOCTYPE html>/i;`
	`3`	`+</script>`