From f5ef882a781b8a62c9ca00e95006d07636567c8e Mon Sep 17 00:00:00 2001 From: Evan You Date: Wed, 6 Dec 2023 23:17:02 +0800 Subject: [PATCH] fix(style): always set new styles close #12901 close #12946 --- src/platforms/web/runtime/modules/style.ts | 6 ++---- test/unit/modules/vdom/modules/style.spec.ts | 15 +++++++++++++++ 2 files changed, 17 insertions(+), 4 deletions(-) diff --git a/src/platforms/web/runtime/modules/style.ts b/src/platforms/web/runtime/modules/style.ts index ff6e14da495..13898eabfd1 100644 --- a/src/platforms/web/runtime/modules/style.ts +++ b/src/platforms/web/runtime/modules/style.ts @@ -91,10 +91,8 @@ function updateStyle(oldVnode: VNodeWithData, vnode: VNodeWithData) { } for (name in newStyle) { cur = newStyle[name] - if (cur !== oldStyle[name]) { - // ie9 setting to null has no effect, must use empty string - setProp(el, name, cur == null ? '' : cur) - } + // ie9 setting to null has no effect, must use empty string + setProp(el, name, cur == null ? '' : cur) } } diff --git a/test/unit/modules/vdom/modules/style.spec.ts b/test/unit/modules/vdom/modules/style.spec.ts index ec57ae88d6e..19bbb9c8453 100644 --- a/test/unit/modules/vdom/modules/style.spec.ts +++ b/test/unit/modules/vdom/modules/style.spec.ts @@ -36,4 +36,19 @@ describe('vdom style module', () => { expect(elm.style.fontSize).toBe('') expect(elm.style.display).toBe('block') }) + + it('border related style should update correctly', () => { + const vnode1 = new VNode('p', { + style: { border: '10px solid red', 'border-bottom': '10px solid blue' } + }) + const vnode2 = new VNode('p', { + style: { + 'border-right': '10px solid red', + 'border-bottom': '10px solid blue' + } + }) + patch(null, vnode1) + const elm = patch(vnode1, vnode2) + expect(elm.style.borderBottom).toBe('10px solid blue') + }) })