wip(ssr): should only render renderable values

diff --git a/packages/server-renderer/__tests__/renderAttrs.spec.ts b/packages/server-renderer/__tests__/renderAttrs.spec.ts
index 54ac2cea0ca4a91ff42173b640ffe27a2cc1a820..69d966b6473fd5ddc9d62bd636ede3b40ad4c653 100644 (file)
--- a/packages/server-renderer/__tests__/renderAttrs.spec.ts
+++ b/packages/server-renderer/__tests__/renderAttrs.spec.ts
@@ -53,6 +53,16 @@ describe('ssr: renderAttrs', () => {
     ).toBe(` foo="false"`) // non boolean should render `false` as is
   })
 
+  test('ingore non-renderable values', () => {
+    expect(
+      renderAttrs({
+        foo: {},
+        bar: [],
+        baz: () => {}
+      })
+    ).toBe(``)
+  })
+
   test('props to attrs', () => {
     expect(
       renderAttrs({

diff --git a/packages/server-renderer/src/helpers/renderAttrs.ts b/packages/server-renderer/src/helpers/renderAttrs.ts
index eaeb9e9bd1effe34cd91c6a09ca0798168e4dc7d..237b08082bd7f035554de7bf809713e60ac77724 100644 (file)
--- a/packages/server-renderer/src/helpers/renderAttrs.ts
+++ b/packages/server-renderer/src/helpers/renderAttrs.ts
@@ -45,7 +45,7 @@ export function renderDynamicAttr(
   value: unknown,
   tag?: string
 ): string {
-  if (value == null) {
+  if (!isRenderableValue(value)) {
     return ``
   }
   const attrKey =
@@ -64,12 +64,20 @@ export function renderDynamicAttr(
 // Render a v-bind attr with static key. The key is pre-processed at compile
 // time and we only need to check and escape value.
 export function renderAttr(key: string, value: unknown): string {
-  if (value == null) {
+  if (!isRenderableValue(value)) {
     return ``
   }
   return ` ${key}="${escapeHtml(value)}"`
 }
 
+function isRenderableValue(value: unknown): boolean {
+  if (value == null) {
+    return false
+  }
+  const type = typeof value
+  return type === 'string' || type === 'number' || type === 'boolean'
+}
+
 export function renderClass(raw: unknown): string {
   return escapeHtml(normalizeClass(raw))
 }