add whitespace trimming serializer to jest config

package.json

@@ -36,5 +36,10 @@
   "dependencies": {
     "babel-types": "^6.26.0",
     "stylis": "3.x"
+  },
+  "jest": {
+    "snapshotSerializers": [
+      "<rootDir>/test/whitespaceTrimmingSerializer.js"
+    ]
   }
 }

test/__snapshots__/index.test.js.snap

@@ -149,49 +149,49 @@ const Test = styled.div\`width:100%;\`;"
 exports[`fixtures should preprocess css 1`] = `
 "const Simple = styled.div.withConfig({
   displayName: \"14-preprocess-css__Simple\"
-})([[\"{width: 100%;}\"]]);
+})([[\"{width:100%;}\"]]);
 
 const Nested = styled.div.withConfig({
   displayName: \"14-preprocess-css__Nested\"
-})([[\"{width: 100%;}\"], [\":hover{color: papayawhip;}\"], [\" > div{background: white;}\"]]);
+})([[\"{width:100%;}\"], [\":hover{color:papayawhip;}\"], [\" > div{background:white;}\"]]);
 
 const Interpolations = styled.div.withConfig({
   displayName: \"14-preprocess-css__Interpolations\"
-})([[\"{width: \", props => props.width, \";}\"]]);
+})([[\"{width:\", props => props.width, \";}\"]]);
 
 const NestedAndInterpolations = styled.div.withConfig({
   displayName: \"14-preprocess-css__NestedAndInterpolations\"
-})([[\"{width: \", props => props.width, \";}\"], [\":hover{color: \", props => props.color, \";}\"]]);
+})([[\"{width:\", props => props.width, \";}\"], [\":hover{color:\", props => props.color, \";}\"]]);
 
 const SelectorInterpolation = styled.div.withConfig({
   displayName: \"14-preprocess-css__SelectorInterpolation\"
-})([[\"{width: \", props => props.width, \";}\"], [\" \", props => props.selector, \"{color: papayawhip;}\"]]);
+})([[\"{width:\", props => props.width, \";}\"], [\" \", props => props.selector, \"{color:papayawhip;}\"]]);
 
 const RulesetInterpolationA = styled.div.withConfig({
   displayName: \"14-preprocess-css__RulesetInterpolationA\"
-})([[\"{width: \", props => props.width, \";\", props => props.ruleset, \";}\"], [\":hover{color: papayawhip;}\"]]);
+})([[\"{width:\", props => props.width, \";\", props => props.ruleset, \";}\"], [\":hover{color:papayawhip;}\"]]);
 
 const RulesetInterpolationB = styled.div.withConfig({
   displayName: \"14-preprocess-css__RulesetInterpolationB\"
-})([[\"{\", props => props.ruleset, \";width: \", props => props.width, \";}\"], [\":hover{color: papayawhip;}\"]]);
+})([[\"{\", props => props.ruleset, \";width:\", props => props.width, \";}\"], [\":hover{color:papayawhip;}\"]]);
 
 const Prefixes = styled.div.withConfig({
   displayName: \"14-preprocess-css__Prefixes\"
-})([[\"{display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-align-items: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;}\"]]);
+})([[\"{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}\"]]);
 
 const DoubleInterpolation = styled.div.withConfig({
   displayName: \"14-preprocess-css__DoubleInterpolation\"
-})([[\"{margin: \", props => props.vert, \" \", props => props.hori, \";}\"]]);"
+})([[\"{margin:\", props => props.vert, \" \", props => props.hori, \";}\"]]);"
 `;
 
 exports[`fixtures should preprocess import 1`] = `
 "import styled from \'styled-components/no-parser\';
 require(\'styled-components/no-parser\');"
 `;
 
-exports[`fixtures should preprocess inject global 1`] = `"injectGlobal([[\"\", glob, \"\\nhtml,body{margin: 100000px;padding: \", test, \";}@media (max-width: 999px){html,body{margin: 0;}}.root{width: 100%;}\"]]);"`;
+exports[`fixtures should preprocess inject global 1`] = `"injectGlobal([[\"\", glob, \"\\n/*! preserve comment */html,body{margin:100000px;padding:\", test, \";}@media (max-width:999px){html,body{margin:0;}}.root{width:100%;}\"]]);"`;
 
-exports[`fixtures should preprocess keyframes 1`] = `"const Animation = keyframes([[\"@-webkit-keyframes \"], [\"{0%{opacity: 0;}100%{opacity: 1;}}@keyframes \"], [\"{0%{opacity: 0;}100%{opacity: 1;}}\"]]);"`;
+exports[`fixtures should preprocess keyframes 1`] = `"const Animation = keyframes([[\"@-webkit-keyframes \"], [\"{0%{opacity:0;}100%{opacity:1;}}@keyframes \"], [\"{0%{opacity:0;}100%{opacity:1;}}\"]]);"`;
 
 exports[`fixtures should track the imported variable 1`] = `
 "import s from \"styled-components\";
@@ -228,17 +228,17 @@ exports[`fixtures should transpile require default 1`] = `
 const TestNormal = styled.div.withConfig({
   displayName: \"19-transpile-require-default__TestNormal\",
   componentId: \"ydirwv-0\"
-})([[\"{width: 100%;}\"]]);
+})([[\"{width:100%;}\"]]);
 
 const Test = styled_default.default.div.withConfig({
   displayName: \"19-transpile-require-default__Test\",
   componentId: \"ydirwv-1\"
-})([[\"{width: 100%;}\"]]);
+})([[\"{width:100%;}\"]]);
 
 const TestCallExpression = styled_default.default(Test).withConfig({
   displayName: \"19-transpile-require-default__TestCallExpression\",
   componentId: \"ydirwv-2\"
-})([[\"{height: 20px;}\"]]);"
+})([[\"{height:20px;}\"]]);"
 `;
 
 exports[`fixtures should transpile template literals with config 1`] = `

test/index.test.js

@@ -3,10 +3,6 @@ import fs from 'fs'
 import { transformFileSync } from 'babel-core'
 import plugin from '../src'
 
-function trim(str) {
-  return str.replace(/^\s+|\s+$/, '');
-}
-
 describe('fixtures', () => {
   const fixturesDir = path.join(__dirname, 'fixtures')
   fs.readdirSync(fixturesDir).sort().map((caseName) => {
@@ -16,7 +12,8 @@ describe('fixtures', () => {
       const fixturePath = path.join(fixtureDir, 'index.js');
       const fixture = transformFileSync(fixturePath).code
 
-      expect(trim(fixture)).toMatchSnapshot()
+      console.log(fixture)
+      expect(fixture).toMatchSnapshot()
     })
   })
 })

test/whitespaceTrimmingSerializer.js

@@ -0,0 +1,9 @@
+const trailingWhitespaceRegex = /^\s+|\s+$/;
+
+module.exports = {
+    print(val, serialize, indent) {
+      return serialize(val.replace(trailingWhitespaceRegex, ''));
+    },
+
+    test(val) { return trailingWhitespaceRegex.test(val); },
+};