Open Bug 1007073 Opened 10 years ago Updated 2 years ago

CSS coverage display in style editor should handle columns

Categories

(DevTools :: Style Editor, defect, P3)

defect

Tracking

(Not tracked)

People

(Reporter: jwalker, Unassigned)

Details

The css coverage tool just marks the line on which an unused selector exists with class="cm-unused-line".

There are 2 part to marking the whole rule:

1. The biggest hurdle is finding a way to mark up many non-rectangular sections in codemirror without killing performance.

2. We need to work out where the rule actually ends, which means:

  * UsageReport.createEditorReport() needs to propagate
    "end: { line:L, column:C }" in addition to similar for "start"
  * We need a calculateRuleEnds, which works something like:

  /**
   * Parse the text of a stylesheet to find out where the ends of the rules are
   * @return a promise when the parse is complete
   */
  calculateRuleEnds: function(ui, href) {
    return ui.getTokens(href).then(tokens => {
      for (let [ruleId, ruleData] of this._knownRules) {
        // Loop over the known rules from this stylesheet
        let { ruleHref, line } = idToRule(ruleId);
        if (ruleHref != href) {
          continue;
        }

        // Find the first token on the line of this selector
        let start = 0;
        while (tokens[start].loc.start.line < line) {
          start++;
        }

        // Find the first end token after the start token
        let end = start;
        while (tokens[end].tokenType != "}") {
          end++;
        }

        ruleData.end = {
          line: tokens[end].loc.end.line,
          column: tokens[end].loc.end.column
        };
      }
    });
  },
When we can mark-up non-rectangular sections in codemirror then we should also split out our reporting of selector lists, however when we do, we should remember that ".a, b..c { color:red; }" does not make things with class=a red since the whole complex selector is rendered invalid by the one error.
Inspector bug triage (filter on CLIMBING SHOES).
Priority: -- → P3
Product: Firefox → DevTools
Severity: normal → S3
You need to log in before you can comment on or make changes to this bug.