7rulnik/postcss-flexibility

Does not check if -js-display: flex; already exists

Dan503 opened this issue · 5 comments

Multiple times across different projects, I've checked my css output after a while and saw this:

.rule { display: -webkit-flex; display: -ms-flexbox; -js-display: flex; -js-display: flex; -js-display: flex; -js-display: flex; -js-display: flex; -js-display: flex; -js-display: flex; -js-display: flex; -js-display: flex; display: flex; }

I'm not sure where in my CSS generation process the cause of this is, but if the flexibility postCSS plugin could check if -js-display: flex; already exists in the rule before adding a new one, it would safeguard against this sort of thing and make it easier to use.

The easy way to remove the extra -js-display: flex; rules is by deleting the css files and regenerating them. It would be nice if the extra -js-display: flex; rules were never added in the first place though.

Thank you, @Dan503
I fixed it in 1.0.3 so try it please.
6382b4d#diff-168726dbe96b3ce427e7fedce31bb0bcR5 — I add check for existing props. Not sure that it's best way.

That's odd :/

I just checked the postcss-flexibility version that I'm having the issue in and it is version 3.7.1.

The issue definitely happens every time I initiate the default grunt task on my project:

  1. run compass (npm version 3.7.1) with no css changes present (so it doesn't generate new css files)
  2. run post-css autoprefixer then flexibility on the css generated by compass
  3. do other unrelated stuff
  4. watch files

Theoretically that shouldn't cause the issue but it does.

oh sorry, 3.7.1 is the version of npm I'm running, I'll see if I can get the versions of the plugins I'm using

Ahh ok, I was running postcss-flexibility 1.0.2. I'll update and see if the issue is still happening.

Yep, tested and working now.

Thanks :)