From 505269405ee33c326cc167df160f7223554a5ecc Mon Sep 17 00:00:00 2001
From: Evan You <yyx990803@gmail.com>
Date: Sat, 17 Apr 2021 22:16:48 -0400
Subject: [PATCH] wip: plain template tag compat

---
 .../compiler-core/src/compat/compatConfig.ts   |  2 +-
 .../src/transforms/transformElement.ts         | 18 ++++++++++++++++--
 .../src/transforms/transformText.ts            |  6 +++++-
 3 files changed, 22 insertions(+), 4 deletions(-)

diff --git a/packages/compiler-core/src/compat/compatConfig.ts b/packages/compiler-core/src/compat/compatConfig.ts
index d6870b478..208f3d531 100644
--- a/packages/compiler-core/src/compat/compatConfig.ts
+++ b/packages/compiler-core/src/compat/compatConfig.ts
@@ -78,7 +78,7 @@ const deprecationData: Record<CompilerDeprecationTypes, DeprecationData> = {
 
   [CompilerDeprecationTypes.COMPILER_NATIVE_TEMPLATE]: {
     message:
-      `<template> with no special directives will render as a native template` +
+      `<template> with no special directives will render as a native template ` +
       `element instead of its inner content in Vue 3.`
   }
 }
diff --git a/packages/compiler-core/src/transforms/transformElement.ts b/packages/compiler-core/src/transforms/transformElement.ts
index 214acbc59..ce85c958d 100644
--- a/packages/compiler-core/src/transforms/transformElement.ts
+++ b/packages/compiler-core/src/transforms/transformElement.ts
@@ -41,7 +41,8 @@ import {
   TELEPORT,
   KEEP_ALIVE,
   SUSPENSE,
-  UNREF
+  UNREF,
+  FRAGMENT
 } from '../runtimeHelpers'
 import {
   getInnerRange,
@@ -87,9 +88,22 @@ export const transformElement: NodeTransform = (node, context) => {
 
     // The goal of the transform is to create a codegenNode implementing the
     // VNodeCall interface.
-    const vnodeTag = isComponent
+    let vnodeTag = isComponent
       ? resolveComponentType(node as ComponentNode, context)
       : `"${tag}"`
+
+    if (
+      __COMPAT__ &&
+      tag === 'template' &&
+      checkCompatEnabled(
+        CompilerDeprecationTypes.COMPILER_NATIVE_TEMPLATE,
+        context,
+        node.loc
+      )
+    ) {
+      vnodeTag = context.helper(FRAGMENT)
+    }
+
     const isDynamicComponent =
       isObject(vnodeTag) && vnodeTag.callee === RESOLVE_DYNAMIC_COMPONENT
 
diff --git a/packages/compiler-core/src/transforms/transformText.ts b/packages/compiler-core/src/transforms/transformText.ts
index 3576e0e2c..a8b65c966 100644
--- a/packages/compiler-core/src/transforms/transformText.ts
+++ b/packages/compiler-core/src/transforms/transformText.ts
@@ -63,7 +63,11 @@ export const transformText: NodeTransform = (node, context) => {
         (children.length === 1 &&
           (node.type === NodeTypes.ROOT ||
             (node.type === NodeTypes.ELEMENT &&
-              node.tagType === ElementTypes.ELEMENT)))
+              node.tagType === ElementTypes.ELEMENT &&
+              // in compat mode, <template> tags with no special directives
+              // will be rendered as a fragment so its children must be
+              // converted into vnodes.
+              !(__COMPAT__ && node.tag === 'template'))))
       ) {
         return
       }