From 5eec3f5867170a78f59bb7017d7982bb02d2385f Mon Sep 17 00:00:00 2001 From: daiwei Date: Thu, 22 Aug 2024 10:48:32 +0800 Subject: [PATCH 1/3] fix(compiler-sfc): properly analyze patch flag of vFor --- .../__snapshots__/cacheStatic.spec.ts.snap | 2 +- .../__snapshots__/transformText.spec.ts.snap | 2 +- .../transforms/transformElement.spec.ts | 38 +++++++++++++++++++ .../src/transforms/transformElement.ts | 6 ++- 4 files changed, 44 insertions(+), 4 deletions(-) diff --git a/packages/compiler-core/__tests__/transforms/__snapshots__/cacheStatic.spec.ts.snap b/packages/compiler-core/__tests__/transforms/__snapshots__/cacheStatic.spec.ts.snap index 8d0305ee354..1ecb05084e7 100644 --- a/packages/compiler-core/__tests__/transforms/__snapshots__/cacheStatic.spec.ts.snap +++ b/packages/compiler-core/__tests__/transforms/__snapshots__/cacheStatic.spec.ts.snap @@ -217,7 +217,7 @@ return function render(_ctx, _cache) { return (_openBlock(), _createElementBlock("div", null, [ _withDirectives((_openBlock(), _createElementBlock("svg", null, _cache[0] || (_cache[0] = [ _createElementVNode("path", { d: "M2,3H5.5L12" }, null, -1 /* HOISTED */) - ]))), [ + ]), 512 /* NEED_PATCH */)), [ [_directive_foo] ]) ])) diff --git a/packages/compiler-core/__tests__/transforms/__snapshots__/transformText.spec.ts.snap b/packages/compiler-core/__tests__/transforms/__snapshots__/transformText.spec.ts.snap index 7fb49ea7887..55a7d714325 100644 --- a/packages/compiler-core/__tests__/transforms/__snapshots__/transformText.spec.ts.snap +++ b/packages/compiler-core/__tests__/transforms/__snapshots__/transformText.spec.ts.snap @@ -73,7 +73,7 @@ return function render(_ctx, _cache) { return _withDirectives((_openBlock(), _createElementBlock("p", null, [ _createTextVNode(_toDisplayString(foo), 1 /* TEXT */) - ])), [ + ], 512 /* NEED_PATCH */)), [ [_directive_foo] ]) } diff --git a/packages/compiler-core/__tests__/transforms/transformElement.spec.ts b/packages/compiler-core/__tests__/transforms/transformElement.spec.ts index bf3510a052d..06ff1dcd80c 100644 --- a/packages/compiler-core/__tests__/transforms/transformElement.spec.ts +++ b/packages/compiler-core/__tests__/transforms/transformElement.spec.ts @@ -1028,6 +1028,44 @@ describe('compiler: element transform', () => { expect(node.patchFlag).toBe(PatchFlags.NEED_PATCH) }) + test('NEED_PATCH (vFor + static ref)', () => { + const { node } = parseWithBind( + `
`, + ) + expect(node.patchFlag).toBe(PatchFlags.NEED_PATCH) + }) + + test('NEED_PATCH (vFor + custom directives)', () => { + const { node } = parseWithBind(`
`) + expect(node.patchFlag).toBe(PatchFlags.NEED_PATCH) + }) + + test('NEED_PATCH (vFor + vnode hooks)', () => { + const root = baseCompile( + `
`, + { + prefixIdentifiers: true, + cacheHandlers: true, + }, + ).ast + const node = (root as any).children[0].children[0].codegenNode + expect(node.patchFlag).toBe(PatchFlags.NEED_PATCH) + }) + + test('NEED_PATCH (vFor + setRef function)', () => { + const root = baseCompile( + `
`, + { + prefixIdentifiers: true, + bindingMetadata: { + setRefFn: BindingTypes.SETUP_CONST, + }, + }, + ).ast + const node = (root as any).children[0].children[0].codegenNode + expect(node.patchFlag).toBe(PatchFlags.NEED_PATCH) + }) + test('script setup inline mode template ref (binding exists)', () => { const { node } = parseWithElementTransform(``, { inline: true, diff --git a/packages/compiler-core/src/transforms/transformElement.ts b/packages/compiler-core/src/transforms/transformElement.ts index c917436ea91..daf15ab130e 100644 --- a/packages/compiler-core/src/transforms/transformElement.ts +++ b/packages/compiler-core/src/transforms/transformElement.ts @@ -456,9 +456,12 @@ export function buildProps( value.type === NodeTypes.JS_CACHE_EXPRESSION || ((value.type === NodeTypes.SIMPLE_EXPRESSION || value.type === NodeTypes.COMPOUND_EXPRESSION) && + name !== 'ref' && getConstantType(value, context) > 0) ) { - // skip if the prop is a cached handler or has constant value + // skip if: + // 1. the prop is a cached handler + // 2. has constant value (excluding :ref="setRefFn", setRefFn is a setup-const) return } @@ -738,7 +741,6 @@ export function buildProps( } } if ( - !shouldUseBlock && (patchFlag === 0 || patchFlag === PatchFlags.NEED_HYDRATION) && (hasRef || hasVnodeHook || runtimeDirectives.length > 0) ) { From e81851d64931c6a6ee04ab244686f70d974df325 Mon Sep 17 00:00:00 2001 From: daiwei Date: Thu, 22 Aug 2024 11:45:02 +0800 Subject: [PATCH 2/3] chore: update test case --- .../__tests__/transforms/transformElement.spec.ts | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/packages/compiler-core/__tests__/transforms/transformElement.spec.ts b/packages/compiler-core/__tests__/transforms/transformElement.spec.ts index 06ff1dcd80c..12f4a74552a 100644 --- a/packages/compiler-core/__tests__/transforms/transformElement.spec.ts +++ b/packages/compiler-core/__tests__/transforms/transformElement.spec.ts @@ -1030,19 +1030,21 @@ describe('compiler: element transform', () => { test('NEED_PATCH (vFor + static ref)', () => { const { node } = parseWithBind( - `
`, + `
`, ) expect(node.patchFlag).toBe(PatchFlags.NEED_PATCH) }) test('NEED_PATCH (vFor + custom directives)', () => { - const { node } = parseWithBind(`
`) + const { node } = parseWithBind( + `
`, + ) expect(node.patchFlag).toBe(PatchFlags.NEED_PATCH) }) test('NEED_PATCH (vFor + vnode hooks)', () => { const root = baseCompile( - `
`, + `
`, { prefixIdentifiers: true, cacheHandlers: true, @@ -1054,7 +1056,7 @@ describe('compiler: element transform', () => { test('NEED_PATCH (vFor + setRef function)', () => { const root = baseCompile( - `
`, + `
`, { prefixIdentifiers: true, bindingMetadata: { From 0cf0c8720e2e4c0e9ff14f9ee12d2724ff84027c Mon Sep 17 00:00:00 2001 From: daiwei Date: Thu, 22 Aug 2024 11:47:07 +0800 Subject: [PATCH 3/3] chore: minor tweaks --- packages/compiler-core/src/transforms/transformElement.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/compiler-core/src/transforms/transformElement.ts b/packages/compiler-core/src/transforms/transformElement.ts index daf15ab130e..c46545bd335 100644 --- a/packages/compiler-core/src/transforms/transformElement.ts +++ b/packages/compiler-core/src/transforms/transformElement.ts @@ -456,8 +456,8 @@ export function buildProps( value.type === NodeTypes.JS_CACHE_EXPRESSION || ((value.type === NodeTypes.SIMPLE_EXPRESSION || value.type === NodeTypes.COMPOUND_EXPRESSION) && - name !== 'ref' && - getConstantType(value, context) > 0) + getConstantType(value, context) > 0 && + name !== 'ref') ) { // skip if: // 1. the prop is a cached handler