refactor(ssr): move escapeHtml to shared

diff --git a/packages/compiler-ssr/__tests__/transforms/ssrTransformElement.spec.ts b/packages/compiler-ssr/__tests__/ssrCompile.spec.ts
similarity index 65%
rename from packages/compiler-ssr/__tests__/transforms/ssrTransformElement.spec.ts
rename to packages/compiler-ssr/__tests__/ssrCompile.spec.ts
index f8b280a322b3fc0b8585302fff5ac6084d0c4e92..14dd767ec31781696ac982b44fb2d620abad560b 100644 (file)
--- a/packages/compiler-ssr/__tests__/transforms/ssrTransformElement.spec.ts
+++ b/packages/compiler-ssr/__tests__/ssrCompile.spec.ts
@@ -1,10 +1,10 @@
-import { compile } from '../../src'
+import { compile } from '../src'
 
 function getElementString(src: string): string {
   return compile(src).code.match(/_push\((.*)\)/)![1]
 }
 
-describe('ssr transform element', () => {
+describe('ssr compile integration test', () => {
   test('basic elements', () => {
     expect(getElementString(`<div></div>`)).toMatchInlineSnapshot(
       `"\`<div></div>\`"`
@@ -22,4 +22,12 @@ describe('ssr transform element', () => {
       getElementString(`<div><span></span><span></span></div>`)
     ).toMatchInlineSnapshot(`"\`<div><span></span><span></span></div>\`"`)
   })
+
+  test('nested elements with static text', () => {
+    expect(
+      getElementString(`<div><span>hello</span>&gt;<span>bye</span></div>`)
+    ).toMatchInlineSnapshot(
+      `"\`<div><span>hello</span>&gt;<span>bye</span></div>\`"`
+    )
+  })
 })

diff --git a/packages/compiler-ssr/src/ssrCodegenTransform.ts b/packages/compiler-ssr/src/ssrCodegenTransform.ts
index c60ba2bfdf5b098a4499eaa2708f7399741a4cfb..30cf872f52ba537420b21c487a51042bcd9b837b 100644 (file)
--- a/packages/compiler-ssr/src/ssrCodegenTransform.ts
+++ b/packages/compiler-ssr/src/ssrCodegenTransform.ts
@@ -10,7 +10,7 @@ import {
   ElementTypes,
   createBlockStatement
 } from '@vue/compiler-dom'
-import { isString } from '@vue/shared'
+import { isString, escapeHtml } from '@vue/shared'
 
 // Because SSR codegen output is completely different from client-side output
 // (e.g. multiple elements can be concatenated into a single template literal
@@ -85,7 +85,7 @@ function processChildren(
         // TODO
       }
     } else if (child.type === NodeTypes.TEXT) {
-      // TODO
+      context.pushStringPart(escapeHtml(child.content))
     } else if (child.type === NodeTypes.IF) {
       // TODO
     } else if (child.type === NodeTypes.FOR) {

diff --git a/packages/compiler-ssr/src/transforms/ssrTransformElement.ts b/packages/compiler-ssr/src/transforms/ssrTransformElement.ts
index e522b350fdf0b67279cbba016707801084eb180f..89b514d9570ac739817b4e3014dda81fcfc34890 100644 (file)
--- a/packages/compiler-ssr/src/transforms/ssrTransformElement.ts
+++ b/packages/compiler-ssr/src/transforms/ssrTransformElement.ts
@@ -5,7 +5,7 @@ import {
   TemplateLiteral,
   createTemplateLiteral
 } from '@vue/compiler-dom'
-import { escapeHtml } from '@vue/server-renderer'
+import { escapeHtml } from '@vue/shared'
 
 /*
 ## Simple Element

diff --git a/packages/server-renderer/__tests__/ssrUtils.spec.ts b/packages/server-renderer/__tests__/interpolate.spec.ts
similarity index 60%
rename from packages/server-renderer/__tests__/ssrUtils.spec.ts
rename to packages/server-renderer/__tests__/interpolate.spec.ts
index 191f915c59b7d0c5f161f99d910043231ef8252a..9de4bb4a0e54134175889a3757198bf4387371f1 100644 (file)
--- a/packages/server-renderer/__tests__/ssrUtils.spec.ts
+++ b/packages/server-renderer/__tests__/interpolate.spec.ts
@@ -1,15 +1,5 @@
 import { escapeHtml, interpolate } from '../src'
 
-test('ssr: escapeHTML', () => {
-  expect(escapeHtml(`foo`)).toBe(`foo`)
-  expect(escapeHtml(true)).toBe(`true`)
-  expect(escapeHtml(false)).toBe(`false`)
-  expect(escapeHtml(`a && b`)).toBe(`a && b`)
-  expect(escapeHtml(`"foo"`)).toBe(`"foo"`)
-  expect(escapeHtml(`'bar'`)).toBe(`'bar'`)
-  expect(escapeHtml(`<div>`)).toBe(`&lt;div&gt;`)
-})
-
 test('ssr: interpolate', () => {
   expect(interpolate(0)).toBe(`0`)
   expect(interpolate(`foo`)).toBe(`foo`)

diff --git a/packages/server-renderer/src/index.ts b/packages/server-renderer/src/index.ts
index 1eb03e43bf074cb7ab7eaa76759b742a5553dec9..0b4be1ce520efbaed1a3399f51a9e00eb74ef3d2 100644 (file)
--- a/packages/server-renderer/src/index.ts
+++ b/packages/server-renderer/src/index.ts
@@ -4,4 +4,13 @@ export { renderToString } from './renderToString'
 // internal
 export { renderComponent, renderSlot } from './renderToString'
 export { renderClass, renderStyle, renderProps } from './renderProps'
-export { escapeHtml, interpolate } from './ssrUtils'
+
+// utils
+import { escapeHtml as _escapeHtml, toDisplayString } from '@vue/shared'
+
+// cast type to avoid dts dependency on @vue/shared (which is inlined)
+export const escapeHtml = _escapeHtml as (raw: string) => string
+
+export function interpolate(value: unknown): string {
+  return escapeHtml(toDisplayString(value))
+}

diff --git a/packages/server-renderer/src/renderProps.ts b/packages/server-renderer/src/renderProps.ts
index 53536f70132b77c66c35f0ded5049da90bfd6879..4830aca3529b9751c89dcb861f1656fe76583e55 100644 (file)
--- a/packages/server-renderer/src/renderProps.ts
+++ b/packages/server-renderer/src/renderProps.ts
@@ -1,4 +1,4 @@
-import { escapeHtml } from './ssrUtils'
+import { escapeHtml } from '@vue/shared'
 import {
   normalizeClass,
   normalizeStyle,

diff --git a/packages/server-renderer/src/renderToString.ts b/packages/server-renderer/src/renderToString.ts
index f19ab09d99c75c636d2ad0ab5b25211b1ec33130..b649e4db784fc2de7c0910cd29bb639de0c08fb0 100644 (file)
--- a/packages/server-renderer/src/renderToString.ts
+++ b/packages/server-renderer/src/renderToString.ts
@@ -22,7 +22,7 @@ import {
   isVoidTag
 } from '@vue/shared'
 import { renderProps } from './renderProps'
-import { escapeHtml } from './ssrUtils'
+import { escapeHtml } from '@vue/shared'
 
 const {
   isVNode,

diff --git a/packages/shared/__tests__/escapeHtml.spec.ts b/packages/shared/__tests__/escapeHtml.spec.ts
new file mode 100644 (file)
index 0000000..34505d3
--- /dev/null
+++ b/packages/shared/__tests__/escapeHtml.spec.ts
@@ -0,0 +1,11 @@
+import { escapeHtml } from '../src'
+
+test('ssr: escapeHTML', () => {
+  expect(escapeHtml(`foo`)).toBe(`foo`)
+  expect(escapeHtml(true)).toBe(`true`)
+  expect(escapeHtml(false)).toBe(`false`)
+  expect(escapeHtml(`a && b`)).toBe(`a && b`)
+  expect(escapeHtml(`"foo"`)).toBe(`"foo"`)
+  expect(escapeHtml(`'bar'`)).toBe(`'bar'`)
+  expect(escapeHtml(`<div>`)).toBe(`&lt;div&gt;`)
+})

diff --git a/packages/server-renderer/src/ssrUtils.ts b/packages/shared/src/escapeHtml.ts
similarity index 86%
rename from packages/server-renderer/src/ssrUtils.ts
rename to packages/shared/src/escapeHtml.ts
index 9c71e90204b6ddbaeb12f138c3f19debdb8bab4c..7546471a9cb09ffb12a7e8a689d68ef33478fb93 100644 (file)
--- a/packages/server-renderer/src/ssrUtils.ts
+++ b/packages/shared/src/escapeHtml.ts
@@ -1,5 +1,3 @@
-import { toDisplayString } from '@vue/shared'
-
 const escapeRE = /["'&<>]/
 
 export function escapeHtml(string: unknown) {
@@ -45,7 +43,3 @@ export function escapeHtml(string: unknown) {
 
   return lastIndex !== index ? html + str.substring(lastIndex, index) : html
 }
-
-export function interpolate(value: unknown) {
-  return escapeHtml(toDisplayString(value))
-}

diff --git a/packages/shared/src/index.ts b/packages/shared/src/index.ts
index 59b5bb648ee258c72b8c484b9c1706456ea9d9aa..3a1c07f2d604a143b18bba7946a418899b05bb76 100644 (file)
--- a/packages/shared/src/index.ts
+++ b/packages/shared/src/index.ts
@@ -8,6 +8,7 @@ export * from './mockWarn'
 export * from './normalizeProp'
 export * from './domTagConfig'
 export * from './domAttrConfig'
+export * from './escapeHtml'
 
 export const EMPTY_OBJ: { readonly [key: string]: any } = __DEV__
   ? Object.freeze({})