fix57127: remove linkedediting from cases where JSX tags are not closed (#57132)

Author: iisaduan

src/services/services.ts

@@ -2562,20 +2562,25 @@ export function createLanguageService(
             const openTag = tag.parent.openingElement;
             const closeTag = tag.parent.closingElement;
 
-            const openTagStart = openTag.tagName.getStart(sourceFile);
-            const openTagEnd = openTag.tagName.end;
-            const closeTagStart = closeTag.tagName.getStart(sourceFile);
-            const closeTagEnd = closeTag.tagName.end;
+            const openTagNameStart = openTag.tagName.getStart(sourceFile);
+            const openTagNameEnd = openTag.tagName.end;
+            const closeTagNameStart = closeTag.tagName.getStart(sourceFile);
+            const closeTagNameEnd = closeTag.tagName.end;
+            // do not return linked cursors if tags are not well-formed
+            if (
+                openTagNameStart === openTag.getStart(sourceFile) || closeTagNameStart === closeTag.getStart(sourceFile)
+                || openTagNameEnd === openTag.getEnd() || closeTagNameEnd === closeTag.getEnd()
+            ) return undefined;
 
             // only return linked cursors if the cursor is within a tag name
-            if (!(openTagStart <= position && position <= openTagEnd || closeTagStart <= position && position <= closeTagEnd)) return undefined;
+            if (!(openTagNameStart <= position && position <= openTagNameEnd || closeTagNameStart <= position && position <= closeTagNameEnd)) return undefined;
 
             // only return linked cursors if text in both tags is identical
             const openingTagText = openTag.tagName.getText(sourceFile);
             if (openingTagText !== closeTag.tagName.getText(sourceFile)) return undefined;
 
             return {
-                ranges: [{ start: openTagStart, length: openTagEnd - openTagStart }, { start: closeTagStart, length: closeTagEnd - closeTagStart }],
+                ranges: [{ start: openTagNameStart, length: openTagNameEnd - openTagNameStart }, { start: closeTagNameStart, length: closeTagNameEnd - closeTagNameStart }],
                 wordPattern: jsxTagWordPattern,
             };
         }

tests/baselines/reference/linkedEditingJsxTag10.linkedEditing.txt

@@ -54,10 +54,9 @@ const jsx = <div </div>;
 
 
 === /jsx9.tsx ===
-const jsx = <[|/*0*/div|]> </[|/*0*/div|];
+const jsx = <div> </div;
 
-=== 0 ===
-{"ranges":[{"start":13,"length":3},{"start":20,"length":3}],"wordPattern":"[a-zA-Z0-9:\\-\\._$]*"}
+--No linked edits found--
 
 
 === /jsx10.tsx ===

tests/baselines/reference/linkedEditingJsxTag12.linkedEditing.txt

@@ -0,0 +1,88 @@
+// === Linked Editing ===
+=== /incomplete.tsx ===
+function Test() {
+    return <[|/*0*/div|]>
+        <
+        <div {...{}}>
+        </[|/*0*/div|]>
+    </div>
+}
+
+=== 0 ===
+{"ranges":[{"start":30,"length":3},{"start":77,"length":3}],"wordPattern":"[a-zA-Z0-9:\\-\\._$]*"}
+
+
+=== /incompleteMismatched.tsx ===
+function Test() {
+    return <[|/*1*/div|]>
+        <T
+        <div {...{}}>
+        </[|/*1*/div|]>
+    </div>
+}
+
+=== 1 ===
+{"ranges":[{"start":30,"length":3},{"start":78,"length":3}],"wordPattern":"[a-zA-Z0-9:\\-\\._$]*"}
+
+
+=== /incompleteMismatched2.tsx ===
+function Test() {
+    return <[|/*2*/div|]>
+        <T
+        <div {...{}}>
+        T</[|/*2*/div|]>
+    </div>
+}
+
+=== 2 ===
+{"ranges":[{"start":30,"length":3},{"start":79,"length":3}],"wordPattern":"[a-zA-Z0-9:\\-\\._$]*"}
+
+
+=== /incompleteMismatched3.tsx ===
+function Test() {
+    return <[|/*3*/div|]>
+        <[|/*4*/div|] {...{}}>
+        </[|/*4*/div|]>
+        <T
+    </[|/*3*/div|]>
+}
+
+=== 3 ===
+{"ranges":[{"start":30,"length":3},{"start":89,"length":3}],"wordPattern":"[a-zA-Z0-9:\\-\\._$]*"}
+
+=== 4 ===
+{"ranges":[{"start":44,"length":3},{"start":67,"length":3}],"wordPattern":"[a-zA-Z0-9:\\-\\._$]*"}
+
+
+=== /mismatched.tsx ===
+function Test() {
+    return <[|/*5*/div|]>
+        <T>
+        <[|/*6*/div|] {...{}}>
+        </[|/*6*/div|]>
+    </[|/*5*/div|]>
+}
+
+=== 5 ===
+{"ranges":[{"start":30,"length":3},{"start":90,"length":3}],"wordPattern":"[a-zA-Z0-9:\\-\\._$]*"}
+
+=== 6 ===
+{"ranges":[{"start":56,"length":3},{"start":79,"length":3}],"wordPattern":"[a-zA-Z0-9:\\-\\._$]*"}
+
+
+=== /matched.tsx ===
+function Test() {
+    return <[|/*7*/div|]>
+
+        <[|/*8*/div|] {...{}}>
+        </[|/*8*/div|]>
+    </[|/*7*/div|]>
+}
+
+=== 7 ===
+{"ranges":[{"start":30,"length":3},{"start":79,"length":3}],"wordPattern":"[a-zA-Z0-9:\\-\\._$]*"}
+
+=== 8 ===
+{"ranges":[{"start":45,"length":3},{"start":68,"length":3}],"wordPattern":"[a-zA-Z0-9:\\-\\._$]*"}
+
+

tests/cases/fourslash/linkedEditingJsxTag10.ts

@@ -48,4 +48,5 @@
 // @Filename: /jsx15.tsx
 ////const jsx = </*15*/div> </*15a*/> <//*15b*/div> <//*15c*/>;
 
+// as of #57132 none of these cases should have linked editing because the tags are mismatched or missing either < or >
 verify.baselineLinkedEditing();

tests/cases/fourslash/linkedEditingJsxTag12.ts

@@ -0,0 +1,58 @@
+/// <reference path='fourslash.ts' />
+
+// @Filename: /incomplete.tsx
+//// function Test() {
+////     return <div>
+////         </*0*/
+////         <div {...{}}>
+////         </div>
+////     </div>
+//// }
+
+// @Filename: /incompleteMismatched.tsx
+//// function Test() {
+////     return <div>
+////         <T
+////         <div {...{}}>
+////         </div>
+////     </div>
+//// }
+
+// @Filename: /incompleteMismatched2.tsx
+//// function Test() {
+////     return <div>
+////         <T
+////         <div {...{}}>
+////         T</div>
+////     </div>
+//// }
+
+// @Filename: /incompleteMismatched3.tsx
+//// function Test() {
+////     return <div>
+////         <div {...{}}>
+////         </div>
+////         <T
+////     </div>
+//// }
+
+// @Filename: /mismatched.tsx
+//// function Test() {
+////     return <div>
+////         <T>
+////         <div {...{}}>
+////         </div>
+////     </div>
+//// }
+
+// @Filename: /matched.tsx
+//// function Test() {
+////     return <div>
+////
+////         <div {...{}}>
+////         </div>
+////     </div>
+//// }
+
+verify.linkedEditing({ 0 : undefined });
+verify.baselineLinkedEditing();