Multiline CSS & JS strings are not correctly highlighted

[LeaVerou]

One can have multiline CSS/JS strings by escaping them with \ at the end of the line. However, Prism does not highlight them correctly.

[Golmote]

The bug for JS strings was already mentioned in #66. PR #417 should solve it.

[LeaVerou]

Hey, I just tried to highlight this in the test drive page:

/**
 * Basic border-image demo
 */

div {
    border: 40px solid transparent;
    border-image: 33.334% url('data:image/svg+xml,<svg xmlns="http:%2F%2Fwww.w3.org%2F2000%2Fsvg" width="30" height="30"> \
                          <circle cx="5" cy="5" r="5" fill="#ab4"%2F><circle cx="15" cy="5" r="5" fill=" #655"%2F> \
                          <circle cx="25" cy="5" r="5" fill="#e07"%2F><circle cx="5" cy="15" r="5" fill=" #655"%2F> \
                          <circle cx="15" cy="15" r="5" fill="hsl(15, 25%, 75%)"%2F> \
                          <circle cx="25" cy="15" r="5" fill=" #655"%2F><circle cx="5" cy="25" r="5" fill="#fb3"%2F> \
                          <circle cx="15" cy="25" r="5" fill=" #655"%2F><circle cx="25" cy="25" r="5" fill="#58a"%2F><%2Fsvg>');
    padding: 1em;
    max-width: 20em;
    font: 130%/1.6 Baskerville, Palatino, serif;
}

div:nth-child(2) {
    margin-top: 1em;
    border-image-repeat: round;
}

And the multiline string wasn't highlighted...

[Golmote]

This must be because I did not allowed multi-line urls. I did not notice they were handle as a separated token. I'll check it tonight.

But this makes me worry about another point: do you know why the selector and property tokens are before the string token?

[Golmote]

Multi-line urls are supported now : e4a13e5

There is still the problem of the position of the string pattern, though. It prevents Prism from properly highlighting something like:

foo {
  content: 'foo:bar'
}

because foo: in the string is highlighted as a property...

Are you aware of any requirement for selector and property to be listed before string?

[LeaVerou]

Can’t think of any reason for property to be before string. As for selector, perhaps if there's some pseudo-class in the future that accepts a string argument? Can't think of anything at this point.

Thanks for the commit btw!

[Golmote]

I'll move the string pattern above the property one, then.

[LeaVerou]

Thanks!!

[LeaVerou]

Oh I remembered re: selectors: Attribute selectors would then break.

[Golmote]

And that's a really good point!

[vkbansal]

Just to put it out there, I'm working on stylus definition and have written selector definitions from ground up. I think it shall be able to solve the problem. Will open a PR as soon as it's ready.