From 45f104f9f052bde5f318eb674fd852156a68add0 Mon Sep 17 00:00:00 2001 From: "wh.huajieyu" Date: Tue, 21 Feb 2023 17:06:43 +0800 Subject: [PATCH 1/5] fix(rendererTemplateRef): setRef function add transition component catch --- .../runtime-core/src/rendererTemplateRef.ts | 6 ++- .../vue/__tests__/e2e/TransitionGroup.spec.ts | 53 +++++++++++++++++++ 2 files changed, 58 insertions(+), 1 deletion(-) diff --git a/packages/runtime-core/src/rendererTemplateRef.ts b/packages/runtime-core/src/rendererTemplateRef.ts index 30f96228d1f..cdf51abc12b 100644 --- a/packages/runtime-core/src/rendererTemplateRef.ts +++ b/packages/runtime-core/src/rendererTemplateRef.ts @@ -118,7 +118,11 @@ export function setRef( warn('Invalid template ref type:', ref, `(${typeof ref})`) } } - if (value) { + + if ( + value || + (!value && vnode.transition && !vnode.transition.persisted) + ) { // #1789: for non-null values, set them after render // null values means this is unmount and it should not overwrite another // ref with the same key diff --git a/packages/vue/__tests__/e2e/TransitionGroup.spec.ts b/packages/vue/__tests__/e2e/TransitionGroup.spec.ts index a78f3912412..5a41c8bbb0e 100644 --- a/packages/vue/__tests__/e2e/TransitionGroup.spec.ts +++ b/packages/vue/__tests__/e2e/TransitionGroup.spec.ts @@ -298,6 +298,59 @@ describe('e2e: TransitionGroup', () => { E2E_TIMEOUT ) + test( + 'ref', + async () => { + await page().evaluate(() => { + const { createApp, ref } = (window as any).Vue + createApp({ + template: ` +
+ +
{{item}}
+ +
+ + `, + setup: () => { + const items = ref(['a', 'b', 'c']) + const click = () => (items.value = ['d', 'b', 'a']) + const itemRef = ref() + return { click, items, itemRef } + } + }).mount('#app') + }) + + expect(await html('#container')).toBe( + `
a
` + + `
b
` + + `
c
` + ) + + expect(await htmlWhenTransitionStart()).toBe( + `
d
` + + `
b
` + + `
a
` + + `
c
` + ) + await nextFrame() + expect(await html('#container')).toBe( + `
d
` + + `
b
` + + `
a
` + + `
c
` + ) + await transitionFinish(duration * 2) + expect(await html('#container')).toBe( + `
d
` + + `
b
` + + `
a
` + ) + }, + + E2E_TIMEOUT + ) + test( 'dynamic name', async () => { From 7fcdcfd913a00aa3b42c92f147fdd1599c13a29c Mon Sep 17 00:00:00 2001 From: "wh.huajieyu" Date: Tue, 21 Feb 2023 18:28:45 +0800 Subject: [PATCH 2/5] fix(TransitionGroup): test format --- packages/vue/__tests__/e2e/TransitionGroup.spec.ts | 2 -- 1 file changed, 2 deletions(-) diff --git a/packages/vue/__tests__/e2e/TransitionGroup.spec.ts b/packages/vue/__tests__/e2e/TransitionGroup.spec.ts index 5a41c8bbb0e..b644464614d 100644 --- a/packages/vue/__tests__/e2e/TransitionGroup.spec.ts +++ b/packages/vue/__tests__/e2e/TransitionGroup.spec.ts @@ -320,7 +320,6 @@ describe('e2e: TransitionGroup', () => { } }).mount('#app') }) - expect(await html('#container')).toBe( `
a
` + `
b
` + @@ -347,7 +346,6 @@ describe('e2e: TransitionGroup', () => { `
a
` ) }, - E2E_TIMEOUT ) From d4ec2336b5455dddd96bfdf0ae9620a1b129b676 Mon Sep 17 00:00:00 2001 From: "wh.huajieyu" Date: Tue, 21 Feb 2023 18:30:26 +0800 Subject: [PATCH 3/5] fix(TransitionGroup): test format --- packages/vue/__tests__/e2e/TransitionGroup.spec.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/vue/__tests__/e2e/TransitionGroup.spec.ts b/packages/vue/__tests__/e2e/TransitionGroup.spec.ts index b644464614d..50d3ff4d475 100644 --- a/packages/vue/__tests__/e2e/TransitionGroup.spec.ts +++ b/packages/vue/__tests__/e2e/TransitionGroup.spec.ts @@ -306,10 +306,10 @@ describe('e2e: TransitionGroup', () => { createApp({ template: `
- -
{{item}}
- -
+ +
{{item}}
+ + `, setup: () => { From 3e643185c30d2e68e4ee020d0412b24d6a534d13 Mon Sep 17 00:00:00 2001 From: "wh.huajieyu" Date: Thu, 23 Feb 2023 10:26:54 +0800 Subject: [PATCH 4/5] fix(TransitionGroup): modify judgment condition --- packages/runtime-core/src/rendererTemplateRef.ts | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/packages/runtime-core/src/rendererTemplateRef.ts b/packages/runtime-core/src/rendererTemplateRef.ts index cdf51abc12b..7755cb8d9ce 100644 --- a/packages/runtime-core/src/rendererTemplateRef.ts +++ b/packages/runtime-core/src/rendererTemplateRef.ts @@ -119,10 +119,7 @@ export function setRef( } } - if ( - value || - (!value && vnode.transition && !vnode.transition.persisted) - ) { + if (value || (vnode.transition && !vnode.transition.persisted)) { // #1789: for non-null values, set them after render // null values means this is unmount and it should not overwrite another // ref with the same key From 77668ce6bced863b1362a1dbda9cd35c51c1986d Mon Sep 17 00:00:00 2001 From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com> Date: Wed, 21 Aug 2024 02:51:08 +0000 Subject: [PATCH 5/5] [autofix.ci] apply automated fixes --- packages/vue/__tests__/e2e/TransitionGroup.spec.ts | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/packages/vue/__tests__/e2e/TransitionGroup.spec.ts b/packages/vue/__tests__/e2e/TransitionGroup.spec.ts index 359ecf5023d..aa116b68ed7 100644 --- a/packages/vue/__tests__/e2e/TransitionGroup.spec.ts +++ b/packages/vue/__tests__/e2e/TransitionGroup.spec.ts @@ -316,36 +316,36 @@ describe('e2e: TransitionGroup', () => { const click = () => (items.value = ['d', 'b', 'a']) const itemRef = ref() return { click, items, itemRef } - } + }, }).mount('#app') }) expect(await html('#container')).toBe( `
a
` + `
b
` + - `
c
` + `
c
`, ) expect(await htmlWhenTransitionStart()).toBe( `
d
` + `
b
` + `
a
` + - `
c
` + `
c
`, ) await nextFrame() expect(await html('#container')).toBe( `
d
` + `
b
` + `
a
` + - `
c
` + `
c
`, ) await transitionFinish(duration * 2) expect(await html('#container')).toBe( `
d
` + `
b
` + - `
a
` + `
a
`, ) }, - E2E_TIMEOUT + E2E_TIMEOUT, ) test(