Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

animation shorthand first zero unit incorrectly dropped #988

Meesayen opened this issue Nov 30, 2017 · 2 comments · Fixed by dalton-0x0/cohort3#38 or grechut/watchdog#41 · May be fixed by kosiakMD/progressive_optimistic_ui#1, JuliusMorkunas/liker#16 or m0rphtail/Teleport#4


Copy link

Meesayen commented Nov 30, 2017


  • clean-css version - npm ls clean-css: 4.1.9
  • node.js version - node -v: 8.4.0
  • operating system: macOS El Capitan

Configuration options

var CleanCSS = require('clean-css');
new CleanCSS({
    level: 2,
    sourceMap: true,
    sourceMapInlineSources: true,
    returnPromise: true

Input CSS

.something {
  animation: 0s ease-out 5s forwards anim-name;

Actual output CSS

.something{animation:ease-out 5s forwards anim-name}

Expected output CSS

.something{animation:0s ease-out 5s forwards anim-name}

Hi, I found out that for some reasons the 0s unit in an animation shorthand is dropped, but in this case it can be a problem, because according to the specification the first time unit found in the shorthand is to be considered the "duration".

So in the example above, by dropping the zero unit, we are transforming a non-animated, 5 second delayed transition, to a 5 seconds long animated transition. (it was quite a fun bug to see :D)

I tried different configurations, like adding compatibility: { properties: { zeroUnits: false } }, with no success.

Using level: { 2: { skipProperties: ['animation'] } } helps but it would be nice to have those optimizations in place, clearly.

@jakubpawlowicz jakubpawlowicz added this to the 4.1.10 milestone Mar 2, 2018
Copy link

Fair point, fixing it asap.

jakubpawlowicz added a commit that referenced this issue Mar 5, 2018
When `animation-duration` is default but `animation-delay` isn't we
shouldn't drop the former as both need to be given.
Copy link

It's fixed in 4.1.10.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment