Repository: vuejs/vue
Pull request: [next] v-on test


Changed files:
filename: test/unit/features/directives/on.spec.js
patch: @@ -0,0 +1,123 @@
+import Vue from 'vue'
+
+function trigger (target, event, process) {
+  var e = document.createEvent('HTMLEvents')
+  e.initEvent(event, true, true)
+  if (process) process(e)
+  target.dispatchEvent(e)
+  return e
+}
+
+describe('Directive v-on', () => {
+  let spy, spy2
+
+  beforeEach(() => {
+    spy = jasmine.createSpy()
+    spy2 = jasmine.createSpy()
+  })
+
+  it('should bind event to a method', () => {
+    const vm = new Vue({
+      el: '#app',
+      template: '<div v-on:click="foo"></div>',
+      methods: { foo: spy }
+    })
+    const el = vm.$el
+    trigger(el, 'click')
+    expect(spy.calls.count()).toBe(1)
+
+    const args = spy.calls.allArgs()
+    const event = args[0] && args[0][0] || {}
+    expect(event.type).toBe('click')
+  })
+
+  it('should bind event to a inline method', () => {
+    const vm = new Vue({
+      el: '#app',
+      template: '<div v-on:click="foo(1,2,3,$event)"></div>',
+      methods: { foo: spy }
+    })
+    const el = vm.$el
+    trigger(el, 'click')
+    expect(spy.calls.count()).toBe(1)
+
+    const args = spy.calls.allArgs()
+    const firstArgs = args[0]
+    expect(firstArgs.length).toBe(4)
+    expect(firstArgs[0]).toBe(1)
+    expect(firstArgs[1]).toBe(2)
+    expect(firstArgs[2]).toBe(3)
+    expect(firstArgs[3].type).toBe('click')
+  })
+
+  it('should support shorthand', () => {
+    const vm = new Vue({
+      el: '#app',
+      template: '<a href="#test" @click.prevent="foo"></a>',
+      methods: { foo: spy }
+    })
+    const el = vm.$el
+    trigger(el, 'click')
+    expect(spy.calls.count()).toBe(1)
+  })
+
+  it('should support stop propagation', () => {
+    const vm = new Vue({
+      el: '#app',
+      template: `
+        <div @click.stop="foo"></div>
+      `,
+      methods: { foo: spy }
+    })
+    const hash = window.location.hash
+    const el = vm.$el
+    trigger(el, 'click')
+    expect(window.location.hash).toBe(hash)
+  })
+
+  it('should support prevent default', () => {
+    const vm = new Vue({
+      el: '#app',
+      template: `
+        <div @click="bar">
+          <div @click.stop="foo"></div>
+        </div>
+      `,
+      methods: { foo: spy, bar: spy2 }
+    })
+    const el = vm.$el
+    trigger(el.firstChild, 'click')
+    expect(spy).toHaveBeenCalled()
+    expect(spy2).not.toHaveBeenCalled()
+  })
+
+  it('should support capture', () => {
+    const vm = new Vue({
+      el: '#app',
+      template: `
+        <div @click.capture.stop="foo">
+          <div @click="bar"></div>
+        </div>
+      `,
+      methods: { foo: spy, bar: spy2 }
+    })
+    const el = vm.$el
+    trigger(el.firstChild, 'click')
+    expect(spy).toHaveBeenCalled()
+    expect(spy2).not.toHaveBeenCalled()
+  })
+
+  xit('should bind to a child component', () => {
+    Vue.component('bar', {
+      template: '<span>Hello</span>'
+    })
+    const vm = new Vue({
+      el: '#app',
+      template: '<bar @click="foo"></bar>',
+      methods: { foo: spy }
+    })
+    const el = vm.$el
+    trigger(el, 'click')
+    expect(spy.calls.count()).toBe(1)
+  })
+})