refactor(compiler-core): improve template type handling

diff --git a/packages/compiler-core/__tests__/__snapshots__/parse.spec.ts.snap b/packages/compiler-core/__tests__/__snapshots__/parse.spec.ts.snap
index f6aa2ece7c5bc860c09a5f687120a35c24d84498..978f4c9bc3b5f239f6f8c5d558e6b435eef3d2b6 100644 (file)
--- a/packages/compiler-core/__tests__/__snapshots__/parse.spec.ts.snap
+++ b/packages/compiler-core/__tests__/__snapshots__/parse.spec.ts.snap
@@ -42,7 +42,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -111,7 +111,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -180,7 +180,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -266,7 +266,7 @@ Object {
         },
       ],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -352,7 +352,7 @@ Object {
         },
       ],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -438,7 +438,7 @@ Object {
         },
       ],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -524,7 +524,7 @@ Object {
         },
       ],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -593,7 +593,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -662,7 +662,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -731,7 +731,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -800,7 +800,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -869,7 +869,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -962,7 +962,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -1031,7 +1031,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -1100,7 +1100,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -1169,7 +1169,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -1313,7 +1313,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -1388,7 +1388,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -1463,7 +1463,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -1532,7 +1532,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -1601,7 +1601,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -1676,7 +1676,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -1769,7 +1769,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -1838,7 +1838,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -1907,7 +1907,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -1976,7 +1976,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -2045,7 +2045,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -2114,7 +2114,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -2327,7 +2327,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -2402,7 +2402,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -2496,7 +2496,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -2590,7 +2590,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -2684,7 +2684,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -2794,7 +2794,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -2904,7 +2904,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -3014,7 +3014,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -3124,7 +3124,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -3234,7 +3234,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -3344,7 +3344,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -3454,7 +3454,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -3564,7 +3564,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -3633,7 +3633,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -3747,7 +3747,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -3816,7 +3816,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -3885,7 +3885,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -3954,7 +3954,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -4023,7 +4023,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -4110,7 +4110,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -4179,7 +4179,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -4265,7 +4265,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -4375,7 +4375,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -4469,7 +4469,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -4563,7 +4563,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -4614,7 +4614,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -4683,7 +4683,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -4752,7 +4752,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -4821,7 +4821,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -4967,7 +4967,7 @@ class=\\"bar\\"></div></template>",
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -5112,7 +5112,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -5181,7 +5181,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -5250,7 +5250,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -5319,7 +5319,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -5388,7 +5388,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -5457,7 +5457,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -5526,7 +5526,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -5595,7 +5595,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -5664,7 +5664,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -5774,7 +5774,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -5884,7 +5884,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -5994,7 +5994,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -6104,7 +6104,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -6214,7 +6214,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -6324,7 +6324,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -6434,7 +6434,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -6544,7 +6544,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -6638,7 +6638,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -6748,7 +6748,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -6817,7 +6817,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -6929,7 +6929,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -7118,7 +7118,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -7169,7 +7169,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -7256,7 +7256,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -7508,7 +7508,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],
@@ -7583,7 +7583,7 @@ Object {
       "ns": 0,
       "props": Array [],
       "tag": "template",
-      "tagType": 3,
+      "tagType": 0,
       "type": 1,
     },
   ],

diff --git a/packages/compiler-core/__tests__/parse.spec.ts b/packages/compiler-core/__tests__/parse.spec.ts
index 53263f8d54d549aad48c5776b732faa9941edf70..b21288d95c75c6b432b547d4d9e1497d0f72478b 100644 (file)
--- a/packages/compiler-core/__tests__/parse.spec.ts
+++ b/packages/compiler-core/__tests__/parse.spec.ts
@@ -526,7 +526,6 @@ describe('compiler: parse', () => {
         tagType: ElementTypes.ELEMENT,
         codegenNode: undefined,
         props: [],
-
         isSelfClosing: false,
         children: [],
         loc: {
@@ -583,6 +582,24 @@ describe('compiler: parse', () => {
       })
     })
 
+    test('template element with directives', () => {
+      const ast = baseParse('<template v-if="ok"></template>')
+      const element = ast.children[0]
+      expect(element).toMatchObject({
+        type: NodeTypes.ELEMENT,
+        tagType: ElementTypes.TEMPLATE
+      })
+    })
+
+    test('template element without directives', () => {
+      const ast = baseParse('<template></template>')
+      const element = ast.children[0]
+      expect(element).toMatchObject({
+        type: NodeTypes.ELEMENT,
+        tagType: ElementTypes.ELEMENT
+      })
+    })
+
     test('native element with `isNativeTag`', () => {
       const ast = baseParse('<div></div><comp></comp><Comp></Comp>', {
         isNativeTag: tag => tag === 'div'

diff --git a/packages/compiler-core/src/parse.ts b/packages/compiler-core/src/parse.ts
index 9b2425c09c88137585ecf118757d45a54f274745..e593979fa672d4dcf577900f91ed5092deb055cd 100644 (file)
--- a/packages/compiler-core/src/parse.ts
+++ b/packages/compiler-core/src/parse.ts
@@ -1,5 +1,5 @@
 import { ParserOptions } from './options'
-import { NO, isArray } from '@vue/shared'
+import { NO, isArray, makeMap } from '@vue/shared'
 import { ErrorCodes, createCompilerError, defaultOnError } from './errors'
 import {
   assert,
@@ -397,6 +397,10 @@ const enum TagType {
   End
 }
 
+const isSpecialTemplateDirective = /*#__PURE__*/ makeMap(
+  `if,else,else-if,for,slot`
+)
+
 /**
  * Parse a tag (E.g. `<div id=a>`) with that type (start tag or end tag).
  */
@@ -467,7 +471,14 @@ function parseTag(
 
     if (tag === 'slot') {
       tagType = ElementTypes.SLOT
-    } else if (tag === 'template') {
+    } else if (
+      tag === 'template' &&
+      props.some(p => {
+        return (
+          p.type === NodeTypes.DIRECTIVE && isSpecialTemplateDirective(p.name)
+        )
+      })
+    ) {
       tagType = ElementTypes.TEMPLATE
     }
   }

diff --git a/packages/compiler-core/src/transforms/transformElement.ts b/packages/compiler-core/src/transforms/transformElement.ts
index 65963da280eebc9a3f6c464d77af1c14dda57368..a9203d8f8d1a13f9a91dce2078325f0aaf804138 100644 (file)
--- a/packages/compiler-core/src/transforms/transformElement.ts
+++ b/packages/compiler-core/src/transforms/transformElement.ts
@@ -33,7 +33,6 @@ import {
 } from '../runtimeHelpers'
 import {
   getInnerRange,
-  isVSlot,
   toValidAssetId,
   findProp,
   isCoreComponent
@@ -48,12 +47,11 @@ const directiveImportMap = new WeakMap<DirectiveNode, symbol>()
 // generate a JavaScript AST for this element's codegen
 export const transformElement: NodeTransform = (node, context) => {
   if (
-    node.type !== NodeTypes.ELEMENT ||
-    // handled by transformSlotOutlet
-    node.tagType === ElementTypes.SLOT ||
-    // <template v-if/v-for> should have already been replaced
-    // <template v-slot> is handled by buildSlots
-    (node.tagType === ElementTypes.TEMPLATE && node.props.some(isVSlot))
+    !(
+      node.type === NodeTypes.ELEMENT &&
+      (node.tagType === ElementTypes.ELEMENT ||
+        node.tagType === ElementTypes.COMPONENT)
+    )
   ) {
     return
   }