From 9593ace05a4281d98b95c55488d1a2d5e2d5abf8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E4=B8=B6=E8=BF=9C=E6=96=B9?= Date: Wed, 26 Jul 2023 08:59:07 +0800 Subject: [PATCH 1/2] chore: create `EffectScope` using a factory function --- .../reactivity/__tests__/effectScope.spec.ts | 43 ++++++++++--------- packages/runtime-core/src/component.ts | 3 +- 2 files changed, 24 insertions(+), 22 deletions(-) diff --git a/packages/reactivity/__tests__/effectScope.spec.ts b/packages/reactivity/__tests__/effectScope.spec.ts index b26a90a09db..41ac761e517 100644 --- a/packages/reactivity/__tests__/effectScope.spec.ts +++ b/packages/reactivity/__tests__/effectScope.spec.ts @@ -2,6 +2,7 @@ import { nextTick, watch, watchEffect } from '@vue/runtime-core' import { reactive, effect, + effectScope, EffectScope, onScopeDispose, computed, @@ -13,21 +14,21 @@ import { describe('reactivity/effect/scope', () => { it('should run', () => { const fnSpy = vi.fn(() => {}) - new EffectScope().run(fnSpy) + effectScope().run(fnSpy) expect(fnSpy).toHaveBeenCalledTimes(1) }) it('should accept zero argument', () => { - const scope = new EffectScope() + const scope = effectScope() expect(scope.effects.length).toBe(0) }) it('should return run value', () => { - expect(new EffectScope().run(() => 1)).toBe(1) + expect(effectScope().run(() => 1)).toBe(1) }) it('should work w/ active property', () => { - const scope = new EffectScope() + const scope = effectScope() scope.run(() => 1) expect(scope.active).toBe(true) scope.stop() @@ -35,7 +36,7 @@ describe('reactivity/effect/scope', () => { }) it('should collect the effects', () => { - const scope = new EffectScope() + const scope = effectScope() scope.run(() => { let dummy const counter = reactive({ num: 0 }) @@ -53,7 +54,7 @@ describe('reactivity/effect/scope', () => { let dummy, doubled const counter = reactive({ num: 0 }) - const scope = new EffectScope() + const scope = effectScope() scope.run(() => { effect(() => (dummy = counter.num)) effect(() => (doubled = counter.num * 2)) @@ -77,11 +78,11 @@ describe('reactivity/effect/scope', () => { let dummy, doubled const counter = reactive({ num: 0 }) - const scope = new EffectScope() + const scope = effectScope() scope.run(() => { effect(() => (dummy = counter.num)) // nested scope - new EffectScope().run(() => { + effectScope().run(() => { effect(() => (doubled = counter.num * 2)) }) }) @@ -107,11 +108,11 @@ describe('reactivity/effect/scope', () => { let dummy, doubled const counter = reactive({ num: 0 }) - const scope = new EffectScope() + const scope = effectScope() scope.run(() => { effect(() => (dummy = counter.num)) // nested scope - new EffectScope(true).run(() => { + effectScope(true).run(() => { effect(() => (doubled = counter.num * 2)) }) }) @@ -136,7 +137,7 @@ describe('reactivity/effect/scope', () => { let dummy, doubled const counter = reactive({ num: 0 }) - const scope = new EffectScope() + const scope = effectScope() scope.run(() => { effect(() => (dummy = counter.num)) }) @@ -160,7 +161,7 @@ describe('reactivity/effect/scope', () => { let dummy, doubled const counter = reactive({ num: 0 }) - const scope = new EffectScope() + const scope = effectScope() scope.run(() => { effect(() => (dummy = counter.num)) }) @@ -185,7 +186,7 @@ describe('reactivity/effect/scope', () => { it('should fire onScopeDispose hook', () => { let dummy = 0 - const scope = new EffectScope() + const scope = effectScope() scope.run(() => { onScopeDispose(() => (dummy += 1)) onScopeDispose(() => (dummy += 2)) @@ -203,7 +204,7 @@ describe('reactivity/effect/scope', () => { it('should warn onScopeDispose() is called when there is no active effect scope', () => { const spy = vi.fn() - const scope = new EffectScope() + const scope = effectScope() scope.run(() => { onScopeDispose(spy) }) @@ -221,8 +222,8 @@ describe('reactivity/effect/scope', () => { }) it('should dereference child scope from parent scope after stopping child scope (no memleaks)', () => { - const parent = new EffectScope() - const child = parent.run(() => new EffectScope())! + const parent = effectScope() + const child = parent.run(() => effectScope())! expect(parent.scopes!.includes(child)).toBe(true) child.stop() expect(parent.scopes!.includes(child)).toBe(false) @@ -236,7 +237,7 @@ describe('reactivity/effect/scope', () => { const watchEffectSpy = vi.fn() let c: ComputedRef - const scope = new EffectScope() + const scope = effectScope() scope.run(() => { c = computed(() => { computedSpy() @@ -274,12 +275,12 @@ describe('reactivity/effect/scope', () => { }) it('getCurrentScope() stays valid when running a detached nested EffectScope', () => { - const parentScope = new EffectScope() + const parentScope = effectScope() parentScope.run(() => { const currentScope = getCurrentScope() expect(currentScope).toBeDefined() - const detachedScope = new EffectScope(true) + const detachedScope = effectScope(true) detachedScope.run(() => {}) expect(getCurrentScope()).toBe(currentScope) @@ -287,10 +288,10 @@ describe('reactivity/effect/scope', () => { }) it('calling .off() of a detached scope inside an active scope should not break currentScope', () => { - const parentScope = new EffectScope() + const parentScope = effectScope() parentScope.run(() => { - const childScope = new EffectScope(true) + const childScope = effectScope(true) childScope.on() childScope.off() expect(getCurrentScope()).toBe(parentScope) diff --git a/packages/runtime-core/src/component.ts b/packages/runtime-core/src/component.ts index 57a53a39b76..9545db87efc 100644 --- a/packages/runtime-core/src/component.ts +++ b/packages/runtime-core/src/component.ts @@ -5,6 +5,7 @@ import { resetTracking, shallowReadonly, proxyRefs, + effectScope, EffectScope, markRaw, track, @@ -502,7 +503,7 @@ export function createComponentInstance( subTree: null!, // will be set synchronously right after creation effect: null!, update: null!, // will be set synchronously right after creation - scope: new EffectScope(true /* detached */), + scope: effectScope(true /* detached */), render: null, proxy: null, exposed: null, From 80376fb79af28c80500c181fed0426b6c5345d23 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E4=B8=B6=E8=BF=9C=E6=96=B9?= Date: Tue, 15 Aug 2023 13:38:01 +0800 Subject: [PATCH 2/2] chore: rollback runtime-core --- packages/runtime-core/src/component.ts | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/packages/runtime-core/src/component.ts b/packages/runtime-core/src/component.ts index 9545db87efc..57a53a39b76 100644 --- a/packages/runtime-core/src/component.ts +++ b/packages/runtime-core/src/component.ts @@ -5,7 +5,6 @@ import { resetTracking, shallowReadonly, proxyRefs, - effectScope, EffectScope, markRaw, track, @@ -503,7 +502,7 @@ export function createComponentInstance( subTree: null!, // will be set synchronously right after creation effect: null!, update: null!, // will be set synchronously right after creation - scope: effectScope(true /* detached */), + scope: new EffectScope(true /* detached */), render: null, proxy: null, exposed: null,