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