Stop inserting space in LESS property access (#14103)

fisker · web-flow · commit 9e09a78cf50e · 2023-01-07T16:43:15.000+08:00
diff --git a/changelog_unreleased/less/14103.md b/changelog_unreleased/less/14103.md
@@ -0,0 +1,17 @@
+#### Do not insert space in LESS property access (#14103 by @fisker)
+
+<!-- prettier-ignore -->
+```less
+// Input
+a {
+  color: @colors[@white];
+}
+
+// Prettier stable
+a {
+  color: @colors[ @white];
+}
+
+// Prettier main
+<Same as input>
+```
diff --git 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
@@ -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
@@ -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
@@ -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    ];
 }
