From: daiwei <daiwei521@126.com>
Date: Tue, 20 Jan 2026 02:20:29 +0000 (+0800)
Subject: fix(compile-vapor): optimize always close tag on rightmost
X-Git-Tag: v3.6.0-beta.4~6
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=0db578b1995d934dba9b36f0e6c50ed60e2cae94;p=thirdparty%2Fvuejs%2Fcore.git

fix(compile-vapor): optimize always close tag on rightmost
---

diff --git a/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap b/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap
index 61f944aac4..4ae24a007f 100644
--- a/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap
+++ b/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap
@@ -215,7 +215,7 @@ export function render(_ctx) {
 exports[`compile > execution order > setInsertionState > next, child and nthChild should be above the setInsertionState 1`] = `
 "import { resolveComponent as _resolveComponent, child as _child, next as _next, setInsertionState as _setInsertionState, createComponentWithFallback as _createComponentWithFallback, nthChild as _nthChild, createIf as _createIf, setProp as _setProp, renderEffect as _renderEffect, template as _template } from 'vue';
 const t0 = _template("<div>")
-const t1 = _template("<div><div></div><!><div></div><!><div><button></button>", true)
+const t1 = _template("<div><div></div><!><div></div><!><div><button>", true)
 
 export function render(_ctx) {
   const _component_Comp = _resolveComponent("Comp")
diff --git a/packages/compiler-vapor/__tests__/abbreviation.spec.ts b/packages/compiler-vapor/__tests__/abbreviation.spec.ts
index 130c6202f4..aed4bbfc29 100644
--- a/packages/compiler-vapor/__tests__/abbreviation.spec.ts
+++ b/packages/compiler-vapor/__tests__/abbreviation.spec.ts
@@ -131,47 +131,77 @@ test('deeply nested', () => {
 })
 
 test('always close tags', () => {
-  // button always needs closing tag
+  // button always needs closing tag unless on rightmost path
   checkAbbr(
     '<div><button>click</button></div>',
-    '<div><button>click</button>',
+    '<div><button>click',
     '<div><button>click</button></div>',
   )
+  checkAbbr(
+    '<div><button>click</button><span>sibling</span></div>',
+    '<div><button>click</button><span>sibling',
+    '<div><button>click</button><span>sibling</span></div>',
+  )
 
-  // select always needs closing tag
+  // select always needs closing tag unless rightmost
   checkAbbr(
     '<div><select></select></div>',
-    '<div><select></select>',
+    '<div><select>',
     '<div><select></select></div>',
   )
+  checkAbbr(
+    '<div><select></select><span>sibling</span></div>',
+    '<div><select></select><span>sibling',
+    '<div><select></select><span>sibling</span></div>',
+  )
 
-  // table always needs closing tag
+  // table always needs closing tag unless rightmost
   checkAbbr(
     '<div><table></table></div>',
-    '<div><table></table>',
+    '<div><table>',
     '<div><table></table></div>',
   )
+  checkAbbr(
+    '<div><table></table><span>sibling</span></div>',
+    '<div><table></table><span>sibling',
+    '<div><table></table><span>sibling</span></div>',
+  )
 
-  // textarea always needs closing tag
+  // textarea always needs closing tag unless rightmost
   checkAbbr(
     '<div><textarea></textarea></div>',
-    '<div><textarea></textarea>',
+    '<div><textarea>',
     '<div><textarea></textarea></div>',
   )
+  checkAbbr(
+    '<div><textarea></textarea><span>sibling</span></div>',
+    '<div><textarea></textarea><span>sibling',
+    '<div><textarea></textarea><span>sibling</span></div>',
+  )
 
-  // template always needs closing tag
+  // template always needs closing tag unless rightmost
   checkAbbr(
     '<div><template></template></div>',
-    '<div><template></template>',
+    '<div><template>',
     '<div><template></template></div>',
   )
+  checkAbbr(
+    '<div><template></template><span>sibling</span></div>',
+    '<div><template></template><span>sibling',
+    '<div><template></template><span>sibling</span></div>',
+  )
 
-  // script always needs closing tag
+  // script always needs closing tag unless rightmost
   checkAbbr(
     '<div><script></script></div>',
-    '<div><script></script>',
+    '<div><script>',
     '<div><script></script></div>',
   )
+  checkAbbr(
+    '<div><script></script><span>sibling</span></div>',
+    '<div><script></script><span>sibling',
+    '<div><script></script><span>sibling</span></div>',
+  )
 
   // without always-close elements, normal abbreviation should work
   checkAbbr(
diff --git a/packages/compiler-vapor/src/transforms/transformElement.ts b/packages/compiler-vapor/src/transforms/transformElement.ts
index ffa73a89db..d73e70edb8 100644
--- a/packages/compiler-vapor/src/transforms/transformElement.ts
+++ b/packages/compiler-vapor/src/transforms/transformElement.ts
@@ -141,8 +141,8 @@ function canOmitEndTag(
   }
 
   // Elements in the alwaysClose list cannot have their end tags omitted
-  // because the browser's HTML parser has special handling for them
-  if (isAlwaysCloseTag(node.tag)) {
+  // unless they are on the rightmost path.
+  if (isAlwaysCloseTag(node.tag) && !context.isOnRightmostPath) {
     return false
   }