Fails to parse some at rules

[gaku-sei]

First of all, thank you for this very handy ppx 😄

While trying it on our project, we faced a parse error issue Utils.ParseError("Your Tailwind CSS file could not be parsed. Please double-check to make sure it's valid CSS.") that seems to be caused by the @-webkit-keyframes rule (and could be probably be triggered by other rules vendor prefixed).

Since the rules are hardcoded (and validated) here: https://github.com/dylanirlbeck/tailwind-ppx/blob/master/src/ppx/css_parser/css_lexer.ml#L153 it might out of the scope to support prefixed rules though 😕

[dylanirlbeck]

That's a weird issue you're experiencing, can you send me the entire rule in your CSS so I can reproduce on my end? Thanks! Any valid tailwind.css file should be parsed correctly, so this is an important bug to fix.

[gaku-sei]

Sure, here is an example of a rule that fails to parse:

@-webkit-keyframes hide {
  from {
    opacity: 0.8;
    visibility: visible;
  }

  to {
    opacity: 0;
    height: 0;
    visibility: hidden;
  }
}

Notice that the same rule (without the vendor prefix) will parse successfully:

@keyframes hide {
  from {
    opacity: 0.8;
    visibility: visible;
  }

  to {
    opacity: 0;
    height: 0;
    visibility: hidden;
  }
}

[dylanirlbeck]

Oops, sorry for the accidental close --- this issue should be fixed ASAP, thanks for sending me the snippet! I'll ping you here when I've published a fix in the parser.

[gaku-sei]

Thank you very much for the fast reply, that's really nice to read!

It's not urgent, we could move the animations out for now 👍

[dylanirlbeck]

@gaku-sei This should be fixed in 0.7.7. Can you try it out on your end? https://www.npmjs.com/package/@dylanirlbeck/tailwind-ppx