Skip to content

support for media query level 4 #8013#8409

Merged
matthiasblaesing merged 1 commit intoapache:masterfrom
haidubogdan:t_8013_css_media_query_level_4
May 25, 2025
Merged

support for media query level 4 #8013#8409
matthiasblaesing merged 1 commit intoapache:masterfrom
haidubogdan:t_8013_css_media_query_level_4

Conversation

@haidubogdan
Copy link
Contributor

@haidubogdan haidubogdan commented Apr 8, 2025

This is a pull request to fix parser error warnings on some css media query level 4 syntax. (issue #8013)

This will include changes on antlr parser file, the css parser node structure.
Still not sure about the naming of the new parser rules.

Before:

image

image

After:

image


Includes syntax recognition for

@media (not (color)) or (hover) {}

image


^Add meaningful description above

Click to collapse/expand PR instructions

By opening a pull request you confirm that, unless explicitly stated otherwise, the changes -

  • are all your own work, and you have the right to contribute them.
  • are contributed solely under the terms and conditions of the Apache License 2.0 (see section 5 of the license for more information).

Please make sure (eg. git log) that all commits have a valid name and email address for you in the Author field.

If you're a first time contributor, see the Contributing guidelines for more information.

If you're a committer, please label the PR before pressing "Create pull request" so that the right test jobs can run.

PR approval and merge checklist:

  1. Was this PR correctly labeled, did the right tests run? When did they run?
  2. Is this PR squashed?
  3. Are author name / email address correct? Are co-authors correctly listed? Do the commit messages need updates?
  4. Does the PR title and description still fit after the Nth iteration? Is the description sufficient to appear in the release notes?

If this PR targets the delivery branch: don't merge. (full wiki article)

@haidubogdan haidubogdan force-pushed the t_8013_css_media_query_level_4 branch from 33acb03 to 6ee3cdc Compare April 8, 2025 20:42
@mbien mbien added the CSS [ci] enable web job label Apr 8, 2025
@haidubogdan haidubogdan marked this pull request as ready for review April 9, 2025 06:34
@haidubogdan haidubogdan force-pushed the t_8013_css_media_query_level_4 branch from 6ee3cdc to 9119ed0 Compare April 15, 2025 12:38
@matthiasblaesing
Copy link
Contributor

Still not sure about the naming of the new parser rules.

I suggest to see if it would make sense to follow the names from the CSS4 document: https://drafts.csswg.org/mediaqueries/#mq-syntax. That grammar might also give a hint what needs to be supported and might enable a complete implementation.

@haidubogdan
Copy link
Contributor Author

Still not sure about the naming of the new parser rules.

I suggest to see if it would make sense to follow the names from the CSS4 document: https://drafts.csswg.org/mediaqueries/#mq-syntax. That grammar might also give a hint what needs to be supported and might enable a complete implementation.

Ah yes, at a first glance from this perspective I think mediaRangeParameter should have been mediaFeatureValue and the current mediaFeatureValue is more like a mediaFeatureValueExpression.
I will analyze it.

@haidubogdan haidubogdan force-pushed the t_8013_css_media_query_level_4 branch 2 times, most recently from fd0eaed to 509c382 Compare May 14, 2025 20:23
@haidubogdan
Copy link
Contributor Author

I've updated the naming.

There is a "hack" though for cp_css files in which the condition :

(mediaRangeExplicitValue | mediaFeatureValue )

was used to fix the greedy sass expression in :

`30em <= width <= 1200px`

The width was identified as term instead of mediaFeature identifier.

@haidubogdan haidubogdan force-pushed the t_8013_css_media_query_level_4 branch 3 times, most recently from 02d71dc to 2114e72 Compare May 19, 2025 23:12
@haidubogdan
Copy link
Contributor Author

I see that I will have to revert some updates from NodeType for compatiblity reason.

@haidubogdan haidubogdan force-pushed the t_8013_css_media_query_level_4 branch from 2114e72 to 668601f Compare May 20, 2025 18:43
@haidubogdan
Copy link
Contributor Author

Now I see that I got myself into some trouble emulating the new syntax :) .
Maybe some abstractions can be done to simplify the logic, but the Css model implementation needs to be updated.

Before:

image


And with media query 4:

image

@matthiasblaesing
Copy link
Contributor

@haidubogdan yeah these things have the tendency to be the proverbial can of worms. Could you give me an insight whether you need/want help and if so, where or what is the current state?

@haidubogdan
Copy link
Contributor Author

Thank you @matthiasblaesing, for the moment it should be ok.
The zone which needs to be adapted is the CssModel.
I think I understand it's implementation. In the end it's a matter of applying a compatible solution between the antlr parser and the element model factory.

@matthiasblaesing
Copy link
Contributor

@haidubogdan maybe helpful for you. The org.netbeans.modules.css.model module has only "friend-only" dependencies, so you can adjust the API + SPI and "just" take care of the use sites.

@haidubogdan haidubogdan force-pushed the t_8013_css_media_query_level_4 branch 2 times, most recently from 43c1af6 to 25399cf Compare May 23, 2025 04:32
@haidubogdan
Copy link
Contributor Author

@matthiasblaesing I hope that the latest commit will pass the tests.

At the current stage there are no additional nodeType tests for the new range syntax, just the parser tests.
I didn't envision other usage for it.

@haidubogdan haidubogdan force-pushed the t_8013_css_media_query_level_4 branch from 25399cf to cc2611b Compare May 23, 2025 04:43
Copy link
Contributor

@matthiasblaesing matthiasblaesing left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks sane to me. Unless the CI/CD run yields errors, I'll merge sometime today.

We'll need to have a look at the structure scanner and the model classes in light of newer developments in CSS. The match nested structures and new features badly, but that is another discussion.

Thank you.

@apache apache locked and limited conversation to collaborators May 25, 2025
@apache apache unlocked this conversation May 25, 2025
@matthiasblaesing matthiasblaesing merged commit c0f70ee into apache:master May 25, 2025
62 checks passed
@neilcsmith-net neilcsmith-net added this to the NB27 milestone Jul 23, 2025
@haidubogdan haidubogdan deleted the t_8013_css_media_query_level_4 branch August 25, 2025 17:33
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

CSS [ci] enable web job

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants