fix(compiler-core): handle base-transition

packages/compiler-core/__tests__/transforms/transformElement.spec.ts

@@ -10,7 +10,8 @@ import {
   PORTAL,
   RESOLVE_DYNAMIC_COMPONENT,
   SUSPENSE,
-  KEEP_ALIVE
+  KEEP_ALIVE,
+  BASE_TRANSITION
 } from '../../src/runtimeHelpers'
 import {
   CallExpression,
@@ -356,6 +357,30 @@ describe('compiler: element transform', () => {
     assert(`KeepAlive`)
   })
 
+  test('should handle <BaseTransition>', () => {
+    function assert(tag: string) {
+      const { root, node } = parseWithElementTransform(
+        `<${tag}><span /></${tag}>`
+      )
+      expect(root.components.length).toBe(0)
+      expect(root.helpers).toContain(BASE_TRANSITION)
+      expect(node.callee).toBe(CREATE_VNODE)
+      expect(node.arguments).toMatchObject([
+        BASE_TRANSITION,
+        `null`,
+        createObjectMatcher({
+          default: {
+            type: NodeTypes.JS_FUNCTION_EXPRESSION
+          },
+          _compiled: `[true]`
+        })
+      ])
+    }
+
+    assert(`base-transition`)
+    assert(`BaseTransition`)
+  })
+
   test('error on v-bind with no argument', () => {
     const onError = jest.fn()
     parseWithElementTransform(`<div v-bind/>`, { onError })

packages/compiler-core/src/parse.ts

@@ -31,7 +31,7 @@ import { extend } from '@vue/shared'
 
 // Portal and Fragment are native types, not components
 const isBuiltInComponent = /*#__PURE__*/ makeMap(
-  `suspense,keep-alive,keepalive,transition`,
+  `suspense,keep-alive,keepalive,base-transition`,
   true
 )
 

packages/compiler-core/src/runtimeHelpers.ts

@@ -2,7 +2,6 @@ export const FRAGMENT = Symbol(__DEV__ ? `Fragment` : ``)
 export const PORTAL = Symbol(__DEV__ ? `Portal` : ``)
 export const SUSPENSE = Symbol(__DEV__ ? `Suspense` : ``)
 export const KEEP_ALIVE = Symbol(__DEV__ ? `KeepAlive` : ``)
-export const TRANSITION = Symbol(__DEV__ ? `Transition` : ``)
 export const BASE_TRANSITION = Symbol(__DEV__ ? `BaseTransition` : ``)
 export const OPEN_BLOCK = Symbol(__DEV__ ? `openBlock` : ``)
 export const CREATE_BLOCK = Symbol(__DEV__ ? `createBlock` : ``)
@@ -32,7 +31,6 @@ export const helperNameMap: any = {
   [PORTAL]: `Portal`,
   [SUSPENSE]: `Suspense`,
   [KEEP_ALIVE]: `KeepAlive`,
-  [TRANSITION]: `Transition`,
   [BASE_TRANSITION]: `BaseTransition`,
   [OPEN_BLOCK]: `openBlock`,
   [CREATE_BLOCK]: `createBlock`,

packages/compiler-core/src/transforms/transformElement.ts

@@ -28,7 +28,7 @@ import {
   PORTAL,
   SUSPENSE,
   KEEP_ALIVE,
-  TRANSITION
+  BASE_TRANSITION
 } from '../runtimeHelpers'
 import { getInnerRange, isVSlot, toValidAssetId, findProp } from '../utils'
 import { buildSlots } from './vSlot'
@@ -60,7 +60,7 @@ export const transformElement: NodeTransform = (node, context) => {
     const isPortal = isBuiltInType(tag, 'Portal')
     const isSuspense = isBuiltInType(tag, 'Suspense')
     const isKeepAlive = isBuiltInType(tag, 'KeepAlive')
-    const isTransition = isBuiltInType(tag, 'Transition')
+    const isBaseTransition = isBuiltInType(tag, 'BaseTransition')
     const isComponent = tagType === ElementTypes.COMPONENT
 
     let hasProps = props.length > 0
@@ -102,8 +102,8 @@ export const transformElement: NodeTransform = (node, context) => {
       nodeType = context.helper(SUSPENSE)
     } else if (isKeepAlive) {
       nodeType = context.helper(KEEP_ALIVE)
-    } else if (isTransition) {
-      nodeType = context.helper(TRANSITION)
+    } else if (isBaseTransition) {
+      nodeType = context.helper(BASE_TRANSITION)
     } else if (isComponent) {
       // user component w/ resolve
       context.helper(RESOLVE_COMPONENT)