Skip to content

Commit 41cee06

Browse files
mvorisekfisker
mvorisek
and
fisker
authored
Do not change case of property name if inside a variable declaration in LESS (#14034)
Co-authored-by: fisker Cheung <[email protected]>
1 parent 0e25b13 commit 41cee06

File tree

5 files changed

+241
-3
lines changed

5 files changed

+241
-3
lines changed

‎changelog_unreleased/less/14034.md‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
#### Do not change case of property name if inside a variable declaration in LESS (#14034 by @mvorisek)
2+
3+
<!-- prettier-ignore -->
4+
```less
5+
// Input
6+
@var: {
7+
preserveCase: 0;
8+
};
9+
10+
// Prettier stable
11+
@var: {
12+
preservecase: 0;
13+
};
14+
15+
// Prettier main
16+
@var: {
17+
preserveCase: 0;
18+
};
19+
```

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

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -492,13 +492,21 @@ function parseNestedCSS(node, options) {
492492
node.params[0] === ":"
493493
) {
494494
node.variable = true;
495-
node.value = parseValue(node.params.slice(1), options);
495+
const text = node.params.slice(1);
496+
if (text) {
497+
node.value = parseValue(text, options);
498+
}
496499
node.raws.afterName += ":";
497500
}
498501

499502
// Less variable
500503
if (node.variable) {
501504
delete node.params;
505+
506+
if (!node.value) {
507+
delete node.value;
508+
}
509+
502510
return node;
503511
}
504512
}

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

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -158,7 +158,11 @@ function genericPrint(path, options, print) {
158158

159159
return [
160160
node.raws.before.replace(/[\s;]/g, ""),
161-
insideICSSRuleNode(path) ? node.prop : maybeToLowerCase(node.prop),
161+
// Less variable
162+
(parentNode.type === "css-atrule" && parentNode.variable) ||
163+
insideICSSRuleNode(path)
164+
? node.prop
165+
: maybeToLowerCase(node.prop),
162166
trimmedBetween.startsWith("//") ? " " : "",
163167
trimmedBetween,
164168
node.extend ? "" : " ",

‎tests/format/less/case/__snapshots__/jsfmt.spec.js.snap‎

Lines changed: 143 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -204,7 +204,7 @@ svg[viewBox] linearGradient,
204204
}
205205
206206
@KeepDetachedRuleset: /*:*/ {
207-
background: RED;
207+
BACKGROUND: RED;
208208
};
209209
210210
%KeepScssPlaceholderSelector {
@@ -321,3 +321,145 @@ TABLE {
321321
322322
================================================================================
323323
`;
324+
325+
exports[`variable.less format 1`] = `
326+
====================================options=====================================
327+
parsers: ["less"]
328+
printWidth: 80
329+
| printWidth
330+
=====================================input======================================
331+
// Do not change case of property name if inside a variable declaration
332+
333+
@var: {
334+
notVar: 0;
335+
@notVarNested: {
336+
notVar: 1;
337+
notVar2: 2;
338+
};
339+
};
340+
341+
@var : {
342+
preserveCase: 5;
343+
};
344+
345+
@var: {
346+
preserveCase: 5;
347+
};
348+
349+
@var :{
350+
preserveCase: 5;
351+
};
352+
353+
@var /* comment */ : /* comment */ {
354+
preserveCase: 5;
355+
};
356+
357+
@var: /* comment */ {
358+
preserveCase: 5;
359+
};
360+
361+
@var /* comment */ :{
362+
preserveCase: 5;
363+
};
364+
365+
@var // comment
366+
: // comment
367+
{
368+
/* FIXME: should not change case */
369+
preserveCase: 5;
370+
};
371+
372+
@var: // comment
373+
{
374+
preserveCase: 5;
375+
};
376+
377+
@var // comment
378+
:{
379+
/* FIXME: should not change case */
380+
preserveCase: 5;
381+
};
382+
383+
// Known css properties
384+
@var: {
385+
COLoR: RED;
386+
};
387+
388+
@not-var {
389+
canChangeCase: @var[@notVarNested][notVar];
390+
canChangeCase: @var[ @notVarNested][notVar];
391+
canChangeCase: @var[@notVarNested ][notVar];
392+
canChangeCase: @var[@notVarNested][ notVar];
393+
canChangeCase: @var[@notVarNested][notVar ];
394+
canChangeCase: @var[notVar];
395+
}
396+
397+
=====================================output=====================================
398+
// Do not change case of property name if inside a variable declaration
399+
400+
@var: {
401+
notVar: 0;
402+
@notVarNested: {
403+
notVar: 1;
404+
notVar2: 2;
405+
};
406+
};
407+
408+
@var: {
409+
preserveCase: 5;
410+
};
411+
412+
@var: {
413+
preserveCase: 5;
414+
};
415+
416+
@var: {
417+
preserveCase: 5;
418+
};
419+
420+
@var: /* comment */ {
421+
preserveCase: 5;
422+
};
423+
424+
@var: /* comment */ {
425+
preserveCase: 5;
426+
};
427+
428+
@var: {
429+
preserveCase: 5;
430+
};
431+
432+
@var // comment
433+
: // comment
434+
{
435+
/* FIXME: should not change case */
436+
preservecase: 5;
437+
}
438+
439+
@var: // comment
440+
{
441+
preserveCase: 5;
442+
};
443+
444+
@var // comment
445+
: {
446+
/* FIXME: should not change case */
447+
preservecase: 5;
448+
}
449+
450+
// Known css properties
451+
@var: {
452+
COLoR: RED;
453+
};
454+
455+
@not-var {
456+
canchangecase: @var[ @notVarNested][notVar];
457+
canchangecase: @var[ @notVarNested][notVar];
458+
canchangecase: @var[ @notVarNested ][notVar];
459+
canchangecase: @var[ @notVarNested][ notVar];
460+
canchangecase: @var[ @notVarNested][notVar ];
461+
canchangecase: @var[notVar];
462+
}
463+
464+
================================================================================
465+
`;

‎tests/format/less/case/variable.less‎

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
// Do not change case of property name if inside a variable declaration
2+
3+
@var: {
4+
notVar: 0;
5+
@notVarNested: {
6+
notVar: 1;
7+
notVar2: 2;
8+
};
9+
};
10+
11+
@var : {
12+
preserveCase: 5;
13+
};
14+
15+
@var: {
16+
preserveCase: 5;
17+
};
18+
19+
@var :{
20+
preserveCase: 5;
21+
};
22+
23+
@var /* comment */ : /* comment */ {
24+
preserveCase: 5;
25+
};
26+
27+
@var: /* comment */ {
28+
preserveCase: 5;
29+
};
30+
31+
@var /* comment */ :{
32+
preserveCase: 5;
33+
};
34+
35+
@var // comment
36+
: // comment
37+
{
38+
/* FIXME: should not change case */
39+
preserveCase: 5;
40+
};
41+
42+
@var: // comment
43+
{
44+
preserveCase: 5;
45+
};
46+
47+
@var // comment
48+
:{
49+
/* FIXME: should not change case */
50+
preserveCase: 5;
51+
};
52+
53+
// Known css properties
54+
@var: {
55+
COLoR: RED;
56+
};
57+
58+
@not-var {
59+
canChangeCase: @var[@notVarNested][notVar];
60+
canChangeCase: @var[ @notVarNested][notVar];
61+
canChangeCase: @var[@notVarNested ][notVar];
62+
canChangeCase: @var[@notVarNested][ notVar];
63+
canChangeCase: @var[@notVarNested][notVar ];
64+
canChangeCase: @var[notVar];
65+
}

0 commit comments

Comments
 (0)