diff --git a/packages/runtime-dom/__tests__/patchProps.spec.ts b/packages/runtime-dom/__tests__/patchProps.spec.ts index 07aee676ded..24760695040 100644 --- a/packages/runtime-dom/__tests__/patchProps.spec.ts +++ b/packages/runtime-dom/__tests__/patchProps.spec.ts @@ -263,4 +263,11 @@ describe('runtime-dom: props patching', () => { ) expect(el.value).toBe('baz') }) + + test('translate attribute', () => { + const el = document.createElement('div') + patchProp(el, 'translate', null, 'no') + expect(el.translate).toBeFalsy() + expect(el.getAttribute('translate')).toBe('no') + }) }) diff --git a/packages/runtime-dom/src/patchProp.ts b/packages/runtime-dom/src/patchProp.ts index e10d189c581..6d65a63a88c 100644 --- a/packages/runtime-dom/src/patchProp.ts +++ b/packages/runtime-dom/src/patchProp.ts @@ -79,13 +79,13 @@ function shouldSetAsProp( return false } - // spellcheck and draggable are numerated attrs, however their - // corresponding DOM properties are actually booleans - this leads to - // setting it with a string "false" value leading it to be coerced to - // `true`, so we need to always treat them as attributes. + // these are enumerated attrs, however their corresponding DOM properties + // are actually booleans - this leads to setting it with a string "false" + // value leading it to be coerced to `true`, so we need to always treat + // them as attributes. // Note that `contentEditable` doesn't have this problem: its DOM // property is also enumerated string values. - if (key === 'spellcheck' || key === 'draggable') { + if (key === 'spellcheck' || key === 'draggable' || key === 'translate') { return false }