Fix declaration-block-no-duplicate-properties autofix for !important

[sidx1024]

What steps are needed to reproduce the bug?

1. Enable declaration-block-no-duplicate-properties rule
2. Run stylelint --fix against a file like this:

.box {
  display: flex !important;
  display: inline-flex;
}

The css fixed by stylelint becomes:

.box {
  display: inline-flex !important;
  display: inline-flex;
}

The fix is incorrect because before fixing the css the effective value for display would be flex and after the fix it is inline-flex.

What Stylelint configuration is needed to reproduce the bug?

{
  "plugins": [
    "stylelint-scss",
  ],
  "rules": {
    "declaration-block-no-duplicate-properties": true
  }
}

How did you run Stylelint?

stylelint file.scss --fix

Which version of Stylelint are you using?

13.12.0

What did you expect to happen?

The expected file after auto fix should be:

.box {
  display: flex !important;
}

If the case is difficult to handle the issue should not be auto-fixed.

What actually happened?

The issue was auto-fixed and the file after the fix became:

.box {
  display: inline-flex !important;
  display: inline-flex;
}

Does the bug relate to non-standard syntax?

No response

Proposal to fix the bug

1. Avoid auto-fixing if one of the duplicates have !important.
2. Apply the effective value for the property when !important is present.

[ybiquitous]

@sidx1024 Thanks for the report. As you commented, the current declaration-block-no-duplicate-properties rule doesn't consider !important, and I agree that the rule auto-fix should remain only one effective property.

I guess there are the following cases for !important:

Case 1

When there is one !important:

a {
  color: red !important;
  color: green;
}

should become ⬇️

a {
  color: red !important;
}

Case 2

When there are multiple !important:

a {
  color: red !important;
  color: green !important;
}

should become ⬇️

a {
  color: green !important;
}

In other words, only the last !important should be kept.

What do you think?

[jeddy3]

In other words, only the last !important should be kept.

SGTM.

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

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

[sidx1024]

Sure. Raised a PR #6528