fix(server-renderer): use ssrRenderClass helper for className attribute (#14327)

fix https://github.com/vuejs/core/security/advisories/GHSA-5c3j-59mh-x5gj

diff --git a/packages/server-renderer/__tests__/ssrRenderAttrs.spec.ts b/packages/server-renderer/__tests__/ssrRenderAttrs.spec.ts
index 984387bb864a02f45031490c39169a769d91989b..e7332455db14af8155541ba985f7094469ed5571 100644 (file)
--- a/packages/server-renderer/__tests__/ssrRenderAttrs.spec.ts
+++ b/packages/server-renderer/__tests__/ssrRenderAttrs.spec.ts
@@ -154,7 +154,7 @@ describe('ssr: renderClass', () => {
       ssrRenderAttrs({
         className: ['foo', 'bar'],
       }),
-    ).toBe(` class="foo,bar"`)
+    ).toBe(` class="foo bar"`)
   })
 })
 

diff --git a/packages/server-renderer/src/helpers/ssrRenderAttrs.ts b/packages/server-renderer/src/helpers/ssrRenderAttrs.ts
index b082da03fe8053b46c558e496b9afebf79c84238..903a9c9b3d4b36a5ba29d4bf87dfd2168aab1de1 100644 (file)
--- a/packages/server-renderer/src/helpers/ssrRenderAttrs.ts
+++ b/packages/server-renderer/src/helpers/ssrRenderAttrs.ts
@@ -38,12 +38,10 @@ export function ssrRenderAttrs(
       continue
     }
     const value = props[key]
-    if (key === 'class') {
+    if (key === 'class' || key === 'className') {
       ret += ` class="${ssrRenderClass(value)}"`
     } else if (key === 'style') {
       ret += ` style="${ssrRenderStyle(value)}"`
-    } else if (key === 'className') {
-      ret += ` class="${String(value)}"`
     } else {
       ret += ssrRenderDynamicAttr(key, value, tag)
     }