github.com/insionng/yougam@v0.0.0-20170714101924-2bc18d833463/public/libs/vue-1.0.24/test/unit/specs/instance/events_spec.js (about) 1 var Vue = require('src') 2 var _ = require('src/util') 3 4 describe('Instance Events', function () { 5 var spy, spy2 6 beforeEach(function () { 7 spy = jasmine.createSpy() 8 spy2 = jasmine.createSpy() 9 }) 10 11 describe('option events', function () { 12 it('normal events', function () { 13 var vm = new Vue({ 14 events: { 15 test: spy, 16 test2: [spy, spy] 17 } 18 }) 19 vm.$emit('test', 123) 20 expect(spy).toHaveBeenCalledWith(123) 21 vm.$emit('test2') 22 expect(spy.calls.count()).toBe(3) 23 }) 24 25 it('hook events', function () { 26 new Vue({ 27 events: { 28 'hook:created': spy 29 } 30 }) 31 expect(spy).toHaveBeenCalled() 32 }) 33 34 it('method name strings', function () { 35 var vm = new Vue({ 36 events: { 37 test: 'doSomething', 38 test2: 'doSomethingElse' 39 }, 40 methods: { 41 doSomething: spy 42 } 43 }) 44 vm.$emit('test', 123) 45 expect(spy).toHaveBeenCalledWith(123) 46 vm.$emit('test2') 47 expect('Unknown method').toHaveBeenWarned() 48 }) 49 }) 50 51 describe('option watchers', function () { 52 it('normal', function (done) { 53 var spyA = jasmine.createSpy() 54 var spyB = jasmine.createSpy() 55 var count = 0 56 var a = { 57 b: { c: 1 } 58 } 59 var vm = new Vue({ 60 watch: { 61 'a.b.c': spyA, 62 'b + c': spyB, 63 a: { 64 deep: true, 65 immediate: true, 66 handler: 'test' 67 } 68 }, 69 data: { 70 a: a, 71 b: 1, 72 c: 2 73 }, 74 methods: { 75 test: function (val) { 76 count++ 77 expect(val).toBe(a) 78 } 79 } 80 }) 81 vm.a.b.c = 2 82 vm.b = 3 83 vm.c = 4 84 expect(count).toBe(1) 85 _.nextTick(function () { 86 expect(spyA).toHaveBeenCalledWith(2, 1) 87 expect(spyB).toHaveBeenCalledWith(7, 3) 88 expect(count).toBe(2) 89 done() 90 }) 91 }) 92 93 it('method name strings', function (done) { 94 var spy = jasmine.createSpy() 95 var vm = new Vue({ 96 watch: { 97 'a': 'test' 98 }, 99 data: { 100 a: 1 101 }, 102 methods: { 103 test: spy 104 } 105 }) 106 vm.a = 2 107 _.nextTick(function () { 108 expect(spy).toHaveBeenCalledWith(2, 1) 109 done() 110 }) 111 }) 112 }) 113 114 describe('hooks', function () { 115 it('created', function () { 116 var ctx 117 var vm = new Vue({ 118 created: function () { 119 // can't assert this === vm here 120 // because the constructor hasn't returned yet 121 ctx = this 122 // should have observed data 123 expect(this._data.__ob__).toBeTruthy() 124 spy() 125 } 126 }) 127 expect(ctx).toBe(vm) 128 expect(spy).toHaveBeenCalled() 129 }) 130 131 it('beforeDestroy', function () { 132 var vm = new Vue({ 133 beforeDestroy: function () { 134 expect(this).toBe(vm) 135 expect(this._isDestroyed).toBe(false) 136 spy() 137 } 138 }) 139 vm.$destroy() 140 expect(spy).toHaveBeenCalled() 141 }) 142 143 it('destroyed', function () { 144 var vm = new Vue({ 145 destroyed: function () { 146 expect(this).toBe(vm) 147 expect(this._isDestroyed).toBe(true) 148 spy() 149 } 150 }) 151 vm.$destroy() 152 expect(spy).toHaveBeenCalled() 153 }) 154 155 it('beforeCompile', function () { 156 var vm = new Vue({ 157 template: '{{a}}', 158 data: { a: 1 }, 159 beforeCompile: function () { 160 expect(this).toBe(vm) 161 expect(this.$el).toBe(el) 162 expect(this.$el.textContent).toBe('{{a}}') 163 spy() 164 } 165 }) 166 var el = document.createElement('div') 167 vm.$mount(el) 168 expect(spy).toHaveBeenCalled() 169 }) 170 171 it('compiled', function () { 172 var vm = new Vue({ 173 template: '{{a}}', 174 data: { a: 1 }, 175 compiled: function () { 176 expect(this.$el).toBe(el) 177 expect(this.$el.textContent).toBe('1') 178 spy() 179 } 180 }) 181 var el = document.createElement('div') 182 vm.$mount(el) 183 expect(spy).toHaveBeenCalled() 184 }) 185 186 it('ready', function () { 187 var vm = new Vue({ 188 ready: spy 189 }) 190 expect(spy).not.toHaveBeenCalled() 191 var el = document.createElement('div') 192 vm.$mount(el) 193 expect(spy).not.toHaveBeenCalled() 194 vm.$appendTo(document.body) 195 expect(spy).toHaveBeenCalled() 196 vm.$remove() 197 // try mounting on something already in dom 198 el = document.createElement('div') 199 document.body.appendChild(el) 200 vm = new Vue({ 201 el: el, 202 ready: spy2 203 }) 204 expect(spy2).toHaveBeenCalled() 205 vm.$remove() 206 }) 207 208 it('compile v-on on child component', function () { 209 var spy2 = jasmine.createSpy() 210 var vm = new Vue({ 211 el: document.createElement('div'), 212 template: '<comp v-on:hook:created="onCreated" @ready="onReady" @ok="a++"></comp>', 213 data: { 214 a: 0 215 }, 216 methods: { 217 onCreated: spy, 218 onReady: spy 219 }, 220 components: { 221 comp: { 222 compiled: function () { 223 this.$emit('ready', 123) 224 this.$emit('ok') 225 this.$parent.onReady = spy2 226 this.$emit('ready', 234) 227 } 228 } 229 } 230 }) 231 expect(spy.calls.count()).toBe(2) 232 expect(spy).toHaveBeenCalledWith(123) 233 expect(spy2.calls.count()).toBe(1) 234 expect(spy2).toHaveBeenCalledWith(234) 235 expect(vm.a).toBe(1) 236 }) 237 238 it('warn missing handler for child component v-on', function () { 239 new Vue({ 240 el: document.createElement('div'), 241 template: '<comp @test="onThat"></comp>', 242 components: { 243 comp: {} 244 } 245 }) 246 expect('v-on:test="onThat" expects a function value').toHaveBeenWarned() 247 }) 248 249 it('passing $arguments', function () { 250 new Vue({ 251 el: document.createElement('div'), 252 template: '<comp @ready="onReady($arguments[1])"></comp>', 253 methods: { 254 onReady: spy 255 }, 256 components: { 257 comp: { 258 compiled: function () { 259 this.$emit('ready', 123, 1234) 260 } 261 } 262 } 263 }) 264 expect(spy).toHaveBeenCalledWith(1234) 265 }) 266 267 describe('attached/detached', function () { 268 it('in DOM', function () { 269 var el = document.createElement('div') 270 var childEl = document.createElement('div') 271 el.appendChild(childEl) 272 document.body.appendChild(el) 273 var parentVm = new Vue({ 274 el: el, 275 attached: spy, 276 detached: spy2 277 }) 278 var childVm = new Vue({ 279 parent: parentVm, 280 el: childEl, 281 attached: spy, 282 detached: spy2 283 }) 284 expect(spy.calls.count()).toBe(2) 285 parentVm.$remove() 286 expect(spy2.calls.count()).toBe(2) 287 // child should be already detached 288 // so the hook should not fire again 289 childVm.$remove() 290 expect(spy2.calls.count()).toBe(2) 291 }) 292 293 it('create then attach', function () { 294 var el = document.createElement('div') 295 var childEl = document.createElement('div') 296 el.appendChild(childEl) 297 var parentVm = new Vue({ 298 el: el, 299 attached: spy, 300 detached: spy2 301 }) 302 var childVm = new Vue({ 303 parent: parentVm, 304 el: childEl, 305 attached: spy, 306 detached: spy2 307 }) 308 parentVm.$appendTo(document.body) 309 expect(spy.calls.count()).toBe(2) 310 // detach child first 311 childVm.$remove() 312 expect(spy2.calls.count()).toBe(1) 313 // should only fire parent detach 314 parentVm.$remove() 315 expect(spy2.calls.count()).toBe(2) 316 }) 317 318 it('should not fire on detached child', function () { 319 var el = document.createElement('div') 320 var childEl = document.createElement('div') 321 var parentVm = new Vue({ 322 el: el, 323 attached: spy 324 }) 325 var childVm = new Vue({ 326 parent: parentVm, 327 el: childEl, 328 attached: spy 329 }) 330 parentVm.$appendTo(document.body) 331 expect(spy.calls.count()).toBe(1) 332 childVm.$appendTo(el) 333 expect(spy.calls.count()).toBe(2) 334 }) 335 }) 336 }) 337 })