680465 - Source Editor syntax highlighting for CSS is a bit confusing

Status: RESOLVED FIXED

(DevTools :: General, defect, P2)

Description

[Cedric Vivier [:cedricv]]

SourceEditor in CSS mode does not highlight according to CSS syntax.


/* comment */ is not highlighted at all
but //comment is (whereas this is not valid CSS)

Some/most property names are not highlighted, eg.:
border-collapse, -moz-border-radius, ...

It probably makes sense _not_ to highlight properties through some property list but through a pattern (eg. "[a-z-]+\:").
The highlighting should be about syntax, not about potential support of property (which anyways is difficult to do since there is frequently new properties and also -webkit- or even -ms- prefixed properties should be highlighted as usual).

Comment 1

[Mihai Sucan [:msucan]]

The CSS highlighting code from upstream, Orion, is unfortunately still "experimental". Indeed, it needs more work.

When this bug is prioritized, I'll look into updating the upstream code and fixing it as necessary. Thanks for your report!

Comment 2

[j.j.]

Please don't highlight obsolete -moz-prefixed properties like -moz-border-radius.

Comment 3

[Cedric Vivier [:cedricv]]

(In reply to j.j. from comment #2)
> Please don't highlight obsolete -moz-prefixed properties like
> -moz-border-radius.

Why? It's still valid CSS syntax (and supported for older browsers).
And there is still more valid properties added every other month... having a static list of words does not scale.


The fact it is obsolete (and/or unknown) could be visible in another way, for instance red underline like http://onjava.com/onjava/2004/07/28/graphics/eclipse1.gif or in a symbol in the gutter :)

In fact, we'll have a tool (called the CSS Doctor) who should be able to provide diagnostics such as this, and much more.

Comment 4

[j.j.]

(In reply to Cedric Vivier [cedricv] from comment #3)
> Why? It's still valid CSS syntax (and supported for older browsers).

If there is a property list, we should remove those properties ASAP. 
IMHO there is consensus that we should not spam the web with -moz-prefixes an should not encourage people to use it.

If the highlighting is syntax driven, ok then. A special highlighting for common vendor prefixes -ms, -webkit, -o, -moz, might be useful.

(just my 0,02 Euro, ask David Baron for a more sound view)

Comment 5

[j.j.]

BTW, maintaining a CSS property list is not trivial.
Maintaining a property list including all important vendor specific properties seems nearly impossible.

Comment 6

[Cedric Vivier [:cedricv]]

Good idea :)
With syntax/pattern driven highlighting, \-[a-z-]+\: (notice the prefix "-") could be highlighted a bit differently [and we do not have to keep track of all CSS prefixes that exists out there]

Comment 7

[j.j.]

You will miss the very common mso-prefix (notice the missing "-"), which spams the world since MS Office is able to create HTML files.
That's probably fine, because it does nothing in web browsers (I hope and assume).

Comment 8

[Mihai Sucan [:msucan]]

The situation is mostly unchanged upstream with the latest Orion. They now recognize /* comments */ in CSS mode, but the rest of the problems mentioned in comment 0 are still valid.

Comment 9

[Dave Camp (:dcamp)]

We're doing developer tool prioritization, filter on 'brontozaur'
to ignore the spam.

Comment 10

[Mihai Sucan [:msucan]]

Bug reported upstream:

https://bugs.eclipse.org/bugs/show_bug.cgi?id=362337

Comment 11

[Mihai Sucan [:msucan]]

This is fixed now by bug 702331.

Please note that support for highlighting more properties and an improved CSS parser will come at a later date. Upstream is preparing a rewrite of the CSS syntax highlighting code.