False Positive for scss

I’m getting the following error in SonarCloud:

Unexpected unknown unit "+px"
For the line:
width: $i/1.3+px;

This is failing on this rule:

Units should be valid
The W3C specifications define the  `units`  that can be used with lengths. A unit that is not part of the list of supported ones is likely to be a typo and will be seen as a UI bug by the user.
This rule raises an issue each time a unit is not officially supported.

As I understand it this is invalid for a css file, bt this is a scss file which it is fine. Is there anyway to remove filnding this false positive, without disabling it for css file too.

Hi @pgregory,

Thank you for this bug report. I can reproduce it and I created the corresponding ticket on Github https://github.com/SonarSource/sonar-css/issues/160.

In the meantime I recommend to use *1px instead of +px. An additional benefit is that it will avoid creating tricky bugs when the code is refactored. For example 1+px + 3px will result in 1px3px, not 4px, whereas 1 * 1px + 3px will give 4px as expected. See this link for more information.

You can also run this rule only on CSS files, excluding scss files, as described in the documentation, see section Restrict Scope of Coding Rules. The rule key is “css:S4653” (it is visible in the rule description), and for the file path you can set **/*.css.

Cheers,
Nicolas

Thanks

We have also fixed our code by changing it to:

width: calc(#{$i}px / 1.3);

Which doesn’t break the sonar rule

Great! Thank you for this update :slight_smile:

@pgregory Also just adding spaces around + in the initial code should remove FP: $i/1.3 + px. Looks like your FP appears due to wrong parsing