diff --git a/changelog_unreleased/less/14103.md b/changelog_unreleased/less/14103.md new file mode 100644 index 000000000000..cddb91e0f786 --- /dev/null +++ b/changelog_unreleased/less/14103.md @@ -0,0 +1,17 @@ +#### Do not insert space in LESS property access (#14103 by @fisker) + + +```less +// Input +a { + color: @colors[@white]; +} + +// Prettier stable +a { + color: @colors[ @white]; +} + +// Prettier main + +``` diff --git a/src/language-css/clean.js b/src/language-css/clean.js index 8dc592570c93..eee08eda6e0e 100644 --- a/src/language-css/clean.js +++ b/src/language-css/clean.js @@ -183,6 +183,27 @@ function clean(ast, newObj, parent) { }); } } + + // We parse `@var[ foo ]` and `@var[foo]` differently + if ( + ast.type === "value-comma_group" && + ast.groups.some( + (node) => + (node.type === "value-atword" && node.value.endsWith("[")) || + (node.type === "value-word" && node.value.startsWith("]")) + ) + ) { + return { + type: "value-atword", + value: ast.groups.map((node) => node.value).join(""), + group: { + open: null, + close: null, + groups: [], + type: "value-paren_group", + }, + }; + } } clean.ignoredProperties = ignoredProperties; diff --git a/src/language-css/printer-postcss.js b/src/language-css/printer-postcss.js index 44d11d50228f..ca5719e93350 100644 --- a/src/language-css/printer-postcss.js +++ b/src/language-css/printer-postcss.js @@ -621,7 +621,26 @@ function genericPrint(path, options, print) { } // Ignore `@` in Less (i.e. `@@var;`) - if (iNode.type === "value-atword" && iNode.value === "") { + if ( + iNode.type === "value-atword" && + (iNode.value === "" || + /* + @var[ @notVarNested ][notVar] + ^^^^^ + */ + iNode.value.endsWith("[")) + ) { + continue; + } + + /* + @var[ @notVarNested ][notVar] + ^^^^^^^^^ + */ + if ( + iNextNode.type === "value-word" && + iNextNode.value.startsWith("]") + ) { continue; } diff --git a/tests/format/less/case/__snapshots__/jsfmt.spec.js.snap b/tests/format/less/case/__snapshots__/jsfmt.spec.js.snap index 9abe3bd1d0b1..f67031abd06b 100644 --- a/tests/format/less/case/__snapshots__/jsfmt.spec.js.snap +++ b/tests/format/less/case/__snapshots__/jsfmt.spec.js.snap @@ -389,9 +389,15 @@ printWidth: 80 canChangeCase: @var[@notVarNested][notVar]; canChangeCase: @var[ @notVarNested][notVar]; canChangeCase: @var[@notVarNested ][notVar]; + canChangeCase: @var[ @notVarNested ][notVar]; + canChangeCase: @var[@notVarNested][notVar]; canChangeCase: @var[@notVarNested][ notVar]; canChangeCase: @var[@notVarNested][notVar ]; + canChangeCase: @var[@notVarNested][ notVar ]; canChangeCase: @var[notVar]; + canChangeCase: @var[ notVar]; + canChangeCase: @var[notVar ]; + canChangeCase: @var[ notVar ]; } =====================================output===================================== @@ -453,11 +459,17 @@ printWidth: 80 }; @not-var { - canchangecase: @var[ @notVarNested][notVar]; - canchangecase: @var[ @notVarNested][notVar]; - canchangecase: @var[ @notVarNested ][notVar]; - canchangecase: @var[ @notVarNested][ notVar]; - canchangecase: @var[ @notVarNested][notVar ]; + canchangecase: @var[@notVarNested][notVar]; + canchangecase: @var[@notVarNested][notVar]; + canchangecase: @var[@notVarNested][notVar]; + canchangecase: @var[@notVarNested][notVar]; + canchangecase: @var[@notVarNested][notVar]; + canchangecase: @var[@notVarNested][notVar]; + canchangecase: @var[@notVarNested][notVar]; + canchangecase: @var[@notVarNested][notVar]; + canchangecase: @var[notVar]; + canchangecase: @var[notVar]; + canchangecase: @var[notVar]; canchangecase: @var[notVar]; } diff --git a/tests/format/less/case/variable.less b/tests/format/less/case/variable.less index 29fdd9052f67..599c34754f1e 100644 --- a/tests/format/less/case/variable.less +++ b/tests/format/less/case/variable.less @@ -59,7 +59,13 @@ canChangeCase: @var[@notVarNested][notVar]; canChangeCase: @var[ @notVarNested][notVar]; canChangeCase: @var[@notVarNested ][notVar]; + canChangeCase: @var[ @notVarNested ][notVar]; + canChangeCase: @var[@notVarNested][notVar]; canChangeCase: @var[@notVarNested][ notVar]; canChangeCase: @var[@notVarNested][notVar ]; + canChangeCase: @var[@notVarNested][ notVar ]; canChangeCase: @var[notVar]; + canChangeCase: @var[ notVar]; + canChangeCase: @var[notVar ]; + canChangeCase: @var[ notVar ]; }