Browse Source

remove vm argument in transition hooks

dev
Evan You 8 years ago
parent
commit
e94ad1437e
  1. 22
      src/platforms/web/runtime/modules/transition.js
  2. 36
      test/unit/features/transition/transition.spec.js

22
src/platforms/web/runtime/modules/transition.js

@ -38,7 +38,6 @@ export function nextFrame (fn: Function) {
export function enter (vnode: VNodeWithData) { export function enter (vnode: VNodeWithData) {
const el: any = vnode.elm const el: any = vnode.elm
const vm = vnode.context
// call leave callback now // call leave callback now
if (el._leaveCb) { if (el._leaveCb) {
@ -84,7 +83,7 @@ export function enter (vnode: VNodeWithData) {
enterHook && enterHook &&
// enterHook may be a bound method which exposes // enterHook may be a bound method which exposes
// the length of original fn as _length // the length of original fn as _length
(enterHook._length || enterHook.length) > 2 (enterHook._length || enterHook.length) > 1
const cb = el._enterCb = once(() => { const cb = el._enterCb = once(() => {
if (expectsCSS) { if (expectsCSS) {
@ -94,9 +93,9 @@ export function enter (vnode: VNodeWithData) {
if (expectsCSS) { if (expectsCSS) {
removeTransitionClass(el, startClass) removeTransitionClass(el, startClass)
} }
enterCancelledHook && enterCancelledHook(el, vm) enterCancelledHook && enterCancelledHook(el)
} else { } else {
afterEnterHook && afterEnterHook(el, vm) afterEnterHook && afterEnterHook(el)
} }
el._enterCb = null el._enterCb = null
}) })
@ -108,11 +107,11 @@ export function enter (vnode: VNodeWithData) {
if (pendingNode && pendingNode.tag === vnode.tag && pendingNode.elm._leaveCb) { if (pendingNode && pendingNode.tag === vnode.tag && pendingNode.elm._leaveCb) {
pendingNode.elm._leaveCb() pendingNode.elm._leaveCb()
} }
enterHook && enterHook(el, vm, cb) enterHook && enterHook(el, cb)
}) })
// start enter transition // start enter transition
beforeEnterHook && beforeEnterHook(el, vm) beforeEnterHook && beforeEnterHook(el)
if (expectsCSS) { if (expectsCSS) {
addTransitionClass(el, startClass) addTransitionClass(el, startClass)
addTransitionClass(el, activeClass) addTransitionClass(el, activeClass)
@ -131,7 +130,6 @@ export function enter (vnode: VNodeWithData) {
export function leave (vnode: VNodeWithData, rm: Function) { export function leave (vnode: VNodeWithData, rm: Function) {
const el: any = vnode.elm const el: any = vnode.elm
const vm = vnode.context
// call enter callback now // call enter callback now
if (el._enterCb) { if (el._enterCb) {
@ -160,7 +158,7 @@ export function leave (vnode: VNodeWithData, rm: Function) {
leave && leave &&
// leave hook may be a bound method which exposes // leave hook may be a bound method which exposes
// the length of original fn as _length // the length of original fn as _length
(leave._length || leave.length) > 2 (leave._length || leave.length) > 1
const cb = el._leaveCb = once(() => { const cb = el._leaveCb = once(() => {
if (el.parentNode && el.parentNode._pending) { if (el.parentNode && el.parentNode._pending) {
@ -173,10 +171,10 @@ export function leave (vnode: VNodeWithData, rm: Function) {
if (expectsCSS) { if (expectsCSS) {
removeTransitionClass(el, leaveClass) removeTransitionClass(el, leaveClass)
} }
leaveCancelled && leaveCancelled(el, vm) leaveCancelled && leaveCancelled(el)
} else { } else {
rm() rm()
afterLeave && afterLeave(el, vm) afterLeave && afterLeave(el)
} }
el._leaveCb = null el._leaveCb = null
}) })
@ -192,7 +190,7 @@ export function leave (vnode: VNodeWithData, rm: Function) {
if (!vnode.data.show) { if (!vnode.data.show) {
(el.parentNode._pending || (el.parentNode._pending = {}))[vnode.key] = vnode (el.parentNode._pending || (el.parentNode._pending = {}))[vnode.key] = vnode
} }
beforeLeave && beforeLeave(el, vm) beforeLeave && beforeLeave(el)
if (expectsCSS) { if (expectsCSS) {
addTransitionClass(el, leaveClass) addTransitionClass(el, leaveClass)
addTransitionClass(el, leaveActiveClass) addTransitionClass(el, leaveActiveClass)
@ -203,7 +201,7 @@ export function leave (vnode: VNodeWithData, rm: Function) {
} }
}) })
} }
leave && leave(el, vm, cb) leave && leave(el, cb)
if (!expectsCSS && !userWantsControl) { if (!expectsCSS && !userWantsControl) {
cb() cb()
} }

36
test/unit/features/transition/transition.spec.js

@ -4,7 +4,7 @@ import { isIE9 } from 'web/util/index'
import { nextFrame } from 'web/runtime/modules/transition' import { nextFrame } from 'web/runtime/modules/transition'
if (!isIE9) { if (!isIE9) {
describe('Transition system', () => { fdescribe('Transition system', () => {
const duration = injectStyles() const duration = injectStyles()
let el let el
@ -203,23 +203,23 @@ if (!isIE9) {
`, `,
data: { ok: true }, data: { ok: true },
methods: { methods: {
beforeLeave: (el, vm) => { beforeLeave: (el) => {
expect(el).toBe(vm.$el.children[0]) expect(el).toBe(vm.$el.children[0])
expect(el.className).toBe('test') expect(el.className).toBe('test')
beforeLeaveSpy(el, vm) beforeLeaveSpy(el)
}, },
leave: (el, vm) => onLeaveSpy(el, vm), leave: (el) => onLeaveSpy(el),
afterLeave: (el, vm) => afterLeaveSpy(el, vm), afterLeave: (el) => afterLeaveSpy(el),
beforeEnter: (el, vm) => { beforeEnter: (el) => {
expect(vm.$el.contains(el)).toBe(false) expect(vm.$el.contains(el)).toBe(false)
expect(el.className).toBe('test') expect(el.className).toBe('test')
beforeEnterSpy(el, vm) beforeEnterSpy(el)
}, },
enter: (el, vm) => { enter: (el) => {
expect(vm.$el.contains(el)).toBe(true) expect(vm.$el.contains(el)).toBe(true)
onEnterSpy(el, vm) onEnterSpy(el)
}, },
afterEnter: (el, vm) => afterEnterSpy(el, vm) afterEnter: (el) => afterEnterSpy(el)
} }
}).$mount(el) }).$mount(el)
@ -229,26 +229,26 @@ if (!isIE9) {
let _el = vm.$el.children[0] let _el = vm.$el.children[0]
vm.ok = false vm.ok = false
waitForUpdate(() => { waitForUpdate(() => {
expect(beforeLeaveSpy).toHaveBeenCalledWith(_el, vm) expect(beforeLeaveSpy).toHaveBeenCalledWith(_el)
expect(onLeaveSpy).toHaveBeenCalledWith(_el, vm) expect(onLeaveSpy).toHaveBeenCalledWith(_el)
expect(vm.$el.children[0].className).toBe('test test-leave test-leave-active') expect(vm.$el.children[0].className).toBe('test test-leave test-leave-active')
}).thenWaitFor(nextFrame).then(() => { }).thenWaitFor(nextFrame).then(() => {
expect(afterLeaveSpy).not.toHaveBeenCalled() expect(afterLeaveSpy).not.toHaveBeenCalled()
expect(vm.$el.children[0].className).toBe('test test-leave-active') expect(vm.$el.children[0].className).toBe('test test-leave-active')
}).thenWaitFor(duration + 10).then(() => { }).thenWaitFor(duration + 10).then(() => {
expect(afterLeaveSpy).toHaveBeenCalledWith(_el, vm) expect(afterLeaveSpy).toHaveBeenCalledWith(_el)
expect(vm.$el.children.length).toBe(0) expect(vm.$el.children.length).toBe(0)
vm.ok = true vm.ok = true
}).then(() => { }).then(() => {
_el = vm.$el.children[0] _el = vm.$el.children[0]
expect(beforeEnterSpy).toHaveBeenCalledWith(_el, vm) expect(beforeEnterSpy).toHaveBeenCalledWith(_el)
expect(onEnterSpy).toHaveBeenCalledWith(_el, vm) expect(onEnterSpy).toHaveBeenCalledWith(_el)
expect(vm.$el.children[0].className).toBe('test test-enter test-enter-active') expect(vm.$el.children[0].className).toBe('test test-enter test-enter-active')
}).thenWaitFor(nextFrame).then(() => { }).thenWaitFor(nextFrame).then(() => {
expect(afterEnterSpy).not.toHaveBeenCalled() expect(afterEnterSpy).not.toHaveBeenCalled()
expect(vm.$el.children[0].className).toBe('test test-enter-active') expect(vm.$el.children[0].className).toBe('test test-enter-active')
}).thenWaitFor(duration + 10).then(() => { }).thenWaitFor(duration + 10).then(() => {
expect(afterEnterSpy).toHaveBeenCalledWith(_el, vm) expect(afterEnterSpy).toHaveBeenCalledWith(_el)
expect(vm.$el.children[0].className).toBe('test') expect(vm.$el.children[0].className).toBe('test')
}).then(done) }).then(done)
}) })
@ -263,10 +263,10 @@ if (!isIE9) {
</div>`, </div>`,
data: { ok: true }, data: { ok: true },
methods: { methods: {
enter: (el, vm, cb) => { enter: (el, cb) => {
next = cb next = cb
}, },
leave: (el, vm, cb) => { leave: (el, cb) => {
next = cb next = cb
} }
} }

Loading…
Cancel
Save