test(compiler-ssr): test for ssr element transform

Author: yyx990803

packages/compiler-ssr/__tests__/transforms/ssrTransformElement.spec.ts

@@ -0,0 +1,25 @@
+import { compile } from '../../src'
+
+function getElementString(src: string): string {
+  return compile(src).code.match(/_push\((.*)\)/)![1]
+}
+
+describe('ssr transform element', () => {
+  test('basic elements', () => {
+    expect(getElementString(`<div></div>`)).toMatchInlineSnapshot(
+      `"\`<div></div>\`"`
+    )
+  })
+
+  test('static attrs', () => {
+    expect(
+      getElementString(`<div id="foo" class="bar"></div>`)
+    ).toMatchInlineSnapshot(`"\`<div id=\\"foo\\" class=\\"bar\\"></div>\`"`)
+  })
+
+  test('nested elements', () => {
+    expect(
+      getElementString(`<div><span></span><span></span></div>`)
+    ).toMatchInlineSnapshot(`"\`<div><span></span><span></span></div>\`"`)
+  })
+})

packages/compiler-ssr/src/ssrCodegenTransform.ts

@@ -5,10 +5,10 @@ import {
   TemplateLiteral,
   createCallExpression,
   createTemplateLiteral,
-  locStub,
   NodeTypes,
   TemplateChildNode,
-  ElementTypes
+  ElementTypes,
+  createBlockStatement
 } from '@vue/compiler-dom'
 import { isString } from '@vue/shared'
 
@@ -30,11 +30,7 @@ export function ssrCodegenTransform(ast: RootNode) {
     context.pushStringPart(`<!---->`)
   }
 
-  ast.codegenNode = {
-    type: NodeTypes.JS_BLOCK_STATEMENT,
-    loc: locStub,
-    body: context.body
-  }
+  ast.codegenNode = createBlockStatement(context.body)
 }
 
 type SSRTransformContext = ReturnType<typeof createSSRTransformContext>

packages/compiler-ssr/src/transforms/ssrTransformElement.ts

@@ -5,7 +5,7 @@ import {
   TemplateLiteral,
   createTemplateLiteral
 } from '@vue/compiler-dom'
-import { escapeHtml } from '@vue/server-renderer/src'
+import { escapeHtml } from '@vue/server-renderer'
 
 /*
 ## Simple Element