csso
csso copied to clipboard
No shorthand duplicates removed
Hey,
Take a look at this test case: https://github.com/matt3224/remove-dupe-props-test
Whilst long hand duplicate properties get removed it seems the shorthand ones do not. Is there some config I need to add to achieve this or is it something that needs to be added?
I imagine this to be potentially difficult and this may be why it is the way it is. However if you were to do something like this:
.button {
background: black;
}
.button {
background: url('thing.png') no-repeat;
}
I would expect this:
.button {
background: url('thing.png') no-repeat;
}
not this:
.button {
background: black url('thing.png') no-repeat;
}
as thats what the browser will do. Thoughts welcome
Issue is about background property only, see explanation in related issue (#330). It would be fixed in the future.
I guess a priority system of properties would work good in these situations:
- if priority is equal, csso will render both properties untouched.
- if priority of case A have higher priority over case B, the csso will render case A.
- if priority of case B have higher priority over case A, the ccso will render case B.
I proposed this in Sass, maybe should work in CSSO: https://github.com/sass/sass/issues/2464
The is not about property priority. CSSO doesn't merge background property values or override them due of the complexity of that property (various browser support, complex merge model, many edge cases). It will be fixed when CSSTree (a backend for processing CSS) provides necessary API for such kind of complex transformations.
Btw, I looked at the sample code and noticed that the current output is:
.button{background:#000;background:url(thing.png) no-repeat}
@lahmatiy, It's not about merge background property, is like how git merge does, you want case A, case B or you want both.