Explorar el Código

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

zhiyuanzmj hace 10 meses
padre
commit
ffb7ba77c9

+ 39 - 0
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)
+  })
 })

+ 3 - 1
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)