Prevent SCSS math expressions in group treated as map item (#18530)

changelog_unreleased/scss/18530.md

@@ -0,0 +1,18 @@
+#### Prevent adding trailing comma in math expression within function arguments (#18530 by @kovsu)
+
+<!-- prettier-ignore -->
+```scss
+// Input
+@include container($foo: 2 * ($bar + $baz));
+
+// Prettier stable
+@include container(
+  $foo: 2 *
+    (
+      $bar + $baz,
+    )
+);
+
+// Prettier main
+@include container($foo: 2 * ($bar + $baz));
+```

src/language-css/utilities/index.js

@@ -292,6 +292,11 @@ function isSCSSMapItemNode(path, options) {
 
   // List as value of key inside SCSS map (i.e. `$map: (key: (value other-value other-other-value))`)
   if (isKeyValuePairInParenGroupNode(parentParentNode)) {
+    // If there is any operator in the value, it is not a map item
+    if (parentNode.groups.some((node) => isMathOperatorNode(node))) {
+      return false;
+    }
+
     return true;
   }
 

tests/format/scss/math/7419.scss

@@ -0,0 +1,15 @@
+@include container($foo: 2);
+@include container($foo: 2 * ($bar));
+@include container($foo: 2 * ($bar + $baz));
+
+@include container($foo: 1, $bar: 2);
+
+@include container($foo: (
+  $bar,
+  $baz
+));
+
+@include container($foo: (
+  $bar + $baz,
+  $qux * 2
+));

tests/format/scss/math/__snapshots__/format.test.js.snap

@@ -523,3 +523,97 @@ $colors: (
 
 ================================================================================
 `;
+
+exports[`7419.scss - {"trailingComma":"es5"} format 1`] = `
+====================================options=====================================
+parsers: ["scss"]
+printWidth: 80
+trailingComma: "es5"
+                                                                                | printWidth
+=====================================input======================================
+@include container($foo: 2);
+@include container($foo: 2 * ($bar));
+@include container($foo: 2 * ($bar + $baz));
+
+@include container($foo: 1, $bar: 2);
+
+@include container($foo: (
+  $bar,
+  $baz
+));
+
+@include container($foo: (
+  $bar + $baz,
+  $qux * 2
+));
+
+=====================================output=====================================
+@include container($foo: 2);
+@include container($foo: 2 * ($bar));
+@include container($foo: 2 * ($bar + $baz));
+
+@include container($foo: 1, $bar: 2);
+
+@include container(
+  $foo: (
+    $bar,
+    $baz,
+  )
+);
+
+@include container(
+  $foo: (
+    $bar + $baz,
+    $qux * 2,
+  )
+);
+
+================================================================================
+`;
+
+exports[`7419.scss - {"trailingComma":"none"} format 1`] = `
+====================================options=====================================
+parsers: ["scss"]
+printWidth: 80
+trailingComma: "none"
+                                                                                | printWidth
+=====================================input======================================
+@include container($foo: 2);
+@include container($foo: 2 * ($bar));
+@include container($foo: 2 * ($bar + $baz));
+
+@include container($foo: 1, $bar: 2);
+
+@include container($foo: (
+  $bar,
+  $baz
+));
+
+@include container($foo: (
+  $bar + $baz,
+  $qux * 2
+));
+
+=====================================output=====================================
+@include container($foo: 2);
+@include container($foo: 2 * ($bar));
+@include container($foo: 2 * ($bar + $baz));
+
+@include container($foo: 1, $bar: 2);
+
+@include container(
+  $foo: (
+    $bar,
+    $baz
+  )
+);
+
+@include container(
+  $foo: (
+    $bar + $baz,
+    $qux * 2
+  )
+);
+
+================================================================================
+`;