1065647 - Stop including browser.css inside each devtool panel

Status: RESOLVED DUPLICATE of bug 1226570

(DevTools :: General, defect)

Description

[Tim Nguyen :ntim]

In every developer tool panel, we include the chrome://browser/skin/ stylesheet. To my knowledge, that stylesheet is nothing related to the devtools themselves, and isn't a reset stylesheet or a XUL stylesheet. That stylesheet is used to style the browser chrome.

Comment 1

[Tim Nguyen :ntim]

Attachment: Patch

Just a test patch. I'll ask for review if there are no regressions.

Try push : https://tbpl.mozilla.org/?tree=Try&rev=ae72aca1ba54

Comment 2

[Tim Nguyen :ntim]

Looks like there are some small margin and font issues, but other than that, everything is fine.

For the font issue, we can include chrome://global/skin/ for affected panels.
For margin issue, I guess we could add extra rules in our devtools CSS.

It's still better than having all the browser CSS loaded inside the devtools.

What do you think ?

Comment 3

[Brian Grinstead [:bgrins]]

Looks like the margin issues may have to do with toolbarbuttons / toolbarbutton-icons or something?  Looks like it should be resolvable if we were to move forward with it.

I'm not actually sure about loading chrome://global/skin vs chrome://browser/skin/. I do wonder for styling of things like buttons, tabs, panels and other controls (but to be fair everything looks generally OK with the patch applied).  I'll defer to Paul about this since he will probably have a better idea.  Paul, does it make sense to you to do this?

Comment 4

[Paul Rouget [:paul]]

I totally support the idea of killing references to browser.css.

I can't remember why we originally wanted to include browser.css. A vague memory tells me it has to do with the resizers.

What rules in browser.css change the margins?

Comment 5

[Mike Ratcliffe [:miker] [:mratcliffe] [:mikeratcliffe]]

(In reply to Paul Rouget [:paul] (slow to respond. Ping me on IRC) from comment #4)
> I can't remember why we originally wanted to include browser.css. A vague
> memory tells me it has to do with the resizers.
> 

We had to include it in the style inspector to use the native search box. Probably a similar story in other tools but now we are no longer using native widgets so we don't really need browser.css.

We should check that the native widgets we do use look and act correctly across operating systems (I say act because we may be missing some bindings). From memory that would be the resizer, toolbars, radio-buttons, checkboxes, scrollbars, tabboxes, tabpanels etc.

Comment 6

[Girish Sharma [:Optimizer]]

If the concern here is about memory, then this is almost similar to what Adblock Plus is facing. It adds the same style sheet in each window/iframe and that piles up in memory. (bug 988266)

Comment 7

[J. Ryan Stinnett [:jryans] (Use needinfo, replies may be slow)]

I'm doing this work in bug 1226570.  Will check each OS to make sure there's no impact.