fix(v-on): transform click.right and click.middle modifiers

fix #735

packages/compiler-dom/src/transforms/vOn.ts

@@ -5,7 +5,9 @@ import {
   createCallExpression,
   createObjectExpression,
   createSimpleExpression,
-  NodeTypes
+  NodeTypes,
+  createCompoundExpression,
+  ExpressionNode
 } from '@vue/compiler-core'
 import { V_ON_WITH_MODIFIERS, V_ON_WITH_KEYS } from '../runtimeHelpers'
 import { makeMap } from '@vue/shared'
@@ -52,6 +54,24 @@ const generateModifiers = (modifiers: string[]) => {
   }
 }
 
+const transformClick = (key: ExpressionNode, event: string) => {
+  const isStaticClick =
+    key.type === NodeTypes.SIMPLE_EXPRESSION &&
+    key.isStatic &&
+    key.content.toLowerCase() === 'onclick'
+  return isStaticClick
+    ? createSimpleExpression(event, true)
+    : key.type !== NodeTypes.SIMPLE_EXPRESSION
+      ? createCompoundExpression([
+          `(`,
+          key,
+          `).toLowerCase() === "onclick" ? "${event}" : (`,
+          key,
+          `)`
+        ])
+      : key
+}
+
 export const transformOn: DirectiveTransform = (dir, node, context) => {
   return baseTransform(dir, node, context, baseResult => {
     const { modifiers } = dir
@@ -64,6 +84,14 @@ export const transformOn: DirectiveTransform = (dir, node, context) => {
       eventOptionModifiers
     } = generateModifiers(modifiers)
 
+    // normalize click.right and click.middle since they don't actually fire
+    if (nonKeyModifiers.includes('right')) {
+      key = transformClick(key, `onContextmenu`)
+    }
+    if (nonKeyModifiers.includes('middle')) {
+      key = transformClick(key, `onMouseup`)
+    }
+
     if (nonKeyModifiers.length) {
       handlerExp = createCallExpression(context.helper(V_ON_WITH_MODIFIERS), [
         handlerExp,