fix(SSR): Properly handle newlines and whitespace in SSR classnames

When encountering newlines in SSR classnames, do not render "\n"" and
instead replace the new line with a space.

Once newlines are removed, indentation from subsequent lines can leave
classnames abnormally spaced out, so replace multiple spaces with a
single space

fix vuejs#7859

src/platforms/web/compiler/modules/class.js

@@ -22,7 +22,7 @@ function transformNode (el: ASTElement, options: CompilerOptions) {
     }
   }
   if (staticClass) {
-    el.staticClass = JSON.stringify(staticClass)
+    el.staticClass = JSON.stringify(staticClass.replace(/\n/g, ' ').replace(/ +/g, ' '))
   }
   const classBinding = getBindingAttr(el, 'class', false /* getStatic */)
   if (classBinding) {

test/ssr/ssr-string.spec.js

@@ -1211,6 +1211,37 @@ describe('SSR: renderToString', () => {
     })
   })
 
+  // #7859
+  it('should remove and trim newlines in class attributes', done => {
+    renderVmWithOptions({
+      template: `
+      <div>
+        <div class="a b
+                    c d">
+        </div>
+      </div>
+      `
+    }, result => {
+      expect(result).toContain(`<div class="a b c d"></div>`)
+      done()
+    })
+  })
+
+  // #7859
+  it('should trim excess whigtespace in class attributes', done => {
+    renderVmWithOptions({
+      template: `
+      <div>
+        <div class="a    b c      d">
+        </div>
+      </div>
+      `
+    }, result => {
+      expect(result).toContain(`<div class="a b c d"></div>`)
+      done()
+    })
+  })
+
   it('should expose ssr helpers on functional context', done => {
     let called = false
     renderVmWithOptions({