diff --git a/packages/runtime-dom/__tests__/patchStyle.spec.ts b/packages/runtime-dom/__tests__/patchStyle.spec.ts index 92b30aa5815..409d6936eaf 100644 --- a/packages/runtime-dom/__tests__/patchStyle.spec.ts +++ b/packages/runtime-dom/__tests__/patchStyle.spec.ts @@ -37,7 +37,18 @@ describe(`runtime-dom: style patching`, () => { it('remove if falsy value', () => { const el = document.createElement('div') - patchProp(el, 'style', { color: 'red' }, { color: undefined }) + patchProp(el, 'style', null, { + color: undefined, + borderRadius: null + }) + expect(el.style.cssText.replace(/\s/g, '')).toBe('') + + patchProp( + el, + 'style', + { color: 'red' }, + { color: null, borderRadius: undefined } + ) expect(el.style.cssText.replace(/\s/g, '')).toBe('') }) diff --git a/packages/runtime-dom/src/modules/style.ts b/packages/runtime-dom/src/modules/style.ts index a9cc67ba5e2..f4924ea2ec6 100644 --- a/packages/runtime-dom/src/modules/style.ts +++ b/packages/runtime-dom/src/modules/style.ts @@ -45,6 +45,7 @@ function setStyle( if (isArray(val)) { val.forEach(v => setStyle(style, name, v)) } else { + if (val == null) val = '' if (name.startsWith('--')) { // custom property definition style.setProperty(name, val)