[1.5.1] boxShadowColor doesn't work properly

[ryedeer]

Your system information

• VelocityJS version: 1.5.1
• Browser: Chrome, Firefox, Safari
• Operating System: Mac OS X 10.12.4

Checklist

• Is this an issue with code?: [Yes/No] Yes
• Is this an issue with documentation?: [Yes/No] No
• Have you reproduced this in other browsers?: [Yes/No] Yes
• Have you checked for updates?: [Yes/No] Yes
• Have you checked for similar open issues?: [Yes/No] Yes

Please describe your issue in as much detail as possible:

When we try to animate the box shadow of an element, the animation fails to work properly if we specify boxShadowColor. If the boxShadowColor is specified as a hex value (e.g. "#FF0000"), the shadow just stays black; if we specify a color name (e.g. "red"), the shadow disappears because its parameters turn into some strange fractional values (box-shadow: black 0.00025266px 0.00025266px 0.00025266px 0.00025266px; while it's supposed to be red with 10 pixel offsets).

Steps for reproducing this issue (code):

  $('.box').velocity({
    boxShadowX: "10px",
    boxShadowY: "10px",
    boxShadowBlur: "10px",
    boxShadowSpread: "10px",
    boxShadowColor: "red"
  }, {duration: 5000});

JSFiddle example showing issue in action (code):

https://codepen.io/anon/pen/WyEKVJ

[Rycochet]

That's never been a valid property to animate (it might be doing something, but it's not been mentioned in the docs) - and unfortunately(ish) V1 is deprecated so I'll only touch it for a security fix (if anything turns up).

Saying that, V2 is due to come out of beta in a week or so (I've earmarked next weekend for polishing), and there you can animate the box-shadow / boxShadow properly and directly (there are no broken fake attributes - box-shadow isn't a single shadow, it's a comma separated list of shadows).