github.com/insionng/yougam@v0.0.0-20170714101924-2bc18d833463/public/libs/vue-1.0.24/test/unit/specs/api/events_spec.js (about) 1 var Vue = require('src') 2 3 describe('Events API', function () { 4 var vm, spy 5 beforeEach(function () { 6 vm = new Vue() 7 spy = jasmine.createSpy('emitter') 8 }) 9 10 it('$on', function () { 11 vm.$on('test', function () { 12 // expect correct context 13 expect(this).toBe(vm) 14 spy.apply(this, arguments) 15 }) 16 vm.$emit('test', 1, 2, 3, 4) 17 expect(spy.calls.count()).toBe(1) 18 expect(spy).toHaveBeenCalledWith(1, 2, 3, 4) 19 }) 20 21 it('$once', function () { 22 vm.$once('test', spy) 23 vm.$emit('test', 1, 2, 3) 24 vm.$emit('test', 2, 3, 4) 25 expect(spy.calls.count()).toBe(1) 26 expect(spy).toHaveBeenCalledWith(1, 2, 3) 27 }) 28 29 it('$off', function () { 30 vm.$on('test1', spy) 31 vm.$on('test2', spy) 32 vm.$off() 33 vm.$emit('test1') 34 vm.$emit('test2') 35 expect(spy).not.toHaveBeenCalled() 36 }) 37 38 it('$off event', function () { 39 vm.$on('test1', spy) 40 vm.$on('test2', spy) 41 vm.$off('test1') 42 vm.$off('test1') // test off something that's already off 43 vm.$emit('test1', 1) 44 vm.$emit('test2', 2) 45 expect(spy.calls.count()).toBe(1) 46 expect(spy).toHaveBeenCalledWith(2) 47 }) 48 49 it('$off event + fn', function () { 50 var spy2 = jasmine.createSpy('emitter') 51 vm.$on('test', spy) 52 vm.$on('test', spy2) 53 vm.$off('test', spy) 54 vm.$emit('test', 1, 2, 3) 55 expect(spy).not.toHaveBeenCalled() 56 expect(spy2.calls.count()).toBe(1) 57 expect(spy2).toHaveBeenCalledWith(1, 2, 3) 58 }) 59 60 it('$broadcast', function () { 61 var child1 = new Vue({ parent: vm }) 62 var child2 = new Vue({ parent: vm }) 63 var child3 = new Vue({ parent: child1 }) 64 child1.$on('test', spy) 65 child2.$on('test', spy) 66 child3.$on('test', spy) 67 vm.$broadcast('test') 68 expect(spy.calls.count()).toBe(2) // should not propagate by default 69 }) 70 71 it('$broadcast with propagation', function () { 72 var child1 = new Vue({ parent: vm }) 73 var child2 = new Vue({ parent: vm }) 74 var child3 = new Vue({ parent: child1 }) 75 child1.$on('test', function () { 76 spy() 77 return true 78 }) 79 child2.$on('test', spy) 80 child3.$on('test', spy) 81 vm.$broadcast('test') 82 expect(spy.calls.count()).toBe(3) 83 }) 84 85 it('$broadcast optimization', function () { 86 var child = new Vue({ parent: vm }) 87 var child2 = new Vue({ parent: child }) 88 // hooks should not incurr the bookkeeping cost 89 child.$on('hook:created', function () {}) 90 expect(vm._eventsCount['hook:created']).toBeUndefined() 91 92 function handler () { 93 spy() 94 return true 95 } 96 97 child.$on('test', handler) 98 expect(vm._eventsCount['test']).toBe(1) 99 // child2's $emit & $broadcast 100 // shouldn't get called if no child listens to the event 101 child2.$emit = spy 102 child2.$broadcast = spy 103 vm.$broadcast('test') 104 expect(spy.calls.count()).toBe(1) 105 // check $off bookkeeping 106 child.$off('test', handler) 107 expect(vm._eventsCount['test']).toBe(0) 108 function noop () {} 109 child.$on('test', noop) 110 child2.$on('test', noop) 111 expect(vm._eventsCount['test']).toBe(2) 112 child.$off('test') 113 expect(vm._eventsCount['test']).toBe(1) 114 child.$on('test', noop) 115 child2.$on('test', noop) 116 expect(vm._eventsCount['test']).toBe(3) 117 child.$off() 118 child2.$off() 119 expect(vm._eventsCount['test']).toBe(0) 120 }) 121 122 it('$broadcast cancel', function () { 123 var child = new Vue({ parent: vm }) 124 var child2 = new Vue({ parent: child }) 125 child.$on('test', function () { 126 return false 127 }) 128 child2.$on('test', spy) 129 vm.$broadcast('test') 130 expect(spy).not.toHaveBeenCalled() 131 }) 132 133 it('$dispatch', function () { 134 var child = new Vue({ parent: vm }) 135 var child2 = new Vue({ parent: child }) 136 child2.$on('test', spy) 137 child.$on('test', spy) 138 vm.$on('test', spy) 139 child2.$dispatch('test') 140 expect(spy.calls.count()).toBe(2) // should trigger on self, but not propagate to root 141 }) 142 143 it('$dispatch with propagation', function () { 144 var child = new Vue({ parent: vm }) 145 var child2 = new Vue({ parent: child }) 146 var child3 = new Vue({ parent: child2 }) 147 child.$on('test', function () { 148 spy() 149 return true 150 }) 151 vm.$on('test', spy) 152 child3.$dispatch('test') 153 expect(spy.calls.count()).toBe(2) 154 }) 155 156 it('handle $dispatch by v-on inline-statement', function () { 157 var parent = new Vue({ 158 el: document.createElement('div'), 159 template: '<child1 @test="onTest()" v-ref:child></child1>', 160 methods: { 161 onTest: function () { 162 spy() 163 } 164 }, 165 components: { 166 child1: { 167 template: '<child2 @test="onTest" v-ref:child></child2>', 168 methods: { 169 onTest: function () { 170 spy() 171 } 172 }, 173 components: { 174 child2: { 175 template: '<child3 @test="onTest()" v-ref:child></child3>', 176 methods: { 177 onTest: function () { 178 spy() 179 return true 180 } 181 }, 182 components: { 183 child3: { 184 template: '<child4 @test="onTest" v-ref:child></child4>', 185 methods: { 186 onTest: function () { 187 spy() 188 return true 189 } 190 }, 191 components: { 192 child4: {} 193 } 194 } 195 } 196 } 197 } 198 } 199 } 200 }) 201 parent 202 .$refs.child // child1 203 .$refs.child // child2 204 .$refs.child // child3 205 .$refs.child // child4 206 .$dispatch('test') 207 expect(spy.calls.count()).toBe(3) 208 }) 209 210 it('$dispatch forward on immediate inline component handler', function () { 211 var shouldPropagate = true 212 var parent = new Vue({ 213 el: document.createElement('div'), 214 template: '<child @test="onTest" v-ref:child></child>', 215 events: { 216 test: spy 217 }, 218 methods: { 219 onTest: function () { 220 spy() 221 return shouldPropagate 222 } 223 }, 224 components: { 225 child: {} 226 } 227 }) 228 parent.$refs.child.$dispatch('test') 229 expect(spy.calls.count()).toBe(2) 230 shouldPropagate = false 231 parent.$refs.child.$dispatch('test') 232 expect(spy.calls.count()).toBe(3) 233 }) 234 })