handle case of last tag being left open better

sveltejs · Dec 16, 2024 · d5a57cb · d5a57cb
1 parent bee3bce
commit d5a57cb
Show file tree

Hide file tree

Showing 6 changed files with 13 additions and 10 deletions.
diff --git a/packages/svelte2tsx/src/htmlxtojsx_v2/nodes/AwaitPendingCatchBlock.ts b/packages/svelte2tsx/src/htmlxtojsx_v2/nodes/AwaitPendingCatchBlock.ts
@@ -78,5 +78,5 @@ export function handleAwait(str: MagicString, awaitBlock: BaseNode): void {
         transforms.push('}');
     }
     transforms.push('}');
-    transform(str, awaitBlock.start, awaitBlock.end, awaitBlock.end, transforms);
+    transform(str, awaitBlock.start, awaitBlock.end, transforms);
 }
diff --git a/packages/svelte2tsx/src/htmlxtojsx_v2/nodes/EachBlock.ts b/packages/svelte2tsx/src/htmlxtojsx_v2/nodes/EachBlock.ts
@@ -70,7 +70,7 @@ export function handleEach(str: MagicString, eachBlock: BaseNode): void {
     if (eachBlock.key) {
         transforms.push([eachBlock.key.start, eachBlock.key.end], ';');
     }
-    transform(str, eachBlock.start, startEnd, startEnd, transforms);
+    transform(str, eachBlock.start, startEnd, transforms);
 
     const endEach = str.original.lastIndexOf('{', eachBlock.end - 1);
     // {/each} -> } or {:else} -> }

diff --git a/packages/svelte2tsx/src/htmlxtojsx_v2/nodes/Element.ts b/packages/svelte2tsx/src/htmlxtojsx_v2/nodes/Element.ts
@@ -205,7 +205,7 @@ export class Element {
         }
 
         if (this.isSelfclosing) {
-            transform(this.str, this.startTagStart, this.startTagEnd, this.startTagEnd, [
+            transform(this.str, this.startTagStart, this.startTagEnd, [
                 // Named slot transformations go first inside a outer block scope because
                 // <div let:xx {x} /> means "use the x of let:x", and without a separate
                 // block scope this would give a "used before defined" error
@@ -217,7 +217,7 @@ export class Element {
                 ...this.endTransformation
             ]);
         } else {
-            transform(this.str, this.startTagStart, this.startTagEnd, this.startTagEnd, [
+            transform(this.str, this.startTagStart, this.startTagEnd, [
                 ...slotLetTransformation,
                 ...this.actionsTransformation,
                 ...this.getStartTransformation(),
@@ -230,7 +230,7 @@ export class Element {
                 .lastIndexOf(`</${this.node.name}`);
             // tagEndIdx === -1 happens in situations of unclosed tags like `<p>fooo <p>anothertag</p>`
             const endStart = tagEndIdx === -1 ? this.node.end : tagEndIdx + this.node.start;
-            transform(this.str, endStart, this.node.end, this.node.end, this.endTransformation);
+            transform(this.str, endStart, this.node.end, this.endTransformation);
         }
     }
 

diff --git a/packages/svelte2tsx/src/htmlxtojsx_v2/nodes/InlineComponent.ts b/packages/svelte2tsx/src/htmlxtojsx_v2/nodes/InlineComponent.ts
@@ -207,7 +207,7 @@ export class InlineComponent {
 
         if (this.isSelfclosing) {
             this.endTransformation.push('}');
-            transform(this.str, this.startTagStart, this.startTagEnd, this.startTagEnd, [
+            transform(this.str, this.startTagStart, this.startTagEnd, [
                 // Named slot transformations go first inside a outer block scope because
                 // <Comp let:xx {x} /> means "use the x of let:x", and without a separate
                 // block scope this would give a "used before defined" error
@@ -238,7 +238,7 @@ export class InlineComponent {
             }
             this.endTransformation.push('}');
 
-            transform(this.str, this.startTagStart, this.startTagEnd, this.startTagEnd, [
+            transform(this.str, this.startTagStart, this.startTagEnd, [
                 // See comment above why this goes first
                 ...namedSlotLetTransformation,
                 ...this.startTransformation,
@@ -248,7 +248,7 @@ export class InlineComponent {
                 snippetPropVariablesDeclaration,
                 ...defaultSlotLetTransformation
             ]);
-            transform(this.str, endStart, this.node.end, this.node.end, this.endTransformation);
+            transform(this.str, endStart, this.node.end, this.endTransformation);
         }
     }
 

diff --git a/packages/svelte2tsx/src/htmlxtojsx_v2/nodes/SnippetBlock.ts b/packages/svelte2tsx/src/htmlxtojsx_v2/nodes/SnippetBlock.ts
@@ -129,7 +129,7 @@ export function handleSnippet(
             afterParameters
         );
 
-        transform(str, snippetBlock.start, startEnd, startEnd, transforms);
+        transform(str, snippetBlock.start, startEnd, transforms);
     }
 }
 

diff --git a/packages/svelte2tsx/src/htmlxtojsx_v2/utils/node-utils.ts b/packages/svelte2tsx/src/htmlxtojsx_v2/utils/node-utils.ts
@@ -27,7 +27,6 @@ export function transform(
     str: MagicString,
     start: number,
     end: number,
-    _xxx: number, // TODO
     transformations: TransformationArray
 ) {
     const moves: Array<[number, number]> = [];
@@ -128,6 +127,10 @@ export function transform(
     }
 
     for (let i = deletePos; i < moves.length; i++) {
+        // Can happen when there's not enough space left at the end of an unfininished element/component tag.
+        // Better to leave potentially slightly disarranged code than fail loudly
+        if (moves[i][1] >= end && moves[i][0] <= end) break;
+
         str.move(moves[i][0], moves[i][1], end);
     }
 }
-Original file line number
+Diff line change
@@ Expand Up / @@ -129,7 +129,7 @@ export function handleSnippet( @@
                 afterParameters
             );
-            transform(str, snippetBlock.start, startEnd, startEnd, transforms);
+            transform(str, snippetBlock.start, startEnd, transforms);
         }
     }
@@ Expand Down @@