refactor(v-on): avoid empty modifier guard with only key modifier

packages/runtime-dom/__tests__/directives/vOn.spec.ts

@@ -1,5 +1,5 @@
 import { patchEvent } from '../../src/modules/events'
-import { vOnModifiersGuard, vOnKeysGuard } from '@vue/runtime-dom'
+import { withModifiers, withKeys } from '@vue/runtime-dom'
 
 function triggerEvent(
   target: Element,
@@ -21,7 +21,7 @@ describe('runtime-dom: v-on directive', () => {
     const parent = document.createElement('div')
     const child = document.createElement('input')
     parent.appendChild(child)
-    const childNextValue = vOnModifiersGuard(jest.fn(), ['prevent', 'stop'])
+    const childNextValue = withModifiers(jest.fn(), ['prevent', 'stop'])
     patchEvent(child, 'click', null, childNextValue, null)
     const parentNextValue = jest.fn()
     patchEvent(parent, 'click', null, parentNextValue, null)
@@ -34,7 +34,7 @@ describe('runtime-dom: v-on directive', () => {
     const child = document.createElement('input')
     parent.appendChild(child)
     const fn = jest.fn()
-    const handler = vOnModifiersGuard(fn, ['self'])
+    const handler = withModifiers(fn, ['self'])
     patchEvent(parent, 'click', null, handler, null)
     triggerEvent(child, 'click')
     expect(fn).not.toBeCalled()
@@ -44,7 +44,7 @@ describe('runtime-dom: v-on directive', () => {
     const el = document.createElement('div')
     const fn = jest.fn()
     // <div @keyup.ctrl.esc="test"/>
-    const nextValue = vOnKeysGuard(vOnModifiersGuard(fn, ['ctrl']), ['esc'])
+    const nextValue = withKeys(withModifiers(fn, ['ctrl']), ['esc'])
     patchEvent(el, 'keyup', null, nextValue, null)
     triggerEvent(el, 'keyup', e => (e.key = 'a'))
     expect(fn).not.toBeCalled()
@@ -64,7 +64,7 @@ describe('runtime-dom: v-on directive', () => {
     const el = document.createElement('div')
     // Case 1: <div @keyup.exact="test"/>
     const fn1 = jest.fn()
-    const next1 = vOnModifiersGuard(fn1, ['exact'])
+    const next1 = withModifiers(fn1, ['exact'])
     patchEvent(el, 'keyup', null, next1, null)
     triggerEvent(el, 'keyup')
     expect(fn1.mock.calls.length).toBe(1)
@@ -72,7 +72,7 @@ describe('runtime-dom: v-on directive', () => {
     expect(fn1.mock.calls.length).toBe(1)
     // Case 2: <div @keyup.ctrl.a.exact="test"/>
     const fn2 = jest.fn()
-    const next2 = vOnKeysGuard(vOnModifiersGuard(fn2, ['ctrl', 'exact']), ['a'])
+    const next2 = withKeys(withModifiers(fn2, ['ctrl', 'exact']), ['a'])
     patchEvent(el, 'keyup', null, next2, null)
     triggerEvent(el, 'keyup', e => (e.key = 'a'))
     expect(fn2).not.toBeCalled()
@@ -96,7 +96,7 @@ describe('runtime-dom: v-on directive', () => {
     buttons.forEach(button => {
       const el = document.createElement('div')
       const fn = jest.fn()
-      const handler = vOnModifiersGuard(fn, [button])
+      const handler = withModifiers(fn, [button])
       patchEvent(el, 'mousedown', null, handler, null)
       buttons.filter(b => b !== button).forEach(button => {
         triggerEvent(el, 'mousedown', e => (e.button = buttonCodes[button]))

packages/runtime-dom/src/directives/vOn.ts

@@ -1,6 +1,6 @@
 const systemModifiers = ['ctrl', 'shift', 'alt', 'meta']
 
-type KeyedEvent = KeyboardEvent | MouseEvent | TouchEvent;
+type KeyedEvent = KeyboardEvent | MouseEvent | TouchEvent
 
 const modifierGuards: Record<
   string,
@@ -20,7 +20,7 @@ const modifierGuards: Record<
     systemModifiers.some(m => (e as any)[`${m}Key`] && !modifiers.includes(m))
 }
 
-export const vOnModifiersGuard = (fn: Function, modifiers: string[]) => {
+export const withModifiers = (fn: Function, modifiers: string[]) => {
   return (event: Event) => {
     for (let i = 0; i < modifiers.length; i++) {
       const guard = modifierGuards[modifiers[i]]
@@ -42,7 +42,7 @@ const keyNames: Record<string, string | string[]> = {
   delete: 'backspace'
 }
 
-export const vOnKeysGuard = (fn: Function, modifiers: string[]) => {
+export const withKeys = (fn: Function, modifiers: string[]) => {
   return (event: KeyboardEvent) => {
     if (!('key' in event)) return
     const eventKey = event.key.toLowerCase()

packages/runtime-dom/src/index.ts

@@ -31,7 +31,7 @@ export {
   vModelDynamic
 } from './directives/vModel'
 
-export { vOnModifiersGuard, vOnKeysGuard } from './directives/vOn'
+export { withModifiers, withKeys } from './directives/vOn'
 
 // re-export everything from core
 // h, Component, reactivity API, nextTick, flags & types