Media Queries Out Of Order

[SCasarotto]

Most of the time this isn't an issue but I found that the media queries are getting created out of order. Is this something I am doing wrong or is this possibly something with the library?

[SCasarotto]

I would love if someone could explain to me how this works. The only different I changed was the value in the fontSize from 30 to 32 and when it is 32 it is in the right order but not when its 30. See below:

[SCasarotto]

It looks like this is caused because Radium will reuse media queries on multiple stops. Because of this, the order doesn't match the js stylesheet. If anyone else runs into this, hope that helps.

[ryan-roemer]

@SCasarotto -- do you think you could open a WIP pull request that just adds failing regression test(s)?

[SCasarotto]

@ryan-roemer I am not sure when I will get a chance to setting that up. I could provide an example on codesandbox if that would help.

[stevenmusumeche]

@SCasarotto I'm unable to reproduce this. An example codesandbox or WIP pull request that adds failing regression tests would allow us to fix this issue.

[SCasarotto]

Sorry this has taken so long to come back to. Work has been crazy and I hadn't worked on a project where this was a problem in a while.

https://codesandbox.io/s/5vrvy139xn

If you remove line 15 in styles.js all styles are applied the same to all. When its added the order gets all messed up. There are probably many ways to recreate this but that seems to be clearest.

Notice the difference applied to each.