Skip to content

Commit ecbda18

Browse files
authored
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
1 parent 4323c9d commit ecbda18

File tree

8 files changed

+1355
-182
lines changed

8 files changed

+1355
-182
lines changed

.github/workflows/ci.yml

Lines changed: 13 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,34 @@
11
name: CI
22

3-
on: [push, pull_request_target]
3+
on:
4+
push:
5+
branches:
6+
- "main"
7+
pull_request_target:
48

59
jobs:
610
test:
711
runs-on: ubuntu-latest
812
steps:
9-
- uses: actions/checkout@v2
13+
- uses: actions/checkout@v3
1014

1115
- name: Setup node
12-
uses: actions/setup-node@v1
16+
uses: actions/setup-node@v3
1317
with:
14-
node-version: 12
18+
node-version-file: '.nvmrc'
1519

1620
- name: Get yarn cache directory path
1721
id: yarn-cache-dir-path
18-
run: echo "::set-output name=dir::$(yarn cache dir)"
22+
run: echo "::set-output name=dir::$(yarn config get cacheFolder)"
1923

20-
- uses: actions/cache@v1
24+
- name: Restore yarn cache
25+
uses: actions/cache@v2
2126
id: yarn-cache # use this to check for `cache-hit` (`steps.yarn-cache.outputs.cache-hit != 'true'`)
2227
with:
2328
path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
24-
key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
29+
key: yarn-cache-folder-${{ hashFiles('**/yarn.lock', '.yarnrc.yml') }}
2530
restore-keys: |
26-
${{ runner.os }}-yarn-
31+
yarn-cache-folder-
2732
2833
- name: Install modules
2934
run: yarn --pure-lockfile

.nvmrc

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
v20

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,7 @@
5151
"react-is": "^17.0.2",
5252
"react-native": "^0.66.3",
5353
"react-test-renderer": "^17.0.2",
54-
"styled-components": "^5.0.0"
54+
"styled-components": "^6.0.9"
5555
},
5656
"dependencies": {
5757
"@adobe/css-tools": "^4.0.1"

src/toHaveStyleRule.js

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,9 @@ const getAtRules = (ast, options) => {
4747
.reduce((acc, rules) => acc.concat(rules), []);
4848
};
4949

50+
/** stylis v4 renders descendant selectors without a trailing space sometimes which trips up detection */
51+
const removeSpaceAfterSelector = input => input.replace(/([>~+]) +/g, '$1')
52+
5053
const normalizeQuotations = (input) => input.replace(/['"]/g, '"');
5154

5255
const getModifiedClassName = (className, staticClassName, modifier = '') => {
@@ -75,8 +78,8 @@ const hasClassNames = (classNames, selectors, options) => {
7578

7679
return classNames.some((className) =>
7780
staticClassNames.some((staticClassName) =>
78-
selectors.includes(
79-
normalizeQuotations(getModifiedClassName(className, staticClassName, options.modifier).replace(/['"]/g, '"'))
81+
selectors.map(removeSpaceAfterSelector).includes(
82+
removeSpaceAfterSelector(normalizeQuotations(getModifiedClassName(className, staticClassName, options.modifier).replace(/['"]/g, '"')))
8083
)
8184
)
8285
);

src/utils.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ if (!__PRIVATE__) {
88
const { mainSheet, masterSheet } = __PRIVATE__;
99

1010
const sheet = mainSheet || masterSheet;
11+
1112
const isServer = () => typeof document === 'undefined';
1213

1314
const resetStyleSheet = () => {
@@ -18,6 +19,7 @@ const resetStyleSheet = () => {
1819
}
1920
}
2021

22+
sheet.gs = {};
2123
sheet.names = new Map();
2224
sheet.clearTag();
2325
};
@@ -63,7 +65,7 @@ const buildReturnMessage = (utils, pass, property, received, expected) => () =>
6365
const matcherTest = (received, expected, isNot) => {
6466
// when negating, assert on existence of the style, rather than the value
6567
if (isNot && expected === undefined) {
66-
return received !== undefined;
68+
return received !== undefined;
6769
}
6870

6971
try {

0 commit comments

Comments
 (0)