Skip to content

[cssom] Serialization of nested grouping rules is all weird #5494

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Open
emilio opened this issue Sep 3, 2020 · 2 comments
Open

[cssom] Serialization of nested grouping rules is all weird #5494

emilio opened this issue Sep 3, 2020 · 2 comments
Labels
cssom-1 Current Work

Comments

@emilio
Copy link
Collaborator

emilio commented Sep 3, 2020 •
edited
Loading

https://drafts.csswg.org/cssom/#serialize-a-css-rule includes "separated by a newline and indented by two spaces" in some rules like CSSMediaRule is a bit weird.

Take this example (link):

<!DOCTYPE html>
<style>
@media screen { @media screen { div { color: red } } }
@supports (display: grid) { @supports (display: grid) { foo { color: green } }
</style>
<script>
console.log(document.styleSheets[0].cssRules[0].cssText);
console.log(document.styleSheets[0].cssRules[1].cssText);
</script>

All browsers show the following on the console:

@media screen {
  @media screen {
  div { color: red; }
}
}
@supports (display: grid) {
  @supports (display: grid) {
  foo { color: green; }
}
}

Which is pretty odd. It is very simple because that means that the serialization for a rule doesn't have to be stateful, but the result just sucks...

My question is, should we fix this? And assuming the answer is yes, should we fix this by properly indenting things, or by removing the indentation altogether?
@emilio emilio added the cssom-1 Current Work label Sep 3, 2020
@tabatkins
Copy link
Member

I was cleaning out my browser tabs, and was about to start working on #4828 which this is kinda a dupe of. Luckily, we already have a resolution for it - unless browser compat requires otherwise, serialize without newlines or indentation.

@tabatkins
Copy link
Member

Ah, now I've gone slightly further back in my email and see that you commented on that thread yesterday. ^_^

I think we should either remove the indentation or do it right; this half-assed indentation is horrid and nonsensical.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
cssom-1 Current Work
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@tabatkins @emilio