Invalid CSS parcing error in @keyframes rule

[vbickov]

Apache NetBeans version

Apache NetBeans 24 release candidate

What happened

NetBeans 24 considers the following CSS block as erroneous. It does not like "%0" and says that "Unexpected token PERCENTAGE" is found. If I configure the validator to ignore the error, it starts blaming the closing bracket. The code is obviously fine.

@keyframes ozx-delay-anim {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

Language / Project Type / NetBeans Component

No response

How to reproduce

Just create a CSS file and put the code in there.

Did this work correctly in an earlier version?

Apache NetBeans 23

Operating System

Windows 11 Pro 24H2

JDK

Java HotSpot(TM) 64-Bit Server VM (build 23.0.1+11-39, mixed mode, sharing)

Apache NetBeans packaging

Apache NetBeans provided installer

Anything else

No response

Are you willing to submit a pull request?

No

[vbickov]

Not actually a "release candidate". It is the latest released NetBeans 24. The form just did not have this option.

[matthiasblaesing]

Sorry, I'll look into this.

[matthiasblaesing]

@vbickov from the checks page of #8053 a nightly build available checks page direct link.

It would be great if you could test it.

For NB 23, you might succeed by replacing the existing org-netbeans-modules-css-lib.jar with this one:
org-netbeans-modules-css-lib.jar.zip. Of course you should make a bakup first.

[vbickov]

@matthiasblaesing The org-netbeans-modules-css-lib.jar from the nightly build solves the issue for NB 24. I do not have NB 23 anymore and never experienced this issue with NB 23. Thank you.

[vbickov]

@matthiasblaesing Apparently, I was wrong. After I replaced org-netbeans-modules-css-lib.jar from the nightly build, it seemed that the issue was solved. However, after a couple of seconds, the error came back. I also tried to replace all JARs with CSS in their names. Am I missing something?

[matthiasblaesing]

Please ensure that you delete the cache dir. Under windows the two relevant paths are (the first can be safely deleted):

• Cache dir: c:/Users/<username>/AppData/Local/NetBeans/Cache/<NBVERSION>
• Settings dir: c:/Users/<username>/AppData/Roaming/NetBeans/<NBVERSION>

Please don't close the issue, it will be automatically closed once the fix is merged to master.

[vbickov]

@matthiasblaesing Thank you. Removing the cache dir helps.

[matthiasblaesing]

@vbickov I pushed another update. The @keyframes rule also exists in the variants @-moz-keyframes and @-o-keyframes, these two variants are now supported also. Would you mind testing either the nightly (checks page, direct link) or the extracted org-netbeans-modules-css-lib.jar again?

org-netbeans-modules-css-lib.jar.zip

[vbickov]

@matthiasblaesing thank you. I was just about to report the issue with @-moz-keyframes

The update you provided fixes issue with @-moz-keyframes

[DarryStraits]

Hello. My first time here trying to contribute... I know it's a closed issue but after applying the fix, I found a couple of errors in my project related to keyframes and viewport, both for ms versions:

@-ms-keyframes --> Used in my own CSS files (to ensure copatibility with old Miscrosoft browsers)
@-ms-viewport --> Used in Bootstrap v3.3.7 (bootstrap.min.css)

It looks like they are missing or wrong in the css module, as I am getting similar errors to the previous ones mentioned here.
Do you think this makes sense?

[matthiasblaesing]

Is there somewhere outside your own code an occurence of @-ms-keyframes? Else I'm not willing to respin this. For current development it is useless as all major browsers support "the right" syntax.

For @-ms-viewport. Nothing changed for that. It is "supported":

The warning is correct, as device-width is not a valid value for the width property.

[DarryStraits]

Hi Matthias,

Thank you for your quick response.

Regarding @-ms-keyframes, it only happens in a CSS file I created long ago. After some research, I found that @-ms-keyframes was part of a beta for IE 10 but was discarded in the final version and shortly before IE10 release MSDN marked @-ms-keyframes as deprecated. So yes, that's not part of CSS standards anymore. But in NetBeans 23 it wasn't marked as an error, that's why I commented on this. I deleted that tag in my code to avoid that error, so there are no major issues here... ;)

About @-ms-viewport, I'm not talking about the device-width warning but the @-ms-viewport error itself:

It is happening in both Bootstrap 3.3.7 and 3.4.1 (minified versions) that are included in external plugins included in my project. It seems that @-ms-viewport has been deprecated too (not used in Edge, only in IE 10), but I guess Bootstrap was just trying to keep compatibility with old browsers like IE 10. Anyhow, that error was not marked before in NetBeans 23 and now it is, at least in my NetBeans 24 after replacing org-netbeans-modules-css-lib.jar with the new version, that's why I'm also mentioning this.

Just trying to help... :)

BTW: Happy New Year to everybody!!!