styled-components v6 support (#438)

* chore: internal upgrade to v6

* fix: resolve issue with stylis v4 missing descendent selector spacing

* refactor: unnecessary capture group

* chore: node 20

* chore: update workflow

.github/workflows/ci.yml

@@ -1,29 +1,34 @@
 name: CI
 
-on: [push, pull_request_target]
+on:
+  push:
+    branches:
+      - "main"
+  pull_request_target:
 
 jobs:
   test:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v3
 
       - name: Setup node
-        uses: actions/setup-node@v1
+        uses: actions/setup-node@v3
         with:
-          node-version: 12
+          node-version-file: '.nvmrc'
 
       - name: Get yarn cache directory path
         id: yarn-cache-dir-path
-        run: echo "::set-output name=dir::$(yarn cache dir)"
+        run: echo "::set-output name=dir::$(yarn config get cacheFolder)"
 
-      - uses: actions/cache@v1
+      - name: Restore yarn cache
+        uses: actions/cache@v2
         id: yarn-cache # use this to check for `cache-hit` (`steps.yarn-cache.outputs.cache-hit != 'true'`)
         with:
           path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
-          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
+          key: yarn-cache-folder-${{ hashFiles('**/yarn.lock', '.yarnrc.yml') }}
           restore-keys: |
-            ${{ runner.os }}-yarn-
+            yarn-cache-folder-
 
       - name: Install modules
         run: yarn --pure-lockfile

.nvmrc

@@ -0,0 +1 @@
+v20

package.json

@@ -51,7 +51,7 @@
     "react-is": "^17.0.2",
     "react-native": "^0.66.3",
     "react-test-renderer": "^17.0.2",
-    "styled-components": "^5.0.0"
+    "styled-components": "^6.0.9"
   },
   "dependencies": {
     "@adobe/css-tools": "^4.0.1"

src/toHaveStyleRule.js

@@ -47,6 +47,9 @@ const getAtRules = (ast, options) => {
     .reduce((acc, rules) => acc.concat(rules), []);
 };
 
+/** stylis v4 renders descendant selectors without a trailing space sometimes which trips up detection */
+const removeSpaceAfterSelector = input => input.replace(/([>~+]) +/g, '$1')
+
 const normalizeQuotations = (input) => input.replace(/['"]/g, '"');
 
 const getModifiedClassName = (className, staticClassName, modifier = '') => {
@@ -75,8 +78,8 @@ const hasClassNames = (classNames, selectors, options) => {
 
   return classNames.some((className) =>
     staticClassNames.some((staticClassName) =>
-      selectors.includes(
-        normalizeQuotations(getModifiedClassName(className, staticClassName, options.modifier).replace(/['"]/g, '"'))
+      selectors.map(removeSpaceAfterSelector).includes(
+        removeSpaceAfterSelector(normalizeQuotations(getModifiedClassName(className, staticClassName, options.modifier).replace(/['"]/g, '"')))
       )
     )
   );

src/utils.js

@@ -8,6 +8,7 @@ if (!__PRIVATE__) {
 const { mainSheet, masterSheet } = __PRIVATE__;
 
 const sheet = mainSheet || masterSheet;
+
 const isServer = () => typeof document === 'undefined';
 
 const resetStyleSheet = () => {
@@ -18,6 +19,7 @@ const resetStyleSheet = () => {
     }
   }
 
+  sheet.gs = {};
   sheet.names = new Map();
   sheet.clearTag();
 };
@@ -63,7 +65,7 @@ const buildReturnMessage = (utils, pass, property, received, expected) => () =>
 const matcherTest = (received, expected, isNot) => {
   // when negating, assert on existence of the style, rather than the value
   if (isNot && expected === undefined) {
-      return received !== undefined;
+    return received !== undefined;
   }
 
   try {