@readme/stylelint-config 3.2.2 → 4.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +8 -0
- package/__tests__/__snapshots__/{index.js.snap → index.test.js.snap} +18 -15
- package/__tests__/{index.js → index.test.js} +31 -6
- package/__tests__/invalid.scss +13 -15
- package/__tests__/valid.scss +13 -15
- package/package.json +6 -6
- /package/{.eslintrc.js → .eslintrc.cjs} +0 -0
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,14 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
# [4.0.0](https://github.com/readmeio/standards/compare/@readme/stylelint-config@3.2.2...@readme/stylelint-config@4.0.0) (2023-08-03)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @readme/stylelint-config
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
6
14
|
## [3.2.2](https://github.com/readmeio/standards/compare/@readme/stylelint-config@3.2.1...@readme/stylelint-config@3.2.2) (2023-07-05)
|
|
7
15
|
|
|
8
16
|
|
|
@@ -1,11 +1,16 @@
|
|
|
1
1
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
|
2
2
|
|
|
3
|
+
exports[`stylelint-config prettier rules matches snapshot with all formatting errors fixed 1`] = `
|
|
4
|
+
"$prettier: 'should be single quotes';
|
|
5
|
+
"
|
|
6
|
+
`;
|
|
7
|
+
|
|
3
8
|
exports[`stylelint-config with an invalid file and auto-fix enabled matches the auto-fixed snapshot 1`] = `
|
|
4
|
-
"@import
|
|
5
|
-
@import
|
|
9
|
+
"@import 'x.css';
|
|
10
|
+
@import 'y.css';
|
|
6
11
|
|
|
7
|
-
$one:
|
|
8
|
-
$twoCamelCase:
|
|
12
|
+
$one: 'one';
|
|
13
|
+
$twoCamelCase: 'two';
|
|
9
14
|
|
|
10
15
|
/**
|
|
11
16
|
* Multi-line comment
|
|
@@ -33,7 +38,7 @@ $twoCamelCase: "two";
|
|
|
33
38
|
|
|
34
39
|
.selector-1,
|
|
35
40
|
.selector-2,
|
|
36
|
-
.selector-3[type=
|
|
41
|
+
.selector-3[type='text'] {
|
|
37
42
|
background: linear-gradient(#fff, rgb(0 0 0 / 0.8));
|
|
38
43
|
box-sizing: border-box;
|
|
39
44
|
color: var(--brand-red);
|
|
@@ -70,7 +75,7 @@ $twoCamelCase: "two";
|
|
|
70
75
|
@media (orientation: portrait), projection and (color) {
|
|
71
76
|
.selector-i + .selector-ii {
|
|
72
77
|
background: hsl(20deg 25% 33%);
|
|
73
|
-
font-family: Helvetica,
|
|
78
|
+
font-family: Helvetica, 'Arial Black', sans-serif;
|
|
74
79
|
}
|
|
75
80
|
}
|
|
76
81
|
|
|
@@ -78,13 +83,11 @@ $twoCamelCase: "two";
|
|
|
78
83
|
@media screen and (min-resolution: 192dpi), screen and (min-resolution: 2dppx) {
|
|
79
84
|
.selector {
|
|
80
85
|
animation: 3s none fade-in;
|
|
81
|
-
background-image: repeating-linear-gradient(
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
#fff
|
|
85
|
-
|
|
86
|
-
);
|
|
87
|
-
box-shadow: 0 1px 1px #000, 0 1px 0 #fff, 2px 2px 1px 1px #ccc inset;
|
|
86
|
+
background-image: repeating-linear-gradient(-45deg, transparent, #fff 25px, rgb(255 255 255 / 1) 50px);
|
|
87
|
+
box-shadow:
|
|
88
|
+
0 1px 1px #000,
|
|
89
|
+
0 1px 0 #fff,
|
|
90
|
+
2px 2px 1px 1px #ccc inset;
|
|
88
91
|
height: 10rem;
|
|
89
92
|
margin: 10px;
|
|
90
93
|
margin-bottom: 5px;
|
|
@@ -92,8 +95,8 @@ $twoCamelCase: "two";
|
|
|
92
95
|
|
|
93
96
|
/* Flush nested single line comment */
|
|
94
97
|
.selector::after {
|
|
95
|
-
background-image: url(
|
|
96
|
-
content:
|
|
98
|
+
background-image: url('x.svg');
|
|
99
|
+
content: '→';
|
|
97
100
|
}
|
|
98
101
|
}
|
|
99
102
|
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
const fs = require('fs');
|
|
2
|
+
const path = require('path');
|
|
2
3
|
|
|
3
4
|
const stylelint = require('stylelint');
|
|
4
5
|
|
|
5
6
|
const config = require('..');
|
|
6
7
|
|
|
7
|
-
const invalidScss = fs.readFileSync('./
|
|
8
|
-
const validScss = fs.readFileSync('./
|
|
8
|
+
const invalidScss = fs.readFileSync(path.join(__dirname, './invalid.scss'), 'utf-8');
|
|
9
|
+
const validScss = fs.readFileSync(path.join(__dirname, './valid.scss'), 'utf-8');
|
|
9
10
|
|
|
10
11
|
describe('stylelint-config', () => {
|
|
11
12
|
let data;
|
|
@@ -51,22 +52,22 @@ describe('stylelint-config', () => {
|
|
|
51
52
|
expect(warnings).toContainEqual(
|
|
52
53
|
expect.objectContaining({
|
|
53
54
|
text: expect.stringMatching(/scss\/dollar-variable-pattern/),
|
|
54
|
-
})
|
|
55
|
+
}),
|
|
55
56
|
);
|
|
56
57
|
expect(warnings).toContainEqual(
|
|
57
58
|
expect.objectContaining({
|
|
58
59
|
text: expect.stringMatching(/color-function-notation/),
|
|
59
|
-
})
|
|
60
|
+
}),
|
|
60
61
|
);
|
|
61
62
|
expect(warnings).toContainEqual(
|
|
62
63
|
expect.objectContaining({
|
|
63
64
|
text: expect.stringMatching(/selector-id-pattern/),
|
|
64
|
-
})
|
|
65
|
+
}),
|
|
65
66
|
);
|
|
66
67
|
expect(warnings).toContainEqual(
|
|
67
68
|
expect.objectContaining({
|
|
68
69
|
text: expect.stringMatching(/selector-max-id/),
|
|
69
|
-
})
|
|
70
|
+
}),
|
|
70
71
|
);
|
|
71
72
|
});
|
|
72
73
|
|
|
@@ -82,4 +83,28 @@ describe('stylelint-config', () => {
|
|
|
82
83
|
expect(data.output).toContain('&:not(.one):not(.two):not(.three)');
|
|
83
84
|
});
|
|
84
85
|
});
|
|
86
|
+
|
|
87
|
+
describe('prettier rules', () => {
|
|
88
|
+
it('matches snapshot with all formatting errors fixed', async () => {
|
|
89
|
+
data = await stylelint.lint({
|
|
90
|
+
code: `
|
|
91
|
+
$prettier: "should be single quotes";
|
|
92
|
+
`,
|
|
93
|
+
config,
|
|
94
|
+
fix: true,
|
|
95
|
+
});
|
|
96
|
+
({ warnings } = data.results[0]);
|
|
97
|
+
expect(data.output).toMatchSnapshot();
|
|
98
|
+
});
|
|
99
|
+
|
|
100
|
+
it('flags double quotes as an error', async () => {
|
|
101
|
+
data = await stylelint.lint({
|
|
102
|
+
code: '$prettier: "should be single quotes"',
|
|
103
|
+
config,
|
|
104
|
+
});
|
|
105
|
+
({ warnings } = data.results[0]);
|
|
106
|
+
expect(warnings).toHaveLength(1);
|
|
107
|
+
expect(warnings[0].rule).toBe('prettier/prettier');
|
|
108
|
+
});
|
|
109
|
+
});
|
|
85
110
|
});
|
package/__tests__/invalid.scss
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
@import url(
|
|
2
|
-
@import url(
|
|
1
|
+
@import url('x.css');
|
|
2
|
+
@import url('y.css');
|
|
3
3
|
|
|
4
|
-
$one:
|
|
5
|
-
$twoCamelCase:
|
|
4
|
+
$one: 'one';
|
|
5
|
+
$twoCamelCase: 'two';
|
|
6
6
|
|
|
7
7
|
/**
|
|
8
8
|
* Multi-line comment
|
|
@@ -30,7 +30,7 @@ $twoCamelCase: "two";
|
|
|
30
30
|
|
|
31
31
|
.selector-1,
|
|
32
32
|
.selector-2,
|
|
33
|
-
.selector-3[type=
|
|
33
|
+
.selector-3[type='text'] {
|
|
34
34
|
background: linear-gradient(#fff, rgb(0 0 0 / 80%));
|
|
35
35
|
box-sizing: border-box;
|
|
36
36
|
display: block;
|
|
@@ -65,7 +65,7 @@ $twoCamelCase: "two";
|
|
|
65
65
|
@media (orientation: portrait), projection and (color) {
|
|
66
66
|
.selector-i + .selector-ii {
|
|
67
67
|
background: hsl(20deg 25% 33%);
|
|
68
|
-
font-family: Helvetica,
|
|
68
|
+
font-family: Helvetica, 'Arial Black', sans-serif;
|
|
69
69
|
}
|
|
70
70
|
}
|
|
71
71
|
|
|
@@ -73,22 +73,20 @@ $twoCamelCase: "two";
|
|
|
73
73
|
@media screen and (min-resolution: 192dpi), screen and (min-resolution: 2dppx) {
|
|
74
74
|
.selector {
|
|
75
75
|
animation: 3s none fade-in;
|
|
76
|
-
background-image: repeating-linear-gradient(
|
|
77
|
-
-45deg,
|
|
78
|
-
transparent,
|
|
79
|
-
#fff 25px,
|
|
80
|
-
rgb(255 255 255 / 100%) 50px
|
|
81
|
-
);
|
|
76
|
+
background-image: repeating-linear-gradient(-45deg, transparent, #fff 25px, rgb(255 255 255 / 100%) 50px);
|
|
82
77
|
margin: 10px;
|
|
83
78
|
margin-bottom: 5px;
|
|
84
|
-
box-shadow:
|
|
79
|
+
box-shadow:
|
|
80
|
+
0 1px 1px #000,
|
|
81
|
+
0 1px 0 #fff,
|
|
82
|
+
2px 2px 1px 1px #ccc inset;
|
|
85
83
|
height: 10rem;
|
|
86
84
|
}
|
|
87
85
|
|
|
88
86
|
/* Flush nested single line comment */
|
|
89
87
|
.selector::after {
|
|
90
|
-
content:
|
|
91
|
-
background-image: url(
|
|
88
|
+
content: '→';
|
|
89
|
+
background-image: url('x.svg');
|
|
92
90
|
}
|
|
93
91
|
}
|
|
94
92
|
|
package/__tests__/valid.scss
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
@import
|
|
2
|
-
@import
|
|
1
|
+
@import 'x.css';
|
|
2
|
+
@import 'y.css';
|
|
3
3
|
|
|
4
|
-
$one:
|
|
5
|
-
$two-kebab-case:
|
|
4
|
+
$one: 'one';
|
|
5
|
+
$two-kebab-case: 'two';
|
|
6
6
|
$media-query-width: 300px;
|
|
7
7
|
|
|
8
8
|
/**
|
|
@@ -23,7 +23,7 @@ $media-query-width: 300px;
|
|
|
23
23
|
|
|
24
24
|
.selector-1,
|
|
25
25
|
.selector-2,
|
|
26
|
-
.selector-3[type=
|
|
26
|
+
.selector-3[type='text'] {
|
|
27
27
|
background: linear-gradient(#fff, rgba(0, 0, 0, 0.8));
|
|
28
28
|
box-sizing: border-box;
|
|
29
29
|
color: var(--brand-red);
|
|
@@ -64,7 +64,7 @@ $media-query-width: 300px;
|
|
|
64
64
|
@media (orientation: portrait), projection and (color) {
|
|
65
65
|
.selector-i + .selector-ii {
|
|
66
66
|
background: rgb(105, 77, 63);
|
|
67
|
-
font-family: Helvetica,
|
|
67
|
+
font-family: Helvetica, 'Arial Black', sans-serif;
|
|
68
68
|
}
|
|
69
69
|
}
|
|
70
70
|
|
|
@@ -72,13 +72,11 @@ $media-query-width: 300px;
|
|
|
72
72
|
@media screen and (min-resolution: 192dpi), screen and (min-resolution: 2dppx) {
|
|
73
73
|
.selector {
|
|
74
74
|
animation: 3s none fade-in;
|
|
75
|
-
background-image: repeating-linear-gradient(
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
#fff
|
|
79
|
-
|
|
80
|
-
);
|
|
81
|
-
box-shadow: 0 1px 1px #000, 0 1px 0 #fff, 2px 2px 1px 1px #ccc inset;
|
|
75
|
+
background-image: repeating-linear-gradient(-45deg, transparent, #fff 25px, rgb(255, 255, 255, 1) 50px);
|
|
76
|
+
box-shadow:
|
|
77
|
+
0 1px 1px #000,
|
|
78
|
+
0 1px 0 #fff,
|
|
79
|
+
2px 2px 1px 1px #ccc inset;
|
|
82
80
|
height: 10rem;
|
|
83
81
|
margin: 10px;
|
|
84
82
|
margin-bottom: 5px;
|
|
@@ -86,8 +84,8 @@ $media-query-width: 300px;
|
|
|
86
84
|
|
|
87
85
|
/* Flush nested single line comment */
|
|
88
86
|
.selector::after {
|
|
89
|
-
background-image: url(
|
|
90
|
-
content:
|
|
87
|
+
background-image: url('x.svg');
|
|
88
|
+
content: '→';
|
|
91
89
|
}
|
|
92
90
|
}
|
|
93
91
|
|
package/package.json
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@readme/stylelint-config",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "4.0.0",
|
|
4
4
|
"description": "ReadMe coding standards for styles",
|
|
5
5
|
"main": "src/index.js",
|
|
6
6
|
"scripts": {
|
|
7
7
|
"lint": "eslint .",
|
|
8
|
-
"test": "jest"
|
|
8
|
+
"test": "NODE_OPTIONS=--experimental-vm-modules jest"
|
|
9
9
|
},
|
|
10
10
|
"repository": {
|
|
11
11
|
"type": "git",
|
|
@@ -18,20 +18,20 @@
|
|
|
18
18
|
},
|
|
19
19
|
"homepage": "https://github.com/readmeio/standards",
|
|
20
20
|
"dependencies": {
|
|
21
|
-
"stylelint": "^15.10.
|
|
21
|
+
"stylelint": "^15.10.2",
|
|
22
22
|
"stylelint-config-css-modules": "^4.2.0",
|
|
23
23
|
"stylelint-config-sass-guidelines": "^10.0.0",
|
|
24
24
|
"stylelint-config-standard": "^34.0.0",
|
|
25
25
|
"stylelint-config-standard-scss": "^10.0.0",
|
|
26
26
|
"stylelint-order": "^6.0.3",
|
|
27
|
-
"stylelint-prettier": "^
|
|
27
|
+
"stylelint-prettier": "^4.0.2"
|
|
28
28
|
},
|
|
29
29
|
"peerDependencies": {
|
|
30
30
|
"postcss": "^8.4.12"
|
|
31
31
|
},
|
|
32
32
|
"devDependencies": {
|
|
33
|
-
"@readme/eslint-config": "^
|
|
33
|
+
"@readme/eslint-config": "^11.0.0",
|
|
34
34
|
"jest": "^29.4.3"
|
|
35
35
|
},
|
|
36
|
-
"gitHead": "
|
|
36
|
+
"gitHead": "2d4b64f7fe85193bf65bf549605e3a65b1cb09a1"
|
|
37
37
|
}
|
|
File without changes
|