Fix false positives for universal selector in no-descending-specificity

[yukipastelcat]

.something {
  & > * {
    &:not(:first-child) {
      margin-right: 16px;
    }
    &:not(:last-child) {
      margin-left: 16px;
    }
  }
  &-element {
    & > * { /*Expected selector ".something-element > *" to come before selector ".something > *:not(:first-child)" (no-descending-specificity) */
      &:not(:first-child) {
        margin-top: 16px;
      }
      &:not(:last-child) {
        margin-bottom: 16px;
      }
    }
  }
}

My stylelint.config.js:

module.exports = {
  extends: ['stylelint-config-recommended-scss'],
};

[jeddy3]

@yukipastelcat Thanks for the report.

Why am I getting no-descending-specificity error?

Technically .something-element > * has a specificity of 0,1,0 and .something > *:not(:first-child) has a higher specificity of 0,2,0, yet .something-element > * appears after .something > *:not(:first-child) in the source order. The rule is comparing them because I believe the last compound selector in each selector match i.e. it's the universal selector. I can see how this could be undesirable because:

a. & > * { } has no declarations
b. the universal selector is a odd thing to match

I believe this might be duplicate of #2489. It's proving a difficult problem to crack and this is proving to be a problematic rule, so please help in that issue if it's related or here if you think it's a separate one.

[github-actions]

This issue is older than one month. Please ask before opening a pull request, as it may no longer be relevant.