591308 - Inspector style panel css parsing should be checked against the CSS3 spec

Status: RESOLVED FIXED

(DevTools :: General, defect)

Description

[Joe Walker [:jwalker]]

http://www.w3.org/TR/css3-selectors/#specificity

We need to go through this carefully to check that we're doing the right thing.

Comment 1

[Joe Walker [:jwalker]]

We also need to make sure that we follow what the browser actually does instead of what we think it should do.

Ideally we need to hook into the browsers CSS parser for this.

As part of this checking we need to double check on the .weird#class case. That means class="weird" and id="class" and not class="weird#class" doesn't it???

Comment 2

[Joe Walker [:jwalker]]

The spec says that .weird#class means class="weird" and id="class" as we thought, and that's what Firefox seems to do:

  <style>
    .x#y { color:red !important; }
    #y.x { background-color: yellow !important; }
    .x#y { font-weight:bold !important; }
  <style>

  <p id="y" class="x">test id="y" class="x"</p>
  <p id="y.x">test id="y.x"</p>
  <p class="x#y">test class="x#y"</p>

Only the first paragraph is matched

Comment 3

[Joe Walker [:jwalker]]

I have done lots of checking and raised issues in bug 592743. We may find other issues, these will be raised as separate bugs.