feat: pass listeners to functional components (#1036)

Author: eddyerburgh

Diff for: packages/create-instance/create-functional-component.js

@@ -16,15 +16,26 @@ export default function createFunctionalComponent (
     validateSlots(mountingOptions.slots)
   }
 
-  const data = mountingOptions.context ||
-    component.FunctionalRenderContext || {}
-  data.scopedSlots = createScopedSlots(mountingOptions.scopedSlots)
+  const context =
+    mountingOptions.context ||
+    component.FunctionalRenderContext ||
+    {}
+
+  const listeners = mountingOptions.listeners
+
+  if (listeners) {
+    Object.keys(listeners).forEach(key => {
+      context.on[key] = listeners[key]
+    })
+  }
+
+  context.scopedSlots = createScopedSlots(mountingOptions.scopedSlots)
 
   return {
     render (h: Function) {
       return h(
         component,
-        data,
+        context,
         (mountingOptions.context &&
           mountingOptions.context.children &&
           mountingOptions.context.children.map(

Diff for: test/specs/mounting-options/listeners.spec.js

@@ -8,21 +8,48 @@ import {
 import { itDoNotRunIf } from 'conditional-specs'
 
 describeWithShallowAndMount('options.listeners', mountingMethod => {
-  itDoNotRunIf(isRunningPhantomJS, 'handles inherit listeners', () => {
-    if (!listenersSupported) return
-    const aListener = () => {}
-    const wrapper = mountingMethod(
-      compileToFunctions('<p :id="aListener" />'),
-      {
-        listeners: {
-          aListener
+  itDoNotRunIf(
+    isRunningPhantomJS || !listenersSupported,
+    'handles inherit listeners', () => {
+      const aListener = () => {}
+      const wrapper = mountingMethod(
+        compileToFunctions('<p :id="aListener" />'),
+        {
+          listeners: {
+            aListener
+          }
         }
+      )
+
+      expect(wrapper.vm.$listeners.aListener.fns).to.equal(aListener)
+    })
+
+  itDoNotRunIf(
+    isRunningPhantomJS || !listenersSupported,
+    'passes listeners to functional components', () => {
+      const TestComponent = {
+        render (h, ctx) {
+          ctx.listeners.aListener()
+          ctx.listeners.bListener()
+          return h('div')
+        },
+        functional: true
       }
-    )
 
-    expect(wrapper.vm.$listeners.aListener.fns).to.equal(aListener)
-    expect(wrapper.vm.$listeners.aListener.fns).to.equal(aListener)
-  })
+      mountingMethod(
+        TestComponent,
+        {
+          context: {
+            on: {
+              bListener () {}
+            }
+          },
+          listeners: {
+            aListener () {}
+          }
+        }
+      )
+    })
 
   itDoNotRunIf(
     vueVersion < 2.5,