flowtype reafactoring (#4945)

src/core/components/keep-alive.js

@@ -3,6 +3,8 @@
 import { callHook } from 'core/instance/lifecycle'
 import { getFirstComponentChild } from 'core/vdom/helpers/index'
 
+type VNodeCache = { [key: string]: ?VNode };
+
 const patternTypes: Array<Function> = [String, RegExp]
 
 function getComponentName (opts: ?VNodeComponentOptions): ?string {
@@ -19,11 +21,11 @@ function matches (pattern: string | RegExp, name: string): boolean {
   return false
 }
 
-function pruneCache (cache, filter) {
+function pruneCache (cache: VNodeCache, filter: Function) {
   for (const key in cache) {
-    const cachedNode = cache[key]
+    const cachedNode: ?VNode = cache[key]
     if (cachedNode) {
-      const name = getComponentName(cachedNode.componentOptions)
+      const name: ?string = getComponentName(cachedNode.componentOptions)
       if (name && !filter(name)) {
         pruneCacheEntry(cachedNode)
         cache[key] = null
@@ -32,7 +34,7 @@ function pruneCache (cache, filter) {
   }
 }
 
-function pruneCacheEntry (vnode: ?MountedComponentVNode) {
+function pruneCacheEntry (vnode: ?VNode) {
   if (vnode) {
     if (!vnode.componentInstance._inactive) {
       callHook(vnode.componentInstance, 'deactivated')
@@ -71,17 +73,17 @@ export default {
 
   render () {
     const vnode: VNode = getFirstComponentChild(this.$slots.default)
-    const componentOptions = vnode && vnode.componentOptions
+    const componentOptions: ?VNodeComponentOptions = vnode && vnode.componentOptions
     if (componentOptions) {
       // check pattern
-      const name = getComponentName(componentOptions)
+      const name: ?string = getComponentName(componentOptions)
       if (name && (
         (this.include && !matches(this.include, name)) ||
         (this.exclude && matches(this.exclude, name))
       )) {
         return vnode
       }
-      const key = vnode.key == null
+      const key: ?string = vnode.key == null
         // same constructor may get registered as different local components
         // so cid alone is not enough (#3269)
         ? componentOptions.Ctor.cid + (componentOptions.tag ? `::${componentOptions.tag}` : '')

src/core/vdom/helpers/index.js

@@ -4,6 +4,6 @@ export * from './merge-hook'
 export * from './update-listeners'
 export * from './normalize-children'
 
-export function getFirstComponentChild (children: ?Array<any>): ?VNodeWithData {
+export function getFirstComponentChild (children: ?Array<VNode>): ?VNode {
-  return children && children.filter(c => c && c.componentOptions)[0]
+  return children && children.filter((c: VNode) => c && c.componentOptions)[0]
 }

src/core/vdom/helpers/merge-hook.js

@@ -2,10 +2,10 @@
 
 export function mergeVNodeHook (def: Object, hookKey: string, hook: Function, key: string) {
   key = key + hookKey
-  const injectedHash = def.__injected || (def.__injected = {})
+  const injectedHash: Object = def.__injected || (def.__injected = {})
   if (!injectedHash[key]) {
     injectedHash[key] = true
-    const oldHook = def[hookKey]
+    const oldHook: ?Function = def[hookKey]
     if (oldHook) {
       def[hookKey] = function () {
         oldHook.apply(this, arguments)

src/platforms/web/runtime/components/transition-group.js

@@ -34,35 +34,33 @@ export default {
   props,
 
   render (h: Function) {
-    const tag = this.tag || this.$vnode.data.tag || 'span'
+    const tag: string = this.tag || this.$vnode.data.tag || 'span'
-    const map = Object.create(null)
+    const map: Object = Object.create(null)
-    const prevChildren = this.prevChildren = this.children
+    const prevChildren: Array<VNode> = this.prevChildren = this.children
-    const rawChildren = this.$slots.default || []
+    const rawChildren: Array<VNode> = this.$slots.default || []
-    const children = this.children = []
+    const children: Array<VNode> = this.children = []
-    const transitionData = extractTransitionData(this)
+    const transitionData: Object = extractTransitionData(this)
 
     for (let i = 0; i < rawChildren.length; i++) {
-      const c = rawChildren[i]
+      const c: VNode = rawChildren[i]
       if (c.tag) {
         if (c.key != null && String(c.key).indexOf('__vlist') !== 0) {
           children.push(c)
           map[c.key] = c
           ;(c.data || (c.data = {})).transition = transitionData
         } else if (process.env.NODE_ENV !== 'production') {
-          const opts = c.componentOptions
+          const opts: ?VNodeComponentOptions = c.componentOptions
-          const name = opts
+          const name: string = opts ? (opts.Ctor.options.name || opts.tag || '') : c.tag
-            ? (opts.Ctor.options.name || opts.tag)
-            : c.tag
           warn(`<transition-group> children must be keyed: <${name}>`)
         }
       }
     }
 
     if (prevChildren) {
-      const kept = []
+      const kept: Array<VNode> = []
-      const removed = []
+      const removed: Array<VNode> = []
       for (let i = 0; i < prevChildren.length; i++) {
-        const c = prevChildren[i]
+        const c: VNode = prevChildren[i]
         c.data.transition = transitionData
         c.data.pos = c.elm.getBoundingClientRect()
         if (map[c.key]) {
@@ -90,8 +88,8 @@ export default {
   },
 
   updated () {
-    const children = this.prevChildren
+    const children: Array<VNode> = this.prevChildren
-    const moveClass = this.moveClass || ((this.name || 'v') + '-move')
+    const moveClass: string = this.moveClass || ((this.name || 'v') + '-move')
     if (!children.length || !this.hasMove(children[0].elm, moveClass)) {
       return
     }
@@ -104,12 +102,12 @@ export default {
 
     // force reflow to put everything in position
     const body: any = document.body
-    const f = body.offsetHeight // eslint-disable-line
+    const f: number = body.offsetHeight // eslint-disable-line
 
-    children.forEach(c => {
+    children.forEach((c: VNode) => {
       if (c.data.moved) {
-        var el = c.elm
+        var el: any = c.elm
-        var s = el.style
+        var s: any = el.style
         addTransitionClass(el, moveClass)
         s.transform = s.WebkitTransform = s.transitionDuration = ''
         el.addEventListener(transitionEndEvent, el._moveCb = function cb (e) {
@@ -137,21 +135,21 @@ export default {
       // transition at this very moment, we make a clone of it and remove
       // all other transition classes applied to ensure only the move class
       // is applied.
-      const clone = el.cloneNode()
+      const clone: HTMLElement = el.cloneNode()
       if (el._transitionClasses) {
-        el._transitionClasses.forEach(cls => { removeClass(clone, cls) })
+        el._transitionClasses.forEach((cls: string) => { removeClass(clone, cls) })
       }
       addClass(clone, moveClass)
       clone.style.display = 'none'
       this.$el.appendChild(clone)
-      const info = getTransitionInfo(clone)
+      const info: Object = getTransitionInfo(clone)
       this.$el.removeChild(clone)
       return (this._hasMove = info.hasTransform)
     }
   }
 }
 
-function callPendingCbs (c) {
+function callPendingCbs (c: VNode) {
   /* istanbul ignore if */
   if (c.elm._moveCb) {
     c.elm._moveCb()
@@ -162,11 +160,11 @@ function callPendingCbs (c) {
   }
 }
 
-function recordPosition (c) {
+function recordPosition (c: VNode) {
   c.data.newPos = c.elm.getBoundingClientRect()
 }
 
-function applyTranslation (c) {
+function applyTranslation (c: VNode) {
   const oldPos = c.data.pos
   const newPos = c.data.newPos
   const dx = oldPos.left - newPos.left

src/platforms/web/runtime/components/transition.js

@@ -28,7 +28,7 @@ export const transitionProps = {
 // in case the child is also an abstract component, e.g. <keep-alive>
 // we want to recursively retrieve the real component to be rendered
 function getRealChild (vnode: ?VNode): ?VNode {
-  const compOptions = vnode && vnode.componentOptions
+  const compOptions: ?VNodeComponentOptions = vnode && vnode.componentOptions
   if (compOptions && compOptions.Ctor.options.abstract) {
     return getRealChild(getFirstComponentChild(compOptions.children))
   } else {
@@ -38,27 +38,27 @@ function getRealChild (vnode: ?VNode): ?VNode {
 
 export function extractTransitionData (comp: Component): Object {
   const data = {}
-  const options = comp.$options
+  const options: ComponentOptions = comp.$options
   // props
   for (const key in options.propsData) {
     data[key] = comp[key]
   }
   // events.
   // extract listeners and pass them directly to the transition methods
-  const listeners = options._parentListeners
+  const listeners: ?Object = options._parentListeners
   for (const key in listeners) {
     data[camelize(key)] = listeners[key].fn
   }
   return data
 }
 
-function placeholder (h, rawChild) {
+function placeholder (h: Function, rawChild: VNode): ?VNode {
   return /\d-keep-alive$/.test(rawChild.tag)
     ? h('keep-alive')
     : null
 }
 
-function hasParentTransition (vnode) {
+function hasParentTransition (vnode: VNode): ?boolean {
   while ((vnode = vnode.parent)) {
     if (vnode.data.transition) {
       return true
@@ -66,7 +66,7 @@ function hasParentTransition (vnode) {
   }
 }
 
-function isSameChild (child, oldChild) {
+function isSameChild (child: VNode, oldChild: VNode): boolean {
   return oldChild.key === child.key && oldChild.tag === child.tag
 }
 
@@ -76,13 +76,13 @@ export default {
   abstract: true,
 
   render (h: Function) {
-    let children = this.$slots.default
+    let children: ?Array<VNode> = this.$slots.default
     if (!children) {
       return
     }
 
     // filter out text nodes (possible whitespaces)
-    children = children.filter(c => c.tag)
+    children = children.filter((c: VNode) => c.tag)
     /* istanbul ignore if */
     if (!children.length) {
       return
@@ -97,7 +97,7 @@ export default {
       )
     }
 
-    const mode = this.mode
+    const mode: string = this.mode
 
     // warn invalid mode
     if (process.env.NODE_ENV !== 'production' &&
@@ -108,7 +108,7 @@ export default {
       )
     }
 
-    const rawChild = children[0]
+    const rawChild: VNode = children[0]
 
     // if this is a component root node and the component's
     // parent container node also has transition, skip.
@@ -118,7 +118,7 @@ export default {
 
     // apply transition data to child
     // use getRealChild() to ignore abstract components e.g. keep-alive
-    const child = getRealChild(rawChild)
+    const child: ?VNode = getRealChild(rawChild)
     /* istanbul ignore if */
     if (!child) {
       return rawChild
@@ -131,15 +131,15 @@ export default {
     // ensure a key that is unique to the vnode type and to this transition
     // component instance. This key will be used to remove pending leaving nodes
     // during entering.
-    const id = `__transition-${this._uid}-`
+    const id: string = `__transition-${this._uid}-`
-    const key = child.key = child.key == null
+    const key: string = child.key = child.key == null
       ? id + child.tag
       : isPrimitive(child.key)
         ? (String(child.key).indexOf(id) === 0 ? child.key : id + child.key)
         : child.key
-    const data = (child.data || (child.data = {})).transition = extractTransitionData(this)
+    const data: Object = (child.data || (child.data = {})).transition = extractTransitionData(this)
-    const oldRawChild = this._vnode
+    const oldRawChild: VNode = this._vnode
-    const oldChild: any = getRealChild(oldRawChild)
+    const oldChild: VNode = getRealChild(oldRawChild)
 
     // mark v-show
     // so that the transition module can hand over the control to the directive
@@ -150,7 +150,7 @@ export default {
     if (oldChild && oldChild.data && !isSameChild(child, oldChild)) {
       // replace old child transition data with fresh one
       // important for dynamic transitions!
-      const oldData = oldChild && (oldChild.data.transition = extend({}, data))
+      const oldData: Object = oldChild && (oldChild.data.transition = extend({}, data))
       // handle transition mode
       if (mode === 'out-in') {
         // return placeholder node and queue update when leave finishes
@@ -161,8 +161,8 @@ export default {
         }, key)
         return placeholder(h, rawChild)
       } else if (mode === 'in-out') {
-        var delayedLeave
+        let delayedLeave
-        var performLeave = () => { delayedLeave() }
+        const performLeave = () => { delayedLeave() }
         mergeVNodeHook(data, 'afterEnter', performLeave, key)
         mergeVNodeHook(data, 'enterCancelled', performLeave, key)
         mergeVNodeHook(oldData, 'delayLeave', leave => {

src/platforms/web/runtime/transition-util.js

@@ -88,7 +88,7 @@ export function whenTransitionEnds (
 ) {
   const { type, timeout, propCount } = getTransitionInfo(el, expectedType)
   if (!type) return cb()
-  const event = type === TRANSITION ? transitionEndEvent : animationEndEvent
+  const event: string = type === TRANSITION ? transitionEndEvent : animationEndEvent
   let ended = 0
   const end = () => {
     el.removeEventListener(event, onEnd)
@@ -117,15 +117,15 @@ export function getTransitionInfo (el: Element, expectedType?: ?string): {
   timeout: number;
   hasTransform: boolean;
 } {
-  const styles = window.getComputedStyle(el)
+  const styles: any = window.getComputedStyle(el)
-  const transitioneDelays = styles[transitionProp + 'Delay'].split(', ')
+  const transitioneDelays: Array<string> = styles[transitionProp + 'Delay'].split(', ')
-  const transitionDurations = styles[transitionProp + 'Duration'].split(', ')
+  const transitionDurations: Array<string> = styles[transitionProp + 'Duration'].split(', ')
-  const transitionTimeout = getTimeout(transitioneDelays, transitionDurations)
+  const transitionTimeout: number = getTimeout(transitioneDelays, transitionDurations)
-  const animationDelays = styles[animationProp + 'Delay'].split(', ')
+  const animationDelays: Array<string> = styles[animationProp + 'Delay'].split(', ')
-  const animationDurations = styles[animationProp + 'Duration'].split(', ')
+  const animationDurations: Array<string> = styles[animationProp + 'Duration'].split(', ')
-  const animationTimeout = getTimeout(animationDelays, animationDurations)
+  const animationTimeout: number = getTimeout(animationDelays, animationDurations)
 
-  let type
+  let type: ?string
   let timeout = 0
   let propCount = 0
   /* istanbul ignore if */
@@ -154,7 +154,7 @@ export function getTransitionInfo (el: Element, expectedType?: ?string): {
         : animationDurations.length
       : 0
   }
-  const hasTransform =
+  const hasTransform: boolean =
     type === TRANSITION &&
     transformRE.test(styles[transitionProp + 'Property'])
   return {