diff --git a/src/platforms/web/compiler/modules/class.js b/src/platforms/web/compiler/modules/class.js index dcb5a229c2b..378c959c9d7 100644 --- a/src/platforms/web/compiler/modules/class.js +++ b/src/platforms/web/compiler/modules/class.js @@ -23,7 +23,7 @@ function transformNode (el: ASTElement, options: CompilerOptions) { } } if (staticClass) { - el.staticClass = JSON.stringify(staticClass) + el.staticClass = JSON.stringify(staticClass.replace(/\s+/g, ' ').trim()) } const classBinding = getBindingAttr(el, 'class', false /* getStatic */) if (classBinding) { diff --git a/test/ssr/ssr-string.spec.js b/test/ssr/ssr-string.spec.js index b4f962872f5..33094be9c33 100644 --- a/test/ssr/ssr-string.spec.js +++ b/test/ssr/ssr-string.spec.js @@ -1351,7 +1351,7 @@ describe('SSR: renderToString', () => { ` }, result => { - expect(result).toContain(`
`) + expect(result).toContain(``) done() }) }) diff --git a/test/unit/features/directives/class.spec.js b/test/unit/features/directives/class.spec.js index 0ee3380ca9a..38a25988d2a 100644 --- a/test/unit/features/directives/class.spec.js +++ b/test/unit/features/directives/class.spec.js @@ -152,6 +152,39 @@ describe('Directive v-bind:class', () => { }).then(done) }) + // css static classes should only contain a single space in between, + // as all the text inside of classes is shipped as a JS string + // and this could lead to useless spacing in static classes + it('condenses whitespace in staticClass', done => { + const vm = new Vue({ + template: '', + }).$mount() + expect(vm.$el.className).toBe('test1 test2 test3 test4 test5 test6') + done() + }) + + it('condenses whitespace in staticClass merge in a component', done => { + const vm = new Vue({ + template: ` +