search

matype / stylefmt

stylefmt is a tool that automatically formats stylesheets.
Other
2.1k stars 89 forks source link

length-zero-no-unit is dangerous to fix when used with calc() #306

Open jethrolarson opened 7 years ago

jethrolarson commented 7 years ago

A bug where using stylefmt with stylelint causes calc expressions to break

Which rule, if any, is this issue related to?

length-zero-no-unit

What CSS is needed to reproduce this issue?

.foo {
  --x: 0px;
  left: calc(300px - var(--x));
}

stylelint configuration:

extends: stylelint-config-standard

stylefmt 5.3.2

How are you running stylelint: CLI, PostCSS plugin, Node API?

CLI with stylefmt -r 'app/**/*.scss' 'app/**/*.css'

What did you expect to happen?

Fixing the warning to be safe since it's in the recommended list

What actually happened (e.g. what warnings or errors you are getting)?

Styles get fixed to

.foo {
  --x: 0;
  left: calc(300px - var(--x));
}

calc sees different units on left and right hand side of the operator and returns a 0.

I think that this rule should be removed from the recommended list since it is not safe to fix.