[+] Updated stylis to 3.x closing issue #28

Author: liqueflies

package-lock.json

@@ -37,7 +37,7 @@
     "glamor": "^2.20.24",
     "inline-style-prefixer": "^2.0.5",
     "lodash.isplainobject": "^4.0.6",
-    "stylis": "^2.0.3"
+    "stylis": "^3.5.4"
   },
   "devDependencies": {
     "@babel/cli": "^7.4.4",

package.json

@@ -27,7 +27,7 @@ export default (nameGenerator) => {
       if (!inserted[hash]) {
         const selector = nameGenerator(hash)
         inserted[hash] = selector
-        const css = stylis(`.${selector}`, flatCSS, false, false)
+        const css = stylis(`.${selector}`, flatCSS)
         this.insertedRule.appendRule(css)
       }
       return inserted[hash]

src/models/ComponentStyle.js

@@ -21,14 +21,9 @@ describe('css features', () => {
       }
     `
 
-    const Comp = styled.div`
-      animation: ${rotate} 2s linear infinite;
-    `
-
-    const vm = new Vue(Comp).$mount()
-
     expectCSSMatches(
-      '@keyframes iVXCSc { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } .a {-webkit-animation:iVXCSc 2s linear infinite;animation:iVXCSc 2s linear infinite;}'
+      '@keyframes iVXCSc { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }',
+      { rotate }
     )
   })
 })

src/test/keyframes.test.js

@@ -19,14 +19,18 @@ export const resetStyled = () => {
   return _styled(_styledComponent(_ComponentStyle(classNames)))
 }
 
-const stripWhitespace = str => str.trim().replace(/\s+/g, ' ')
+const stripWhitespace = str => str.trim()
+  .replace(/\s+/g, ' ')
+  .replace(/\s+\{/g, '{')
+  .replace(/\:\s+/g, ':')
 
 export const expectCSSMatches = (
   expectation,
   opts = {}
 ) => {
   const { ignoreWhitespace = true, styleSheet = mainStyleSheet } = opts
   const css = styleSheet.rules().map(rule => rule.cssText).join('\n')
+
   if (ignoreWhitespace) {
     expect(stripWhitespace(css)).toEqual(stripWhitespace(expectation))
   } else {