1504945 - extension.css provides no custom "browser-style" styling for input type=range

Status: RESOLVED WONTFIX

(WebExtensions :: Frontend, enhancement, P3)

Description

[rugk]

User Agent: Mozilla/5.0 (X11; Fedora; Linux x86_64; rv:63.0) Gecko/20100101 Firefox/63.0

Steps to reproduce:

So create a WebExtension with an options page with "browser-style" according to https://developer.mozilla.org/en-US/Add-ons/WebExtensions/user_interface/Browser_styles and include an <input type="range" element,



Actual results:

Actually the styling does not change if you add "browser-style". It's the OS'/systems native. (at least in GNOME here)


Expected results:

A custom nice style in photon design should be applied. :)

Similar to https://bugzilla.mozilla.org/show_bug.cgi?id=1466418 I just guess no style was created/added for "typpe=range"

Comment 1

[Daniel Holbert [:dholbert]]

For reference, the extension.css file in question lives here:
https://searchfox.org/mozilla-central/source/browser/components/extensions/extension.css

And you can style the various parts of input[type="range"] using the input[type=range]::-moz-range-track and input[type=range]::-moz-range-thumb selectors (whose default styles are provided in forms.css):
https://searchfox.org/mozilla-central/rev/b096dcf0ea226af628fe03f7e7acb56a25853533/layout/style/res/forms.css#934
https://searchfox.org/mozilla-central/rev/b096dcf0ea226af628fe03f7e7acb56a25853533/layout/style/res/forms.css#990

Comment 2

[Rob Wu [:robwu]]

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