Преглед на файлове

Update ssr class render (fix #4143) (#4146)

* fix ssr class render

* update test case
chengchao преди 9 години
родител
ревизия
33cf1134ed
променени са 2 файла, в които са добавени 39 реда и са изтрити 2 реда
  1. 3 2
      src/platforms/web/server/modules/class.js
  2. 36 0
      test/ssr/ssr-string.spec.js

+ 3 - 2
src/platforms/web/server/modules/class.js

@@ -3,7 +3,8 @@
 import { genClassForVnode } from 'web/util/index'
 
 export default function renderClass (node: VNodeWithData): ?string {
-  if (node.data.class || node.data.staticClass) {
-    return ` class="${genClassForVnode(node)}"`
+  const classList = genClassForVnode(node)
+  if (classList) {
+    return ` class="${classList}"`
   }
 }

+ 36 - 0
test/ssr/ssr-string.spec.js

@@ -57,6 +57,42 @@ describe('SSR: renderToString', () => {
     })
   })
 
+  it('custome component class', done => {
+    renderVmWithOptions({
+      template: '<div><cmp class="cmp"></cmp></div>',
+      components: {
+        cmp: {
+          render: h => h('div', 'test')
+        }
+      }
+    }, result => {
+      expect(result).toContain('<div server-rendered="true"><div class="cmp">test</div></div>')
+      done()
+    })
+  })
+
+  it('nested component class', done => {
+    renderVmWithOptions({
+      template: '<cmp class="outer" :class="cls"></cmp>',
+      data: { cls: { 'success': 1 }},
+      components: {
+        cmp: {
+          render: h => h('div', [h('nested', { staticClass: 'nested', 'class': { 'error': 1 }})]),
+          components: {
+            nested: {
+              render: h => h('div', { staticClass: 'inner' }, 'test')
+            }
+          }
+        }
+      }
+    }, result => {
+      expect(result).toContain('<div server-rendered="true" class="outer success">' +
+          '<div class="inner nested error">test</div>' +
+        '</div>')
+      done()
+    })
+  })
+
   it('dynamic style', done => {
     renderVmWithOptions({
       template: '<div style="background-color:black" :style="{ fontSize: fontSize + \'px\', color: color }"></div>',