diff --git a/changelog_unreleased/scss/18471.md b/changelog_unreleased/scss/18471.md new file mode 100644 index 000000000..f4ff3d42c --- /dev/null +++ b/changelog_unreleased/scss/18471.md @@ -0,0 +1,15 @@ +#### Prevent trailing comma in `if()` function (#18471 by @kovsu) + + +```scss +// Input +$value: if(sass(false): 1; else: -1); + +// Prettier stable +$value: if( + sass(false): 1; else: -1, +); + +// Prettier main +$value: if(sass(false): 1; else: -1); +``` diff --git a/src/language-css/utilities/index.js b/src/language-css/utilities/index.js index b2354bdca..6477cb24a 100644 --- a/src/language-css/utilities/index.js +++ b/src/language-css/utilities/index.js @@ -261,6 +261,18 @@ function isSCSSMapItemNode(path, options) { return false; } + const parentNode = path.parent; + + // Don't treat SCSS if function arguments as maps (`if(sass(condition): value; else: value)`) + // https://sass-lang.com/documentation/breaking-changes/if-function/ + if ( + parentNode && + parentNode.type === "value-func" && + parentNode.value === "if" + ) { + return false; + } + const parentParentNode = path.grandparent; // Check open parens contain key/value pair (i.e. `(key: value)` and `(key: (value, other-value)`) diff --git a/tests/format/scss/function/18465.scss b/tests/format/scss/function/18465.scss new file mode 100644 index 000000000..426305a74 --- /dev/null +++ b/tests/format/scss/function/18465.scss @@ -0,0 +1 @@ +$value: if(sass(false): 1; else: -1); diff --git a/tests/format/scss/function/__snapshots__/format.test.js.snap b/tests/format/scss/function/__snapshots__/format.test.js.snap index 78c6b2c6b..381e9685f 100644 --- a/tests/format/scss/function/__snapshots__/format.test.js.snap +++ b/tests/format/scss/function/__snapshots__/format.test.js.snap @@ -210,6 +210,36 @@ div { ================================================================================ `; +exports[`18465.scss - {"trailingComma":"es5"} format 1`] = ` +====================================options===================================== +parsers: ["scss"] +printWidth: 80 +trailingComma: "es5" + | printWidth +=====================================input====================================== +$value: if(sass(false): 1; else: -1); + +=====================================output===================================== +$value: if(sass(false): 1; else: -1); + +================================================================================ +`; + +exports[`18465.scss - {"trailingComma":"none"} format 1`] = ` +====================================options===================================== +parsers: ["scss"] +printWidth: 80 +trailingComma: "none" + | printWidth +=====================================input====================================== +$value: if(sass(false): 1; else: -1); + +=====================================output===================================== +$value: if(sass(false): 1; else: -1); + +================================================================================ +`; + exports[`arbitrary-arguments.scss - {"trailingComma":"es5"} format 1`] = ` ====================================options===================================== parsers: ["scss"]