Sass break a specific border-image syntax about sass HOT 4 CLOSED

Oof, this is pretty rough. I see two feasible solutions here:

1. Keep the behavior as-is, and continue parsing // as an inline comment wherever it appears. This violates our core design principle of CSS compatibility.

2. Parse // in an expression context as a slash-separated list with an empty value in the middle. This would be hugely backwards-incompatible, since // is already widely used in expression contexts to begin a single-line comment.

Either one of these is very bad. I'll talk to some CSSWG folks about this, but my initial inclination is to go with option 1, and say you must include the space between the slashes in Sass. The migration cost for option 2 would be quite substantial, and we're already asking a lot of our users with the /-as-division migration and the module system migration.

Separately, this means we'll need to do two more things:

• Update the /-as-separator spec to support empty elements.
• Update the plain-CSS parser to support // in expression contexts.

from sass.

Yes, border-image is the only property with this issue currently (and likely in the future as well). However, Sass has a strong design commitment to referential transparency: the principle that writing an expression or writing a variable that contains that expression both behave the same way. If we say that border-image: 1//2 has one behavior and $border-image: 1//2; border-image: $border-image has another, that not only breaks user expectations in that particular instance it undermines their faith in their ability to reason about the language as a whole.

from sass.

Is border-image the only CSS property whose value can contain //? If yes, then maybe Sass could implement a special rule for when // appears after border-image on the same line, if that’s possible.

(border-image is defined at https://drafts.csswg.org/css-backgrounds-3/#propdef-border-image)

edit: I remembered that the value is not necessarily on the same line. That complicates things.

from sass.

Is border-image the only CSS property whose value can contain //? If yes, then maybe Sass could implement a special rule for when // appears after border-image on the same line, if that’s possible.

(border-image is defined at https://drafts.csswg.org/css-backgrounds-3/#propdef-border-image)

edit: I remembered that the value is not necessarily on the same line. That complicates things.

As far as I know it's the only one but maybe we can have more properties in the future.

from sass.