Skip to content

Commit 1dfe28f

Browse files
sosukesuzukisosukesuzuki
authored
Remove extra indentation in pseudo class function (#16572)
1 parent 3cf3f5a commit 1dfe28f

4 files changed

Lines changed: 144 additions & 2 deletions

File tree

‎changelog_unreleased/css/16572.md‎

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
#### Remove extra indentation in pseudo-class function (#16572 by @sosukesuzuki)
2+
3+
This change fixes a bug where extra indentation was added when line breaks were included in the argument list of pseudo-class functions like [`:where()`](https://developer.mozilla.org/en-US/docs/Web/CSS/:where), [`:is()`](https://developer.mozilla.org/en-US/docs/Web/CSS/:is), and [`:not`](https://developer.mozilla.org/en-US/docs/Web/CSS/:not).
4+
5+
<!-- prettier-ignore -->
6+
```css
7+
/* Input */
8+
:where(input:not([type="button"], [type="reset"], [type="submit"]), textarea, select) {
9+
/* CSS here */
10+
}
11+
12+
/* Prettier stable */
13+
:where(
14+
input:not([type="button"], [type="reset"], [type="submit"]),
15+
textarea,
16+
select
17+
) {
18+
/* CSS here */
19+
}
20+
21+
/* Prettier main */
22+
:where(
23+
input:not([type="button"], [type="reset"], [type="submit"]),
24+
textarea,
25+
select
26+
) {
27+
/* CSS here */
28+
}
29+
30+
```

‎src/language-css/printer-postcss.js‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -357,8 +357,12 @@ function genericPrint(path, options, print) {
357357
),
358358
]);
359359

360-
case "selector-selector":
361-
return group(indent(path.map(print, "nodes")));
360+
case "selector-selector": {
361+
const shouldIndent = node.nodes.length > 1;
362+
return group(
363+
(shouldIndent ? indent : (x) => x)(path.map(print, "nodes")),
364+
);
365+
}
362366

363367
case "selector-comment":
364368
return node.value;

‎tests/format/css/pseudo-call/__snapshots__/format.test.js.snap‎

Lines changed: 85 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,90 @@
11
// Jest Snapshot v1, https://goo.gl/fbAQLP
22

3+
exports[`indent.css format 1`] = `
4+
====================================options=====================================
5+
parsers: ["css"]
6+
printWidth: 80
7+
| printWidth
8+
=====================================input======================================
9+
:where(input:not([type="button"], [type="reset"], [type="submit"]), textarea, select) {
10+
/* CSS here */
11+
}
12+
13+
.foooooooooooooooooooo :where(input:not([type="button"], [type="reset"], [type="submit"]), textarea, select) {
14+
/* CSS here */
15+
}
16+
17+
:is(input:not([type="button"], [type="reset"], [type="submit"]), textarea, select) {
18+
/* CSS here */
19+
}
20+
21+
.foooooooooooooooooooo :is(input:not([type="button"], [type="reset"], [type="submit"]), textarea, select) {
22+
/* CSS here */
23+
}
24+
25+
:not(input:not([type="button"], [type="reset"], [type="submit"]), textarea, select) {
26+
/* CSS here */
27+
}
28+
29+
.foooooooooooooooooooo :not(input:not([type="button"], [type="reset"], [type="submit"]), textarea, select) {
30+
/* CSS here */
31+
}
32+
33+
=====================================output=====================================
34+
:where(
35+
input:not([type="button"], [type="reset"], [type="submit"]),
36+
textarea,
37+
select
38+
) {
39+
/* CSS here */
40+
}
41+
42+
.foooooooooooooooooooo
43+
:where(
44+
input:not([type="button"], [type="reset"], [type="submit"]),
45+
textarea,
46+
select
47+
) {
48+
/* CSS here */
49+
}
50+
51+
:is(
52+
input:not([type="button"], [type="reset"], [type="submit"]),
53+
textarea,
54+
select
55+
) {
56+
/* CSS here */
57+
}
58+
59+
.foooooooooooooooooooo
60+
:is(
61+
input:not([type="button"], [type="reset"], [type="submit"]),
62+
textarea,
63+
select
64+
) {
65+
/* CSS here */
66+
}
67+
68+
:not(
69+
input:not([type="button"], [type="reset"], [type="submit"]),
70+
textarea,
71+
select
72+
) {
73+
/* CSS here */
74+
}
75+
76+
.foooooooooooooooooooo
77+
:not(
78+
input:not([type="button"], [type="reset"], [type="submit"]),
79+
textarea,
80+
select
81+
) {
82+
/* CSS here */
83+
}
84+
85+
================================================================================
86+
`;
87+
388
exports[`is.css format 1`] = `
489
====================================options=====================================
590
parsers: ["css"]

‎tests/format/css/pseudo-call/indent.css‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
:where(input:not([type="button"], [type="reset"], [type="submit"]), textarea, select) {
2+
/* CSS here */
3+
}
4+
5+
.foooooooooooooooooooo :where(input:not([type="button"], [type="reset"], [type="submit"]), textarea, select) {
6+
/* CSS here */
7+
}
8+
9+
:is(input:not([type="button"], [type="reset"], [type="submit"]), textarea, select) {
10+
/* CSS here */
11+
}
12+
13+
.foooooooooooooooooooo :is(input:not([type="button"], [type="reset"], [type="submit"]), textarea, select) {
14+
/* CSS here */
15+
}
16+
17+
:not(input:not([type="button"], [type="reset"], [type="submit"]), textarea, select) {
18+
/* CSS here */
19+
}
20+
21+
.foooooooooooooooooooo :not(input:not([type="button"], [type="reset"], [type="submit"]), textarea, select) {
22+
/* CSS here */
23+
}

0 commit comments

Comments
 (0)