fix: use correct event type for checkbox v-model handler (#1083)

Author: eddyerburgh

flow/modules.flow.js

@@ -23,3 +23,7 @@ declare module 'vue-server-renderer' {
 declare module 'cheerio' {
   declare module.exports: any;
 }
+
+declare module 'semver' {
+  declare module.exports: any;
+}

packages/create-instance/create-instance.js

@@ -4,7 +4,8 @@ import { createSlotVNodes } from './create-slot-vnodes'
 import addMocks from './add-mocks'
 import { addEventLogger } from './log-events'
 import { addStubs } from './add-stubs'
-import { throwError, vueVersion } from 'shared/util'
+import { throwError } from 'shared/util'
+import { VUE_VERSION } from 'shared/consts'
 import {
   compileTemplate,
   compileTemplateForSlots
@@ -42,7 +43,7 @@ export default function createInstance (
   _Vue.options._base = _Vue
 
   if (
-    vueVersion < 2.3 &&
+    VUE_VERSION < 2.3 &&
     typeof component === 'function' &&
     component.options
   ) {
@@ -110,7 +111,7 @@ export default function createInstance (
   if (
     options.provide &&
     typeof options.provide === 'object' &&
-    vueVersion < 2.5
+    VUE_VERSION < 2.5
   ) {
     const obj = { ...options.provide }
     options.provide = () => obj

packages/create-instance/create-scoped-slots.js

@@ -1,7 +1,8 @@
 // @flow
 
 import { compileToFunctions } from 'vue-template-compiler'
-import { throwError, vueVersion } from 'shared/util'
+import { throwError } from 'shared/util'
+import { VUE_VERSION } from 'shared/consts'
 
 function isDestructuringSlotScope (slotScope: string): boolean {
   return slotScope[0] === '{' && slotScope[slotScope.length - 1] === '}'
@@ -39,7 +40,7 @@ function getVueTemplateCompilerHelpers (
 }
 
 function validateEnvironment (): void {
-  if (vueVersion < 2.1) {
+  if (VUE_VERSION < 2.1) {
     throwError(`the scopedSlots option is only supported in vue@2.1+.`)
   }
 }

packages/create-instance/patch-render.js

@@ -1,17 +1,15 @@
 import { createStubFromComponent } from './create-component-stubs'
-import { resolveComponent, semVerGreaterThan } from 'shared/util'
+import { resolveComponent } from 'shared/util'
 import { isReservedTag } from 'shared/validators'
-import Vue from 'vue'
-import { BEFORE_RENDER_LIFECYCLE_HOOK } from 'shared/consts'
+import {
+  BEFORE_RENDER_LIFECYCLE_HOOK,
+  CREATE_ELEMENT_ALIAS
+} from 'shared/consts'
 
 const isWhitelisted = (el, whitelist) => resolveComponent(el, whitelist)
 const isAlreadyStubbed = (el, stubs) => stubs.has(el)
 const isDynamicComponent = cmp => typeof cmp === 'function' && !cmp.cid
 
-const CREATE_ELEMENT_ALIAS = semVerGreaterThan(Vue.version, '2.1.5')
-  ? '_c'
-  : '_h'
-
 function shouldExtend (component, _Vue) {
   return (
     (typeof component === 'function' && !isDynamicComponent(component)) ||

packages/shared/consts.js

@@ -1,18 +1,24 @@
 import Vue from 'vue'
-import { semVerGreaterThan } from './util'
+import semver from 'semver'
 
 export const NAME_SELECTOR = 'NAME_SELECTOR'
 export const COMPONENT_SELECTOR = 'COMPONENT_SELECTOR'
 export const REF_SELECTOR = 'REF_SELECTOR'
 export const DOM_SELECTOR = 'DOM_SELECTOR'
 export const INVALID_SELECTOR = 'INVALID_SELECTOR'
+
 export const VUE_VERSION = Number(
   `${Vue.version.split('.')[0]}.${Vue.version.split('.')[1]}`
 )
+
 export const FUNCTIONAL_OPTIONS =
   VUE_VERSION >= 2.5 ? 'fnOptions' : 'functionalOptions'
 
 export const BEFORE_RENDER_LIFECYCLE_HOOK =
-  semVerGreaterThan(Vue.version, '2.1.8')
+  semver.gt(Vue.version, '2.1.8')
     ? 'beforeCreate'
     : 'beforeMount'
+
+export const CREATE_ELEMENT_ALIAS = semver.gt(Vue.version, '2.1.5')
+  ? '_c'
+  : '_h'

packages/shared/package.json

@@ -2,6 +2,9 @@
   "name": "shared",
   "version": "1.0.0-beta.27",
   "private": true,
+  "dependencies": {
+    "semver": "^5.6.0"
+  },
   "peerDependencies": {
     "vue": "2.x",
     "vue-template-compiler": "^2.x"

packages/shared/util.js

@@ -1,5 +1,6 @@
 // @flow
 import Vue from 'vue'
+import semver from 'semver'
 
 export function throwError (msg: string): void {
   throw new Error(`[vue-test-utils]: ${msg}`)
@@ -31,10 +32,6 @@ const hyphenateRE = /\B([A-Z])/g
 export const hyphenate = (str: string): string =>
   str.replace(hyphenateRE, '-$1').toLowerCase()
 
-export const vueVersion = Number(
-  `${Vue.version.split('.')[0]}.${Vue.version.split('.')[1]}`
-)
-
 function hasOwnProperty (obj, prop) {
   return Object.prototype.hasOwnProperty.call(obj, prop)
 }
@@ -59,16 +56,28 @@ export function resolveComponent (id: string, components: Object) {
   return components[id] || components[camelizedId] || components[PascalCaseId]
 }
 
-export function semVerGreaterThan (a: string, b: string) {
-  const pa = a.split('.')
-  const pb = b.split('.')
-  for (let i = 0; i < 3; i++) {
-    var na = Number(pa[i])
-    var nb = Number(pb[i])
-    if (na > nb) return true
-    if (nb > na) return false
-    if (!isNaN(na) && isNaN(nb)) return true
-    if (isNaN(na) && !isNaN(nb)) return false
+const UA = typeof window !== 'undefined' &&
+  'navigator' in window &&
+  navigator.userAgent.toLowerCase()
+
+export const isPhantomJS = UA && UA.includes &&
+  UA.match(/phantomjs/i)
+
+export const isEdge = UA && UA.indexOf('edge/') > 0
+export const isChrome = UA && /chrome\/\d+/.test(UA) && !isEdge
+
+// get the event used to trigger v-model handler that updates bound data
+export function getCheckedEvent () {
+  const version = Vue.version
+
+  if (semver.satisfies(version, '2.1.9 - 2.1.10')) {
+    return 'click'
+  }
+
+  if (semver.satisfies(version, '2.2 - 2.4')) {
+    return isChrome ? 'click' : 'change'
   }
-  return false
+
+  // change is handler for version 2.0 - 2.1.8, and 2.5+
+  return 'change'
 }

packages/test-utils/src/find.js

@@ -4,9 +4,10 @@ import findDOMNodes from './find-dom-nodes'
 import {
   DOM_SELECTOR,
   REF_SELECTOR,
-  COMPONENT_SELECTOR
+  COMPONENT_SELECTOR,
+  VUE_VERSION
 } from 'shared/consts'
-import { throwError, vueVersion } from 'shared/util'
+import { throwError } from 'shared/util'
 import { matches } from './matches'
 
 export function findAllInstances (rootVm: any) {
@@ -74,7 +75,7 @@ export default function find (
       (selector.value.options &&
       selector.value.options.functional)
     ) &&
-    vueVersion < 2.3
+    VUE_VERSION < 2.3
   ) {
     throwError(
       `find for functional components is not supported ` +