[css-images-4] Editorial: comma is incorrect in syntax graph in 2.3. Gradient Color-Stops

[upsuper]

There should be a comma between <color-hint> and the final <color-stop> according the the syntax.

https://drafts.csswg.org/css-images-4/#color-stop-syntax

[LeaVerou]

I just pushed a change that fixes this issue, hopefully without introducing any new ones.

Previous diagram:

New diagram:

I wonder if @tabatkins can think of a more elegant solution that only has 2 comma tokens instead of 3?

It appears that the grammar was incorrect too:

<color-stop-list> =
  [ <linear-color-stop> , <linear-color-hint>? ]# , <linear-color-stop>

Note that the ? applies to <linear-color-hint> only, so you could have two consecutive commas and it would still match. I changed it to:

<color-stop-list> =
  [ <linear-color-stop> [, <linear-color-hint>]? ]# , <linear-color-stop>

[tabatkins]

Nah, note that in CSS grammars, commas are implicitly omittable (and in fact, must be omitted) if they're not separating things. So the grammar was fine before, but a naive translation of it to a railroad diagram is problematic.

[LeaVerou]

@tabatkins Not sure I follow. In this case, the commas are separating things, no? I didn’t add any commas to the grammar, just grouped the existing ones to better reflect what's going on. Also, if commas are implicitly omittable, why do we even have the # quantifier? We could just use + then!

[tabatkins]

In this case, the commas are separating things, no?

Not if the second thing is omitted, no.

That is, given the original grammar of [ a , b? ]# a, you can't write a ,, a - the first comma is no longer separating an a from a b, so it must be omitted.

Or for a somewhat simpler/clearer example, in a grammar like a? , b? , c?, all the "obvious" things are valid - b, a, c, a, b, c, etc - but not things like b, or a,,c, because those have commas that aren't separating things.

Also, if commas are implicitly omittable, why do we even have the # quantifier? We could just use + then!

I said implicitly omittable if they're not separating things. Separating repetitions is exactly what the comma does in #.

[LeaVerou]

Yeah, I misunderstood your original comment. Why not just link to https://drafts.csswg.org/css-values-4/#comb-comma which explains this in detail, instead of re-explaining it in comments here?

On one hand, this does really simplify grammars that would be pointlessly convoluted otherwise. On the other hand, it makes grammars inconsistent from any other grammar definition or regex anywhere else, which could confuse many. It would be better to have a specific operator for this (just like we invented #) than custom rules about what quantifiers apply to.

[tabatkins]

Why not just link to https://drafts.csswg.org/css-values-4/#comb-comma which explains this in detail, instead of re-explaining it in comments here?

I assumed you'd already checked that out and were missing something, so I explained it in a different way. ^_^

On the other hand, it makes grammars inconsistent from any other grammar definition or regex anywhere else, which could confuse many.

Yeah, that's my concern too. On balance, tho, I think it's worthwhile. CSS grammars are already pretty significantly different from most, anyway - in particular, their reliance on the CSS parser and its tokens, and the implicitly-omittable whitespace rules. (Except for a very small number of places where we explicitly require it, you can omit all whitespace from your stylesheet, if you're willing to sprinkle /**/ around in lots of places.)

It would be better to have a specific operator for this (just like we invented #)

I think having some special grammar-construct to represent "a comma, but this might need to be omitted" would end up kinda confusing. It's very rarely relevant, and the rule of "doubled commas, or commas in weird places, are invalid" is obvious in practice, because it just looks wrong.

than custom rules about what quantifiers apply to.

Unsure what you mean by this. All quantifiers apply to everything. (In fact, you can do ,? to represent a comma that can be straight-up omitted anytime - this is used to represent some SVG grammars where commas are truly optional.)