wip(compiler): tests for new stringification

packages/compiler-dom/src/transforms/stringifyStatic.ts

@@ -13,8 +13,7 @@ import {
   ExpressionNode,
   ElementTypes,
   PlainElementNode,
-  JSChildNode,
-  createSimpleExpression
+  JSChildNode
 } from '@vue/compiler-core'
 import {
   isVoidTag,
@@ -39,9 +38,42 @@ export const enum StringifyThresholds {
 export const stringifyStatic: HoistTransform = (children, context) => {
   let nc = 0 // current node count
   let ec = 0 // current element with binding count
-  const currentEligibleNodes: PlainElementNode[] = []
+  const currentChunk: PlainElementNode[] = []
 
-  for (let i = 0; i < children.length; i++) {
+  const stringifyCurrentChunk = (currentIndex: number): number => {
+    if (
+      nc >= StringifyThresholds.NODE_COUNT ||
+      ec >= StringifyThresholds.ELEMENT_WITH_BINDING_COUNT
+    ) {
+      // combine all currently eligible nodes into a single static vnode call
+      const staticCall = createCallExpression(context.helper(CREATE_STATIC), [
+        JSON.stringify(
+          currentChunk.map(node => stringifyElement(node, context)).join('')
+        ),
+        // the 2nd argument indicates the number of DOM nodes this static vnode
+        // will insert / hydrate
+        String(currentChunk.length)
+      ])
+      // replace the first node's hoisted expression with the static vnode call
+      replaceHoist(currentChunk[0], staticCall, context)
+
+      if (currentChunk.length > 1) {
+        for (let i = 1; i < currentChunk.length; i++) {
+          // for the merged nodes, set their hoisted expression to null
+          replaceHoist(currentChunk[i], null, context)
+        }
+
+        // also remove merged nodes from children
+        const deleteCount = currentChunk.length - 1
+        children.splice(currentIndex - currentChunk.length + 1, deleteCount)
+        return deleteCount
+      }
+    }
+    return 0
+  }
+
+  let i = 0
+  for (; i < children.length; i++) {
     const child = children[i]
     const hoisted = getHoistedNode(child)
     if (hoisted) {
@@ -52,54 +84,21 @@ export const stringifyStatic: HoistTransform = (children, context) => {
         // node is stringifiable, record state
         nc += result[0]
         ec += result[1]
-        currentEligibleNodes.push(node)
+        currentChunk.push(node)
         continue
       }
     }
-
     // we only reach here if we ran into a node that is not stringifiable
     // check if currently analyzed nodes meet criteria for stringification.
-    if (
-      nc >= StringifyThresholds.NODE_COUNT ||
-      ec >= StringifyThresholds.ELEMENT_WITH_BINDING_COUNT
-    ) {
-      // combine all currently eligible nodes into a single static vnode call
-      const staticCall = createCallExpression(context.helper(CREATE_STATIC), [
-        JSON.stringify(
-          currentEligibleNodes
-            .map(node => stringifyElement(node, context))
-            .join('')
-        ),
-        // the 2nd argument indicates the number of DOM nodes this static vnode
-        // will insert / hydrate
-        String(currentEligibleNodes.length)
-      ])
-      // replace the first node's hoisted expression with the static vnode call
-      replaceHoist(currentEligibleNodes[0], staticCall, context)
-
-      const n = currentEligibleNodes.length
-      if (n > 1) {
-        for (let j = 1; j < n; j++) {
-          // for the merged nodes, set their hoisted expression to null
-          replaceHoist(
-            currentEligibleNodes[j],
-            createSimpleExpression(`null`, false),
-            context
-          )
-        }
-        // also remove merged nodes from children
-        const deleteCount = n - 1
-        children.splice(i - n + 1, deleteCount)
-        // adjust iteration index
-        i -= deleteCount
-      }
-    }
-
+    // adjust iteration index
+    i -= stringifyCurrentChunk(i)
     // reset state
     nc = 0
     ec = 0
-    currentEligibleNodes.length = 0
+    currentChunk.length = 0
   }
+  // in case the last node was also stringifiable
+  stringifyCurrentChunk(i)
 }
 
 const getHoistedNode = (node: TemplateChildNode) =>
@@ -116,7 +115,7 @@ const isStringifiableAttr = (name: string) => {
 
 const replaceHoist = (
   node: PlainElementNode,
-  replacement: JSChildNode,
+  replacement: JSChildNode | null,
   context: TransformContext
 ) => {
   const hoistToReplace = (node.codegenNode as SimpleExpressionNode).hoisted!