vue 2.6.13 → 2.7.0-alpha.2

package/src/platforms/web/runtime/modules/{class.js → class.ts}

@@ -1,28 +1,17 @@
-/* @flow */
+import { isDef, isUndef } from 'shared/util'
+import type { VNodeData } from 'types/vnode'
 
-import {
-  isDef,
-  isUndef
-} from 'shared/util'
+import { concat, stringifyClass, genClassForVnode } from 'web/util/index'
 
-import {
-  concat,
-  stringifyClass,
-  genClassForVnode
-} from 'web/util/index'
-
-function updateClass (oldVnode: any, vnode: any) {
+function updateClass(oldVnode: any, vnode: any) {
   const el = vnode.elm
   const data: VNodeData = vnode.data
   const oldData: VNodeData = oldVnode.data
   if (
     isUndef(data.staticClass) &&
-    isUndef(data.class) && (
-      isUndef(oldData) || (
-        isUndef(oldData.staticClass) &&
-        isUndef(oldData.class)
-      )
-    )
+    isUndef(data.class) &&
+    (isUndef(oldData) ||
+      (isUndef(oldData.staticClass) && isUndef(oldData.class)))
   ) {
     return
   }

package/src/platforms/web/runtime/modules/{dom-props.js → dom-props.ts}

@@ -1,11 +1,10 @@
-/* @flow */
-
-import { isDef, isUndef, extend, toNumber } from 'shared/util'
+import { isDef, isUndef, extend, toNumber, isTrue } from 'shared/util'
+import type { VNodeWithData } from 'types/vnode'
 import { isSVG } from 'web/util/index'
 
 let svgContainer
 
-function updateDOMProps (oldVnode: VNodeWithData, vnode: VNodeWithData) {
+function updateDOMProps(oldVnode: VNodeWithData, vnode: VNodeWithData) {
   if (isUndef(oldVnode.data.domProps) && isUndef(vnode.data.domProps)) {
     return
   }
@@ -14,7 +13,7 @@ function updateDOMProps (oldVnode: VNodeWithData, vnode: VNodeWithData) {
   const oldProps = oldVnode.data.domProps || {}
   let props = vnode.data.domProps || {}
   // clone observed objects, as the user probably wants to mutate it
-  if (isDef(props.__ob__)) {
+  if (isDef(props.__ob__) || isTrue(props._v_attr_proxy)) {
     props = vnode.data.domProps = extend({}, props)
   }
 
@@ -48,7 +47,11 @@ function updateDOMProps (oldVnode: VNodeWithData, vnode: VNodeWithData) {
       if (shouldUpdateValue(elm, strCur)) {
         elm.value = strCur
       }
-    } else if (key === 'innerHTML' && isSVG(elm.tagName) && isUndef(elm.innerHTML)) {
+    } else if (
+      key === 'innerHTML' &&
+      isSVG(elm.tagName) &&
+      isUndef(elm.innerHTML)
+    ) {
       // IE doesn't support innerHTML for SVG elements
       svgContainer = svgContainer || document.createElement('div')
       svgContainer.innerHTML = `<svg>${cur}</svg>`
@@ -70,33 +73,37 @@ function updateDOMProps (oldVnode: VNodeWithData, vnode: VNodeWithData) {
       // e.g. `value` on <progress> w/ non-finite value
       try {
         elm[key] = cur
-      } catch (e) {}
+      } catch (e: any) {}
     }
   }
 }
 
 // check platforms/web/util/attrs.js acceptValue
-type acceptValueElm = HTMLInputElement | HTMLSelectElement | HTMLOptionElement;
+type acceptValueElm = HTMLInputElement | HTMLSelectElement | HTMLOptionElement
 
-function shouldUpdateValue (elm: acceptValueElm, checkVal: string): boolean {
-  return (!elm.composing && (
-    elm.tagName === 'OPTION' ||
-    isNotInFocusAndDirty(elm, checkVal) ||
-    isDirtyWithModifiers(elm, checkVal)
-  ))
+function shouldUpdateValue(elm: acceptValueElm, checkVal: string): boolean {
+  return (
+    //@ts-expect-error
+    !elm.composing &&
+    (elm.tagName === 'OPTION' ||
+      isNotInFocusAndDirty(elm, checkVal) ||
+      isDirtyWithModifiers(elm, checkVal))
+  )
 }
 
-function isNotInFocusAndDirty (elm: acceptValueElm, checkVal: string): boolean {
+function isNotInFocusAndDirty(elm: acceptValueElm, checkVal: string): boolean {
   // return true when textbox (.number and .trim) loses focus and its value is
   // not equal to the updated value
   let notInFocus = true
   // #6157
   // work around IE bug when accessing document.activeElement in an iframe
-  try { notInFocus = document.activeElement !== elm } catch (e) {}
+  try {
+    notInFocus = document.activeElement !== elm
+  } catch (e: any) {}
   return notInFocus && elm.value !== checkVal
 }
 
-function isDirtyWithModifiers (elm: any, newVal: string): boolean {
+function isDirtyWithModifiers(elm: any, newVal: string): boolean {
   const value = elm.value
   const modifiers = elm._vModifiers // injected by v-model runtime
   if (isDef(modifiers)) {

package/src/platforms/web/runtime/modules/{events.js → events.ts}

@@ -1,16 +1,19 @@
-/* @flow */
-
 import { isDef, isUndef } from 'shared/util'
 import { updateListeners } from 'core/vdom/helpers/index'
 import { isIE, isFF, supportsPassive, isUsingMicroTask } from 'core/util/index'
-import { RANGE_TOKEN, CHECKBOX_RADIO_TOKEN } from 'web/compiler/directives/model'
+import {
+  RANGE_TOKEN,
+  CHECKBOX_RADIO_TOKEN
+} from 'web/compiler/directives/model'
 import { currentFlushTimestamp } from 'core/observer/scheduler'
+import { emptyNode } from 'core/vdom/patch'
+import type { VNodeWithData } from 'types/vnode'
 
 // normalize v-model event tokens that can only be determined at runtime.
 // it's important to place the event as the first in the array because
 // the whole point is ensuring the v-model callback gets called before
 // user-attached handlers.
-function normalizeEvents (on) {
+function normalizeEvents(on) {
   /* istanbul ignore if */
   if (isDef(on[RANGE_TOKEN])) {
     // IE input[type=range] only supports `change` event
@@ -29,9 +32,9 @@ function normalizeEvents (on) {
 
 let target: any
 
-function createOnceHandler (event, handler, capture) {
+function createOnceHandler(event, handler, capture) {
   const _target = target // save current target element in closure
-  return function onceHandler () {
+  return function onceHandler() {
     const res = handler.apply(null, arguments)
     if (res !== null) {
       remove(event, onceHandler, capture, _target)
@@ -44,7 +47,7 @@ function createOnceHandler (event, handler, capture) {
 // safe to exclude.
 const useMicrotaskFix = isUsingMicroTask && !(isFF && Number(isFF[1]) <= 53)
 
-function add (
+function add(
   name: string,
   handler: Function,
   capture: boolean,
@@ -59,6 +62,7 @@ function add (
   if (useMicrotaskFix) {
     const attachedTimestamp = currentFlushTimestamp
     const original = handler
+    //@ts-expect-error
     handler = original._wrapper = function (e) {
       if (
         // no bubbling, should always fire.
@@ -83,32 +87,33 @@ function add (
   target.addEventListener(
     name,
     handler,
-    supportsPassive
-      ? { capture, passive }
-      : capture
+    supportsPassive ? { capture, passive } : capture
   )
 }
 
-function remove (
+function remove(
   name: string,
   handler: Function,
   capture: boolean,
   _target?: HTMLElement
 ) {
-  (_target || target).removeEventListener(
+  ;(_target || target).removeEventListener(
     name,
+    //@ts-expect-error
     handler._wrapper || handler,
     capture
   )
 }
 
-function updateDOMListeners (oldVnode: VNodeWithData, vnode: VNodeWithData) {
+function updateDOMListeners(oldVnode: VNodeWithData, vnode: VNodeWithData) {
   if (isUndef(oldVnode.data.on) && isUndef(vnode.data.on)) {
     return
   }
   const on = vnode.data.on || {}
   const oldOn = oldVnode.data.on || {}
-  target = vnode.elm
+  // vnode is empty when removing all listeners,
+  // and use old vnode dom element
+  target = vnode.elm || oldVnode.elm
   normalizeEvents(on)
   updateListeners(on, oldOn, add, remove, createOnceHandler, vnode.context)
   target = undefined
@@ -116,5 +121,7 @@ function updateDOMListeners (oldVnode: VNodeWithData, vnode: VNodeWithData) {
 
 export default {
   create: updateDOMListeners,
-  update: updateDOMListeners
+  update: updateDOMListeners,
+  // @ts-expect-error emptyNode has actually data
+  destroy: (vnode: VNodeWithData) => updateDOMListeners(vnode, emptyNode)
 }

package/src/platforms/web/runtime/modules/{index.js → index.ts}

@@ -5,11 +5,4 @@ import domProps from './dom-props'
 import style from './style'
 import transition from './transition'
 
-export default [
-  attrs,
-  klass,
-  events,
-  domProps,
-  style,
-  transition
-]
+export default [attrs, klass, events, domProps, style, transition]

package/src/platforms/web/runtime/modules/{style.js → style.ts}

@@ -1,7 +1,13 @@
-/* @flow */
-
 import { getStyle, normalizeStyleBinding } from 'web/util/style'
-import { cached, camelize, extend, isDef, isUndef, hyphenate } from 'shared/util'
+import {
+  cached,
+  camelize,
+  extend,
+  isDef,
+  isUndef,
+  hyphenate
+} from 'shared/util'
+import type { VNodeWithData } from 'types/vnode'
 
 const cssVarRE = /^--/
 const importantRE = /\s*!important$/
@@ -10,7 +16,11 @@ const setProp = (el, name, val) => {
   if (cssVarRE.test(name)) {
     el.style.setProperty(name, val)
   } else if (importantRE.test(val)) {
-    el.style.setProperty(hyphenate(name), val.replace(importantRE, ''), 'important')
+    el.style.setProperty(
+      hyphenate(name),
+      val.replace(importantRE, ''),
+      'important'
+    )
   } else {
     const normalizedName = normalize(name)
     if (Array.isArray(val)) {
@@ -18,10 +28,10 @@ const setProp = (el, name, val) => {
       // {display: ["-webkit-box", "-ms-flexbox", "flex"]}
       // Set them one by one, and the browser will only set those it can recognize
       for (let i = 0, len = val.length; i < len; i++) {
-        el.style[normalizedName] = val[i]
+        el.style[normalizedName!] = val[i]
       }
     } else {
-      el.style[normalizedName] = val
+      el.style[normalizedName!] = val
     }
   }
 }
@@ -32,7 +42,7 @@ let emptyStyle
 const normalize = cached(function (prop) {
   emptyStyle = emptyStyle || document.createElement('div').style
   prop = camelize(prop)
-  if (prop !== 'filter' && (prop in emptyStyle)) {
+  if (prop !== 'filter' && prop in emptyStyle) {
     return prop
   }
   const capName = prop.charAt(0).toUpperCase() + prop.slice(1)
@@ -44,12 +54,15 @@ const normalize = cached(function (prop) {
   }
 })
 
-function updateStyle (oldVnode: VNodeWithData, vnode: VNodeWithData) {
+function updateStyle(oldVnode: VNodeWithData, vnode: VNodeWithData) {
   const data = vnode.data
   const oldData = oldVnode.data
 
-  if (isUndef(data.staticStyle) && isUndef(data.style) &&
-    isUndef(oldData.staticStyle) && isUndef(oldData.style)
+  if (
+    isUndef(data.staticStyle) &&
+    isUndef(data.style) &&
+    isUndef(oldData.staticStyle) &&
+    isUndef(oldData.style)
   ) {
     return
   }
@@ -67,9 +80,7 @@ function updateStyle (oldVnode: VNodeWithData, vnode: VNodeWithData) {
   // store normalized style under a different key for next diff
   // make sure to clone it if it's reactive, since the user likely wants
   // to mutate it.
-  vnode.data.normalizedStyle = isDef(style.__ob__)
-    ? extend({}, style)
-    : style
+  vnode.data.normalizedStyle = isDef(style.__ob__) ? extend({}, style) : style
 
   const newStyle = getStyle(vnode, true)
 

package/src/platforms/web/runtime/modules/{transition.js → transition.ts}

@@ -1,5 +1,3 @@
-/* @flow */
-
 import { inBrowser, isIE9, warn } from 'core/util/index'
 import { mergeVNodeHook } from 'core/vdom/helpers/index'
 import { activeInstance } from 'core/instance/lifecycle'
@@ -9,7 +7,8 @@ import {
   isDef,
   isUndef,
   isObject,
-  toNumber
+  toNumber,
+  isFunction
 } from 'shared/util'
 
 import {
@@ -18,9 +17,12 @@ import {
   whenTransitionEnds,
   addTransitionClass,
   removeTransitionClass
-} from '../transition-util'
+} from 'web/runtime/transition-util'
+
+import type { VNodeWithData } from 'types/vnode'
+import VNode from 'core/vdom/vnode'
 
-export function enter (vnode: VNodeWithData, toggleDisplay: ?() => void) {
+export function enter(vnode: VNodeWithData, toggleDisplay?: () => void) {
   const el: any = vnode.elm
 
   // call leave callback now
@@ -76,47 +78,35 @@ export function enter (vnode: VNodeWithData, toggleDisplay: ?() => void) {
     return
   }
 
-  const startClass = isAppear && appearClass
-    ? appearClass
-    : enterClass
-  const activeClass = isAppear && appearActiveClass
-    ? appearActiveClass
-    : enterActiveClass
-  const toClass = isAppear && appearToClass
-    ? appearToClass
-    : enterToClass
-
-  const beforeEnterHook = isAppear
-    ? (beforeAppear || beforeEnter)
-    : beforeEnter
-  const enterHook = isAppear
-    ? (typeof appear === 'function' ? appear : enter)
-    : enter
-  const afterEnterHook = isAppear
-    ? (afterAppear || afterEnter)
-    : afterEnter
+  const startClass = isAppear && appearClass ? appearClass : enterClass
+  const activeClass =
+    isAppear && appearActiveClass ? appearActiveClass : enterActiveClass
+  const toClass = isAppear && appearToClass ? appearToClass : enterToClass
+
+  const beforeEnterHook = isAppear ? beforeAppear || beforeEnter : beforeEnter
+  const enterHook = isAppear ? (isFunction(appear) ? appear : enter) : enter
+  const afterEnterHook = isAppear ? afterAppear || afterEnter : afterEnter
   const enterCancelledHook = isAppear
-    ? (appearCancelled || enterCancelled)
+    ? appearCancelled || enterCancelled
     : enterCancelled
 
   const explicitEnterDuration: any = toNumber(
-    isObject(duration)
-      ? duration.enter
-      : duration
+    isObject(duration) ? duration.enter : duration
   )
 
-  if (process.env.NODE_ENV !== 'production' && explicitEnterDuration != null) {
+  if (__DEV__ && explicitEnterDuration != null) {
     checkDuration(explicitEnterDuration, 'enter', vnode)
   }
 
   const expectsCSS = css !== false && !isIE9
   const userWantsControl = getHookArgumentsLength(enterHook)
 
-  const cb = el._enterCb = once(() => {
+  const cb = (el._enterCb = once(() => {
     if (expectsCSS) {
       removeTransitionClass(el, toClass)
       removeTransitionClass(el, activeClass)
     }
+    // @ts-expect-error
     if (cb.cancelled) {
       if (expectsCSS) {
         removeTransitionClass(el, startClass)
@@ -126,14 +116,16 @@ export function enter (vnode: VNodeWithData, toggleDisplay: ?() => void) {
       afterEnterHook && afterEnterHook(el)
     }
     el._enterCb = null
-  })
+  }))
 
   if (!vnode.data.show) {
     // remove pending leave element on enter by injecting an insert hook
     mergeVNodeHook(vnode, 'insert', () => {
       const parent = el.parentNode
-      const pendingNode = parent && parent._pending && parent._pending[vnode.key]
-      if (pendingNode &&
+      const pendingNode =
+        parent && parent._pending && parent._pending[vnode.key!]
+      if (
+        pendingNode &&
         pendingNode.tag === vnode.tag &&
         pendingNode.elm._leaveCb
       ) {
@@ -150,6 +142,7 @@ export function enter (vnode: VNodeWithData, toggleDisplay: ?() => void) {
     addTransitionClass(el, activeClass)
     nextFrame(() => {
       removeTransitionClass(el, startClass)
+      // @ts-expect-error
       if (!cb.cancelled) {
         addTransitionClass(el, toClass)
         if (!userWantsControl) {
@@ -173,7 +166,7 @@ export function enter (vnode: VNodeWithData, toggleDisplay: ?() => void) {
   }
 }
 
-export function leave (vnode: VNodeWithData, rm: Function) {
+export function leave(vnode: VNodeWithData, rm: Function) {
   const el: any = vnode.elm
 
   // call enter callback now
@@ -210,23 +203,22 @@ export function leave (vnode: VNodeWithData, rm: Function) {
   const userWantsControl = getHookArgumentsLength(leave)
 
   const explicitLeaveDuration: any = toNumber(
-    isObject(duration)
-      ? duration.leave
-      : duration
+    isObject(duration) ? duration.leave : duration
   )
 
-  if (process.env.NODE_ENV !== 'production' && isDef(explicitLeaveDuration)) {
+  if (__DEV__ && isDef(explicitLeaveDuration)) {
     checkDuration(explicitLeaveDuration, 'leave', vnode)
   }
 
-  const cb = el._leaveCb = once(() => {
+  const cb = (el._leaveCb = once(() => {
     if (el.parentNode && el.parentNode._pending) {
-      el.parentNode._pending[vnode.key] = null
+      el.parentNode._pending[vnode.key!] = null
     }
     if (expectsCSS) {
       removeTransitionClass(el, leaveToClass)
       removeTransitionClass(el, leaveActiveClass)
     }
+    // @ts-expect-error
     if (cb.cancelled) {
       if (expectsCSS) {
         removeTransitionClass(el, leaveClass)
@@ -237,7 +229,7 @@ export function leave (vnode: VNodeWithData, rm: Function) {
       afterLeave && afterLeave(el)
     }
     el._leaveCb = null
-  })
+  }))
 
   if (delayLeave) {
     delayLeave(performLeave)
@@ -245,14 +237,16 @@ export function leave (vnode: VNodeWithData, rm: Function) {
     performLeave()
   }
 
-  function performLeave () {
+  function performLeave() {
     // the delayed leave may have already been cancelled
+    // @ts-expect-error
     if (cb.cancelled) {
       return
     }
     // record leaving element
     if (!vnode.data.show && el.parentNode) {
-      (el.parentNode._pending || (el.parentNode._pending = {}))[(vnode.key: any)] = vnode
+      ;(el.parentNode._pending || (el.parentNode._pending = {}))[vnode.key!] =
+        vnode
     }
     beforeLeave && beforeLeave(el)
     if (expectsCSS) {
@@ -260,6 +254,7 @@ export function leave (vnode: VNodeWithData, rm: Function) {
       addTransitionClass(el, leaveActiveClass)
       nextFrame(() => {
         removeTransitionClass(el, leaveClass)
+        // @ts-expect-error
         if (!cb.cancelled) {
           addTransitionClass(el, leaveToClass)
           if (!userWantsControl) {
@@ -280,23 +275,23 @@ export function leave (vnode: VNodeWithData, rm: Function) {
 }
 
 // only used in dev mode
-function checkDuration (val, name, vnode) {
+function checkDuration(val, name, vnode) {
   if (typeof val !== 'number') {
     warn(
       `<transition> explicit ${name} duration is not a valid number - ` +
-      `got ${JSON.stringify(val)}.`,
+        `got ${JSON.stringify(val)}.`,
       vnode.context
     )
   } else if (isNaN(val)) {
     warn(
       `<transition> explicit ${name} duration is NaN - ` +
-      'the duration expression might be incorrect.',
+        'the duration expression might be incorrect.',
       vnode.context
     )
   }
 }
 
-function isValidDuration (val) {
+function isValidDuration(val) {
   return typeof val === 'number' && !isNaN(val)
 }
 
@@ -306,38 +301,41 @@ function isValidDuration (val) {
  * - a wrapped component method (check ._length)
  * - a plain function (.length)
  */
-function getHookArgumentsLength (fn: Function): boolean {
+function getHookArgumentsLength(fn: Function): boolean {
   if (isUndef(fn)) {
     return false
   }
+  // @ts-expect-error
   const invokerFns = fn.fns
   if (isDef(invokerFns)) {
     // invoker
     return getHookArgumentsLength(
-      Array.isArray(invokerFns)
-        ? invokerFns[0]
-        : invokerFns
+      Array.isArray(invokerFns) ? invokerFns[0] : invokerFns
     )
   } else {
+    // @ts-expect-error
     return (fn._length || fn.length) > 1
   }
 }
 
-function _enter (_: any, vnode: VNodeWithData) {
+function _enter(_: any, vnode: VNodeWithData) {
   if (vnode.data.show !== true) {
     enter(vnode)
   }
 }
 
-export default inBrowser ? {
-  create: _enter,
-  activate: _enter,
-  remove (vnode: VNode, rm: Function) {
-    /* istanbul ignore else */
-    if (vnode.data.show !== true) {
-      leave(vnode, rm)
-    } else {
-      rm()
+export default inBrowser
+  ? {
+      create: _enter,
+      activate: _enter,
+      remove(vnode: VNode, rm: Function) {
+        /* istanbul ignore else */
+        if (vnode.data!.show !== true) {
+          // @ts-expect-error
+          leave(vnode, rm)
+        } else {
+          rm()
+        }
+      }
     }
-  }
-} : {}
+  : {}

package/src/platforms/web/runtime/node-ops.ts

@@ -0,0 +1,66 @@
+import VNode from 'core/vdom/vnode'
+import { namespaceMap } from 'web/util/index'
+
+export function createElement(tagName: string, vnode: VNode): Element {
+  const elm = document.createElement(tagName)
+  if (tagName !== 'select') {
+    return elm
+  }
+  // false or null will remove the attribute but undefined will not
+  if (
+    vnode.data &&
+    vnode.data.attrs &&
+    vnode.data.attrs.multiple !== undefined
+  ) {
+    elm.setAttribute('multiple', 'multiple')
+  }
+  return elm
+}
+
+export function createElementNS(namespace: string, tagName: string): Element {
+  return document.createElementNS(namespaceMap[namespace], tagName)
+}
+
+export function createTextNode(text: string): Text {
+  return document.createTextNode(text)
+}
+
+export function createComment(text: string): Comment {
+  return document.createComment(text)
+}
+
+export function insertBefore(
+  parentNode: Node,
+  newNode: Node,
+  referenceNode: Node
+) {
+  parentNode.insertBefore(newNode, referenceNode)
+}
+
+export function removeChild(node: Node, child: Node) {
+  node.removeChild(child)
+}
+
+export function appendChild(node: Node, child: Node) {
+  node.appendChild(child)
+}
+
+export function parentNode(node: Node) {
+  return node.parentNode
+}
+
+export function nextSibling(node: Node) {
+  return node.nextSibling
+}
+
+export function tagName(node: Element): string {
+  return node.tagName
+}
+
+export function setTextContent(node: Node, text: string) {
+  node.textContent = text
+}
+
+export function setStyleScope(node: Element, scopeId: string) {
+  node.setAttribute(scopeId, '')
+}

package/src/platforms/web/runtime/{patch.js → patch.ts}

@@ -1,5 +1,3 @@
-/* @flow */
-
 import * as nodeOps from 'web/runtime/node-ops'
 import { createPatchFunction } from 'core/vdom/patch'
 import baseModules from 'core/vdom/modules/index'