From 06c423634708dceb20e959c34f294dcd154a2237 Mon Sep 17 00:00:00 2001
From: fnlCtrl <fnlctrl@gmail.com>
Date: Fri, 11 Oct 2019 23:56:16 +0800
Subject: [PATCH] feat(v-on): add tests

---
 .../__tests__/transforms/vOn.spec.ts          | 81 +++++++++++++++++++
 packages/compiler-dom/src/transforms/vOn.ts   |  4 +-
 2 files changed, 84 insertions(+), 1 deletion(-)
 create mode 100644 packages/compiler-dom/__tests__/transforms/vOn.spec.ts

diff --git a/packages/compiler-dom/__tests__/transforms/vOn.spec.ts b/packages/compiler-dom/__tests__/transforms/vOn.spec.ts
new file mode 100644
index 00000000000..7f84ec683a8
--- /dev/null
+++ b/packages/compiler-dom/__tests__/transforms/vOn.spec.ts
@@ -0,0 +1,81 @@
+import {
+  parse,
+  transform,
+  CompilerOptions,
+  ElementNode,
+  ObjectExpression,
+  CallExpression,
+  NodeTypes
+} from '@vue/compiler-core'
+import { transformOn } from '../../src/transforms/vOn'
+import { transformElement } from '../../../compiler-core/src/transforms/transformElement'
+import { transformExpression } from '../../../compiler-core/src/transforms/transformExpression'
+
+function parseWithVOn(
+  template: string,
+  options: CompilerOptions = {}
+): ElementNode {
+  const ast = parse(template)
+  transform(ast, {
+    nodeTransforms: [transformExpression, transformElement],
+    directiveTransforms: {
+      on: transformOn
+    },
+    ...options
+  })
+  return ast.children[0] as ElementNode
+}
+
+describe('compiler-dom: transform v-on', () => {
+  it('should support .stop modifier', () => {
+    const node = parseWithVOn(`<div @click.stop="test"/>`, {
+      prefixIdentifiers: true
+    })
+    const props = (node.codegenNode as CallExpression)
+      .arguments[1] as ObjectExpression
+    expect(props.properties[0].value).toMatchObject({
+      type: NodeTypes.COMPOUND_EXPRESSION,
+      children: [
+        `$event => {`,
+        `$event.stopPropagation();`,
+        '(',
+        {
+          content: '_ctx.test',
+          isStatic: false,
+          type: NodeTypes.SIMPLE_EXPRESSION,
+          loc: expect.anything()
+        },
+        ')',
+        '($event)',
+        '}'
+      ]
+    })
+  })
+
+  it('should support muliple modifiers, and ignore unknown modifier', () => {
+    const node = parseWithVOn(`<div @click.stop.prevent.gibberish="test"/>`, {
+      prefixIdentifiers: true
+    })
+    const props = (node.codegenNode as CallExpression)
+      .arguments[1] as ObjectExpression
+    expect(props.properties[0].value).toMatchObject({
+      type: NodeTypes.COMPOUND_EXPRESSION,
+      children: [
+        `$event => {`,
+        `$event.stopPropagation();`,
+        `$event.preventDefault();`,
+        '', // ignored modifier "gibberish"
+        '(',
+        {
+          content: '_ctx.test',
+          isStatic: false,
+          type: NodeTypes.SIMPLE_EXPRESSION,
+          loc: expect.anything()
+        },
+        ')',
+        '($event)',
+        '}'
+      ]
+    })
+  })
+})
diff --git a/packages/compiler-dom/src/transforms/vOn.ts b/packages/compiler-dom/src/transforms/vOn.ts
index da091e9dcc6..6b653c1994c 100644
--- a/packages/compiler-dom/src/transforms/vOn.ts
+++ b/packages/compiler-dom/src/transforms/vOn.ts
@@ -71,8 +71,10 @@ export const transformOn: DirectiveTransform = (
       : EMPTY_ARR),
     `}`
   ])
-  return {
+  let res = {
     props: [createObjectProperty(eventName, exp)],
     needRuntime: false
   }
+  console.log(`result`, JSON.stringify(res.props[0].value, null, 2))
+  return res
 }