Fix max-nesting-depth error for at-rules in Sass syntax

[leon-up9]

What steps are needed to reproduce the bug?

run npx stylelint "**/*.sass" with config

while "customSyntax": require("postcss-sass")
doesnt work

"customSyntax": require("postcss-scss")
works and display styles that dont stand in the rules

What Stylelint configuration is needed to reproduce the bug?

stylelint.config.js

module.exports = { "extends": "stylelint-config-sass-guidelines", "customSyntax": require("postcss-sass"), "rules": { "declaration-block-trailing-semicolon": "never", "block-opening-brace-space-before": null, "max-nesting-depth": 3, "selector-class-pattern": "", "color-named": null, "selector-no-qualifying-type": [true, { ignore: ["class"] }], } }

package.json
"postcss-sass": "^0.5.0", "stylelint": "^14.9.1", "stylelint-config-sass-guidelines": "^9.0.1",

How did you run Stylelint?

npx stylelint "**/*.sass"

Which version of Stylelint are you using?

14.9.1

What did you expect to happen?

display styles that dont stand in the rules

What actually happened?

Error: The parent node must exist
at nestingDepth (/node_modules/stylelint/lib/rules/max-nesting-depth/index.js:93:10)
at checkStatement (node_modules/stylelint/lib/rules/max-nesting-depth/index.js:71:18)
at node_modules/postcss/lib/container.js:96:18
at /node_modules/postcss/lib/container.js:55:18
at Root.each (node_modules/postcss/lib/container.js:41:16)
at Root.walk (node_modules/postcss/lib/container.js:52:17)
at Root.walkRules (node_modules/postcss/lib/container.js:94:19)
at parent (node_modules/stylelint/lib/rules/max-nesting-depth/index.js:52:8)
at node_modules/stylelint/lib/lintPostcssResult.js:113:8
at Array.map ()

Does the bug relate to non-standard syntax?

No response

Proposal to fix the bug

No response

[ybiquitous]

@leon-up9 Thanks for writing the report and using the template. The problem seems to be related to the max-nesting-depth rule.

Could you please provide your Sass code triggering the error or the minimum reproduction repository?

[leon-up9]

@leon-up9 Thanks for writing the report and using the template. The problem seems to be related to the max-nesting-depth rule.

Could you please provide your Sass code triggering the error or the minimum reproduction repository?

https://github.com/up9inc/mizu/tree/develop/ui-common/src

[jeddy3]

@leon-up9 Please provide a minimum reproduction. We can only help you if you identify the specific code causing the problem. You should first identify the file (or files) causing the issue by running stylelint on subsets of your codebase. Once you've identified a problematic file, you should reduce down the code in it to the minimum amount of code to trigger the error.

If you like, you can then drop that code into the demo and paste the link here, rather than supplying a reproduction repository.

[leon-up9]

@leon-up9 Please provide a minimum reproduction. We can only help you if you identify the specific code causing the problem. You should first identify the file (or files) causing the issue by running stylelint on subsets of your codebase. Once you've identified a problematic file, you should reduce down the code in it to the minimum amount of code to trigger the error.

If you like, you can then drop that code into the demo and paste the link here, rather than supplying a reproduction repository.

i Just provided the repo one comment above you

[jeddy3]

I saw, but that is a large repo of code and not a minimal reproducible example. Please use as little code as possible that still produces the same problem. We'll then be able to identify the issue for you.

[leon-up9]

I saw, but that is a large repo of code and not a minimal reproducible example. Please use as little code as possible that still produces the same problem. We'll then be able to identify the issue for you.

how can i identify what file causing the problem?

[jeddy3]

You should first identify the file (or files) causing the issue by running stylelint on subsets of your codebase. Once you've identified a problematic file, you should reduce down the code in it to the minimum amount of code to trigger the error.

There may be a more eloquent way, but this approach usually works.

[qwekelly]

I have the same problem, is there a solution?

[jeddy3]

Closing as stale. Anyone is welcome to reopen with a minimal reproducible example or repo, though.

[skepsys]

Have had a similar problem with stylelint for sass. This error appears because of some rules, I don't know the reasons. But a workaround I ended up with was the following.

Take the whole list of rules configured in a ruleset you're trying to extend. In this case it is stylelint-config-sass-guidelines, you can find a list of rules here. And then in a config file turn off rule by rule unless you'll find which of them causes the error.

For example, this is what is in my .stylelintrc.yml:

extends:
  - 'stylelint-config-recommended-scss'
 plugins:
  - 'stylelint-scss'
customSyntax: 'postcss-sass'
rules:
  # Below are rules that I found causing error 'node source must be present'
  no-descending-specificity: null
  no-duplicate-selectors: null
  no-empty-source: null

As you can see, I extended another set of rule (stylelint-config-recommended-scss), but the logic will be the same.

[jeddy3]

@skepsys Thank you for digging into it some more.

We assume that syntaxes will provide a source, but it seems postcss-sass does not.

I'll label as discussion as we can either:

• fix this in our rules by returning early when source is missing, rather than throwing
• marking this as an upstream issue in the postcss-sass syntax

[dkostmii]

@skepsys Thank you for digging into it some more.

We assume that syntaxes will provide a source, but it seems postcss-sass does not.

I'll label as discussion as we can either:

• fix this in our rules by returning early when source is missing, rather than throwing
• marking this as an upstream issue in the postcss-sass syntax

Found interesting error, while disabling those rules, see this repo.

Seems, it's easier to just migrate to SCSS by using stylelint-config-standard-scss which works just fine for me.

[mindnektar]

I've found a minimum reproducible example. Here it is:

body
    background-color: red

    @media print
        background-color: white

As soon as i use an @media rule anywhere in a file, I get The parent node must exist at nestingDepth thrown by the max-nesting-depth rule.

[ybiquitous]

Thanks for providing the minimal reproduction. I can confirm the error with this demo.

@media print
  color: white

{
  "customSyntax": "postcss-sass",
  "rules": {
    "max-nesting-depth": 0
  }
}

As @jeddy3 suggested on #6160 (comment), I think it's easy to

fix this in our rules by returning early when source is missing, rather than throwing

I've labeled the issue as ready to implement. Please consider contributing if you have time.

There are steps on how to fix a bug in a rule in the Developer guide.

[ybiquitous]

I've just opened PR #6909.