1484502 - extension.css has overly broad rules; clobbers styles extensions are unable to revert

Status: RESOLVED WONTFIX

(WebExtensions :: Frontend, defect, P3)

Description

[Brian Birtles (:birtles, Feb 26~ parental leave)]

Specifically I am getting stuck because of this rule[1]:

  body * {
    box-sizing: border-box;
    text-align: start;
  }

which will set `text-align: start` on everything in the body.

When this is applied to an options page text <inputs> will have an anonymous content div which gets this rule applied. As a result, it is impossible to make a text <input> with `text-align: center` since stylesheets provided by extensions are not allowed to style anonymous content.

i.e. the following won't work:

  input[type=text] > .anonymous-div {
    text-align: center;
  }

Does the `body *` rule need to be this broad? What is it trying to achieve?

[1] https://searchfox.org/mozilla-central/rev/ef8b3886cb173d5534b954b6fb7eb2d94a9473d0/browser/components/extensions/extension.css#19-22

Comment 1

[Brian Birtles (:birtles, Feb 26~ parental leave)]

Blake, do you know what the `text-align: start` is needed for in extension.css in the following rule:

  body * {
    box-sizing: border-box;
    text-align: start;
  }

Is there any way we could scope that more narrowly?

For the particular problem I am trying to solve, even just the following might work:

e.g.

  body *:not(.anonymous-div) {
    text-align: start;
  }

Comment 2

[Blake Winton (:bwinton) (:☕️)]

Shorlander would be the person to ask about why, but I suspect we weren't thinking about anonymous content, and the lack of stylability from extensions. The example fix you give in comment 1 would work just fine for me. :)

Comment 3

[Mike Conca [:mconca]]

Shane, can you add this to browser_style tracker you have going?

Comment 4

[ExE Boss]

Or just get rid of the `text-align` property from `body *` altogether, and if you need to unset it for <button>s, <input> and <select>, which you don’t, as the annoying `.browser‑style` class from bug 1354336 already does that to everything it’s applied to.

Comment 5

[Brian Birtles (:birtles, Feb 26~ parental leave)]

Yeah, I just don't understand why it was set in the first place so I wasn't sure if it's ok to drop it.

(I'm pretty cautious about changing extension.css. For example, the changes to checkbox styling in bug 1371951 messed up the options page in my extension and it's now quite hard to make that page look correct on versions of Firefox with and without that change.)

Comment 6

[Rob Wu [:robwu]]

Closing bug because support for browser_style feature is going to be removed (at least in MV3), see bug 1827910.