Open
Description
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?