Skip to content
Permalink
Browse files

fix: remove deprecated lifecycle hooks

- rename `onBeforeDestroy` to `onBeforeUnmount`
- remove `onCreated`
- remove `onDestroyed`
  • Loading branch information
liximomo committed Aug 25, 2019
1 parent ae44409 commit 9d8855a4a293321075c93b15d631a43681c2605b
Showing with 24 additions and 81 deletions.
  1. +5 −7 src/apis/lifecycle.ts
  2. +4 −8 src/setup.ts
  3. +12 −63 test/apis/lifecycle.spec.js
  4. +3 −3 test/setup.spec.js
@@ -27,16 +27,14 @@ function injectHookOption(Vue: VueConstructor, vm: ComponentInstance, hook: stri
options[hook] = mergeFn(options[hook], val);
}

export const onCreated = createLifeCycle('created');
// export const onCreated = createLifeCycle('created');
export const onBeforeMount = createLifeCycle('beforeMount');
export const onMounted = createLifeCycle('mounted');
export const onBeforeUpdate = createLifeCycle('beforeUpdate');
export const onUpdated = createLifeCycle('updated');
export const onActivated = createLifeCycle('activated');
export const onDeactivated = createLifeCycle('deactivated');
export const onBeforeDestroy = createLifeCycle('beforeDestroy');
export const onDestroyed = createLifeCycle('destroyed');
export const onErrorCaptured = createLifeCycle('errorCaptured');

export const onBeforeUnmount = createLifeCycle('beforeDestroy');
// only one event will be fired between destroyed and deactivated when an unmount occurs
export const onUnmounted = createLifeCycles(['destroyed', 'deactivated'], genName('unmounted'));
export const onErrorCaptured = createLifeCycle('errorCaptured');
export const onActivated = createLifeCycle('activated');
export const onDeactivated = createLifeCycle('deactivated');
@@ -2,7 +2,7 @@ import { VueConstructor } from 'vue';
import { ComponentInstance, SetupContext, SetupFunction, Data } from './component';
import { Ref, isRef, isReactive, nonReactive } from './reactivity';
import { getCurrentVM, setCurrentVM } from './runtimeContext';
import { hasOwn, isPlainObject, assert, proxy, warn, logError, isFunction } from './utils';
import { hasOwn, isPlainObject, assert, proxy, warn, isFunction } from './utils';
import { ref } from './apis/state';
import vmStateManager from './vmStateManager';

@@ -135,13 +135,9 @@ export function mixin(Vue: VueConstructor) {
const setup = vm.$options.setup!;
const ctx = createSetupContext(vm);
let binding: ReturnType<SetupFunction<Data, Data>> | undefined | null;
activateCurrentInstance(
vm,
() => {
binding = setup(props, ctx);
},
err => logError(err, vm, 'setup()')
);
activateCurrentInstance(vm, () => {
binding = setup(props, ctx);
});

if (!binding) return;

@@ -1,64 +1,15 @@
const Vue = require('vue/dist/vue.common.js');
const {
onCreated,
onBeforeMount,
onMounted,
onBeforeUpdate,
onUpdated,
onBeforeDestroy,
onDestroyed,
onBeforeUnmount,
onUnmounted,
onErrorCaptured,
} = require('../../src');

describe('Hooks lifecycle', () => {
describe('created', () => {
it('work with created option', () => {
const spy = jest.fn();
new Vue({
created() {
spy('option');
},
setup() {
onCreated(() => spy('hook'));
},
});
expect(spy.mock.calls.length).toBe(2);
expect(spy).toHaveBeenNthCalledWith(1, 'option');
expect(spy).toHaveBeenNthCalledWith(2, 'hook');
});

it('can register multiple callbacks', () => {
const spy = jest.fn();
new Vue({
setup() {
onCreated(() => spy('first'));
onCreated(() => spy('second'));
},
});
expect(spy.mock.calls.length).toBe(2);
expect(spy).toHaveBeenNthCalledWith(1, 'first');
expect(spy).toHaveBeenNthCalledWith(2, 'second');
});

it('should have completed observation', () => {
const spy = jest.fn();
new Vue({
data() {
return {
a: 1,
};
},
setup(_, { _vm }) {
onCreated(() => {
expect(_vm.a).toBe(1);
spy();
});
},
});
expect(spy).toHaveBeenCalled();
});
});

describe('beforeMount', () => {
it('should not have mounted', () => {
const spy = jest.fn();
@@ -198,7 +149,7 @@ describe('Hooks lifecycle', () => {
props: ['todo'],
setup() {
onBeforeUpdate(beforeUpdate);
onDestroyed(destroyed);
onUnmounted(destroyed);
},
});

@@ -290,7 +241,7 @@ describe('Hooks lifecycle', () => {
props: ['todo'],
setup() {
onUpdated(updated);
onDestroyed(destroyed);
onUnmounted(destroyed);
},
});

@@ -320,13 +271,13 @@ describe('Hooks lifecycle', () => {
});
});

describe('beforeDestroy', () => {
describe('beforeUnmount', () => {
it('should be called before destroy', () => {
const spy = jest.fn();
const vm = new Vue({
render() {},
setup(_, { _vm }) {
onBeforeDestroy(() => {
onBeforeUnmount(() => {
expect(_vm._isBeingDestroyed).toBe(false);
expect(_vm._isDestroyed).toBe(false);
spy();
@@ -341,13 +292,13 @@ describe('Hooks lifecycle', () => {
});
});

describe('destroyed', () => {
describe('unmounted', () => {
it('should be called after destroy', () => {
const spy = jest.fn();
const vm = new Vue({
render() {},
setup(_, { _vm }) {
onDestroyed(() => {
onUnmounted(() => {
expect(_vm._isBeingDestroyed).toBe(true);
expect(_vm._isDestroyed).toBe(true);
spy();
@@ -381,10 +332,8 @@ describe('Hooks lifecycle', () => {
const Child = {
setup(_, { _vm }) {
child = _vm;
onCreated(() => {
err = new Error('child');
throw err;
});
err = new Error('child');
throw err;
},
render() {},
};
@@ -396,9 +345,9 @@ describe('Hooks lifecycle', () => {
render: h => h(Child),
}).$mount();

expect(spy).toHaveBeenCalledWith(err, child, 'created hook');
expect(spy).toHaveBeenCalledWith(err, child, 'data()');
// should propagate by default
expect(globalSpy).toHaveBeenCalledWith(err, child, 'created hook');
expect(globalSpy).toHaveBeenCalledWith(err, child, 'data()');
});
});
});
@@ -1,5 +1,5 @@
const Vue = require('vue/dist/vue.common.js');
const { ref, computed, onCreated, createElement: h } = require('../src');
const { ref, computed, createElement: h } = require('../src');

describe('setup', () => {
beforeEach(() => {
@@ -301,11 +301,11 @@ describe('setup', () => {
setup() {
new Vue({
setup() {
onCreated(() => spy(1));
spy(1);
},
});

onCreated(() => spy(2));
spy(2);
},
});
expect(spy.mock.calls.length).toBe(2);

0 comments on commit 9d8855a

Please sign in to comment.
You can’t perform that action at this time.