Material-ui: transition css broken in beta 28 -- zeros parsed as false

[ilovett]

I'm not really sure how to create a plunkr for this... but when i roll back to beta 27 the issue is not there.

I can tell you that this create function:

    contentShift: {
      transition: theme.transitions.create('margin', {
        easing: theme.transitions.easing.easeOut,
        duration: theme.transitions.duration.enteringScreen,
      }),
    }

will return valid looking transition css: margin 225ms cubic-bezier(0.0, 0, 0.2, 1) 0ms

however inspecting the target css shows messed up transition css:

.App-contentShift-15 {
    transition: margin 225ms cubic-bezier(0.0, false, false.2, false) 0ms;
}

[verekia]

An example of broken components is the label and colored bars of TextFields which lost their transitions.

[oliviertassinari]

I can reproduce the issue in the create-react-app example.

[oliviertassinari]

It seems that the root cause is [email protected] released 2018-01-15T20:24:49.992Z. I'm reverting jss-vendor-prefixer from ^8.0.0 to ^7.0.0. cc @kof

[oliviertassinari]

It's deeply linked to this other issue: #9903.

[RafaelHovhannisyan]

CSS Transitions are broken on Inputs.

When this will be fixed? In next release ?

[xaviergonz]

Yeah, the problems seems to be in css-vendor
export default function supportedValue(property, value)
https://github.com/cssinjs/css-vendor/blob/master/src/supported-value.js

if you call that with ('transition', 'margin 225ms cubic-bezier(0.0, 0, 0.2, 0) 0ms,width 225ms cubic-bezier(0.0, 0, 0.2, 0) 0ms') it returns "margin 225ms cubic-bezier(0.0, false, false.2, false) 0ms,width 225ms cubic-bezier(0.0, false, false.2, false) 0ms"