on.spec.ts — vue Source File

Source Code

import Vue from 'vue'
import { supportsPassive } from 'core/util/env'
import { SpyInstanceFn } from 'vitest'

describe('Directive v-on', () => {
  let vm, spy: SpyInstanceFn, el: HTMLElement

  beforeEach(() => {
    vm = null
    spy = vi.fn()
    el = document.createElement('div')
    document.body.appendChild(el)
  })

  afterEach(() => {
    if (vm) {
      document.body.removeChild(vm.$el)
    }
  })

  it('should bind event to a method', () => {
    vm = new Vue({
      el,
      template: '<div v-on:click="foo"></div>',
      methods: { foo: spy }
    })
    triggerEvent(vm.$el, 'click')
    expect(spy.mock.calls.length).toBe(1)

    const args = spy.mock.calls
    const event = (args[0] && args[0][0]) || {}
    expect(event.type).toBe('click')
  })

  it('should bind event to an inline statement', () => {
    vm = new Vue({
      el,
      template: '<div v-on:click="foo(1,2,3,$event)"></div>',
      methods: { foo: spy }
    })
    triggerEvent(vm.$el, 'click')
    expect(spy.mock.calls.length).toBe(1)

    const args = spy.mock.calls
    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 inline function expression', () => {
    const spy = vi.fn()
    vm = new Vue({
      el,
      template: `<div class="test" @click="function (e) { log(e.target.className) }"></div>`,
      methods: {
        log: spy
      }
// ... (1152 more lines)