From bce1a4a1a1e9411c92e1189900cccd17500e05d9 Mon Sep 17 00:00:00 2001 From: Rairn <958414905@qq.com> Date: Wed, 12 Oct 2022 14:26:01 +0800 Subject: [PATCH 1/3] fix(runtime-core): should also inherit the DOM el of the text nodes (#6852) --- packages/runtime-core/src/renderer.ts | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/packages/runtime-core/src/renderer.ts b/packages/runtime-core/src/renderer.ts index c043492e1df..a90529d60bb 100644 --- a/packages/runtime-core/src/renderer.ts +++ b/packages/runtime-core/src/renderer.ts @@ -2391,6 +2391,11 @@ export function traverseStaticChildren(n1: VNode, n2: VNode, shallow = false) { if (__DEV__ && c2.type === Comment && !c2.el) { c2.el = c1.el } + // #6852 + // also inherit for text nodes + if (c2.type === Text && !c2.el) { + c2.el = c1.el + } } } } From 1124a64f8fb1ecd497b23bb6166e9a9d515ad1ea Mon Sep 17 00:00:00 2001 From: Rairn <958414905@qq.com> Date: Wed, 12 Oct 2022 15:22:02 +0800 Subject: [PATCH 2/3] test: template keyed fragment w/ text --- .../__tests__/rendererFragment.spec.ts | 36 +++++++++++++++++++ 1 file changed, 36 insertions(+) diff --git a/packages/runtime-core/__tests__/rendererFragment.spec.ts b/packages/runtime-core/__tests__/rendererFragment.spec.ts index 93140f13f4e..1de73ef632c 100644 --- a/packages/runtime-core/__tests__/rendererFragment.spec.ts +++ b/packages/runtime-core/__tests__/rendererFragment.spec.ts @@ -315,4 +315,40 @@ describe('renderer: fragment', () => { `
two
one
` ) }) + + // #6852 + test('`template` keyed fragment w/ text', () => { + const root = nodeOps.createElement('div') + + const renderFn = (items: string[]) => { + return ( + openBlock(true), + createBlock( + Fragment, + null, + renderList(items, item => { + return ( + openBlock(), + createBlock( + Fragment, + { key: item }, + [ + createTextVNode('text'), + createVNode('div', null, item, PatchFlags.TEXT) + ], + PatchFlags.STABLE_FRAGMENT + ) + ) + }), + PatchFlags.KEYED_FRAGMENT + ) + ) + } + + render(renderFn(['one', 'two']), root) + expect(serializeInner(root)).toBe(`text
one
text
two
`) + + render(renderFn(['two', 'one']), root) + expect(serializeInner(root)).toBe(`text
two
text
one
`) + }) }) From c57be5b1ddce43214815a9f977733aebb29115d5 Mon Sep 17 00:00:00 2001 From: Evan You Date: Thu, 10 Nov 2022 04:54:40 -0500 Subject: [PATCH 3/3] Update renderer.ts --- packages/runtime-core/src/renderer.ts | 9 ++++----- 1 file changed, 4 insertions(+), 5 deletions(-) diff --git a/packages/runtime-core/src/renderer.ts b/packages/runtime-core/src/renderer.ts index a90529d60bb..4a6d8993a49 100644 --- a/packages/runtime-core/src/renderer.ts +++ b/packages/runtime-core/src/renderer.ts @@ -2386,16 +2386,15 @@ export function traverseStaticChildren(n1: VNode, n2: VNode, shallow = false) { } if (!shallow) traverseStaticChildren(c1, c2) } + // #6852 also inherit for text nodes + if (c2.type === Text) { + c2.el = c1.el + } // also inherit for comment nodes, but not placeholders (e.g. v-if which // would have received .el during block patch) if (__DEV__ && c2.type === Comment && !c2.el) { c2.el = c1.el } - // #6852 - // also inherit for text nodes - if (c2.type === Text && !c2.el) { - c2.el = c1.el - } } } }