fix(runtime-dom): fix width and height prop check condition

close #9762
vuejs · Dec 7, 2023 · 5b00286 · 5b00286
1 parent d74d364
commit 5b00286
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 2 deletions.
diff --git a/packages/runtime-dom/__tests__/patchProps.spec.ts b/packages/runtime-dom/__tests__/patchProps.spec.ts
@@ -300,6 +300,13 @@ describe('runtime-dom: props patching', () => {
     expect(el.getAttribute('width')).toBe('24px')
   })
 
+  // # 9762 should fallthrough to `key in el` logic for non embedded tags
+  test('width and height on custom elements', () => {
+    const el = document.createElement('foobar')
+    patchProp(el, 'width', null, '24px')
+    expect(el.getAttribute('width')).toBe('24px')
+  })
+
   test('translate attribute', () => {
     const el = document.createElement('div')
     patchProp(el, 'translate', null, 'no')

diff --git a/packages/runtime-dom/src/patchProp.ts b/packages/runtime-dom/src/patchProp.ts
@@ -113,12 +113,14 @@ function shouldSetAsProp(
   // #8780 the width or height of embedded tags must be set as attribute
   if (key === 'width' || key === 'height') {
     const tag = el.tagName
-    return !(
+    if (
       tag === 'IMG' ||
       tag === 'VIDEO' ||
       tag === 'CANVAS' ||
       tag === 'SOURCE'
-    )
+    ) {
+      return false
+    }
   }
 
   // native onclick with string value, must be set as attribute