From: zhiyuanzmj <260480378@qq.com>
Date: Wed, 18 Jun 2025 00:44:50 +0000 (+0800)
Subject: fix(runtime-vapor): prevent passing an empty string to classList.add (#12974)
X-Git-Tag: v3.6.0-alpha.1~16^2~28
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=ffb7ba77c95049cb23dc491656ebf436c5cd5eb7;p=thirdparty%2Fvuejs%2Fcore.git

fix(runtime-vapor): prevent passing an empty string to classList.add (#12974)
---

diff --git a/packages/runtime-vapor/__tests__/componentAttrs.spec.ts b/packages/runtime-vapor/__tests__/componentAttrs.spec.ts
index e4076855cb..fc6fae5f02 100644
--- a/packages/runtime-vapor/__tests__/componentAttrs.spec.ts
+++ b/packages/runtime-vapor/__tests__/componentAttrs.spec.ts
@@ -322,4 +322,43 @@ describe('attribute fallthrough', () => {
     expect(el.getAttribute('aria-x')).toBe(parentVal.value)
     expect(el.getAttribute('aria-y')).toBe(parentVal.value)
   })
+
+  it('empty string should not be passed to classList.add', async () => {
+    const t0 = template('<div>', true /* root */)
+    const Child = defineVaporComponent({
+      setup() {
+        const n = t0() as Element
+        renderEffect(() => {
+          setClass(n, {
+            foo: false,
+          })
+        })
+        return n
+      },
+    })
+
+    const Parent = defineVaporComponent({
+      setup() {
+        return createComponent(
+          Child,
+          {
+            class: () => ({
+              bar: false,
+            }),
+          },
+          null,
+          true,
+        )
+      },
+    })
+
+    const { host } = define({
+      setup() {
+        return createComponent(Parent)
+      },
+    }).render()
+
+    const el = host.children[0]
+    expect(el.classList.length).toBe(0)
+  })
 })
diff --git a/packages/runtime-vapor/src/dom/prop.ts b/packages/runtime-vapor/src/dom/prop.ts
index f464a2f629..8c42ad766a 100644
--- a/packages/runtime-vapor/src/dom/prop.ts
+++ b/packages/runtime-vapor/src/dom/prop.ts
@@ -122,7 +122,9 @@ function setClassIncremental(el: any, value: any): void {
   const prev = el[cacheKey]
   if ((value = el[cacheKey] = normalizeClass(value)) !== prev) {
     const nextList = value.split(/\s+/)
-    el.classList.add(...nextList)
+    if (value) {
+      el.classList.add(...nextList)
+    }
     if (prev) {
       for (const cls of prev.split(/\s+/)) {
         if (!nextList.includes(cls)) el.classList.remove(cls)