Closed
Bug 1501483
Opened 6 years ago
Closed 6 years ago
Add -webkit-appearance:meter and make that the default for <meter> for compatibility with other UAs
Categories
(Core :: CSS Parsing and Computation, enhancement, P3)
Core
CSS Parsing and Computation
Tracking
()
RESOLVED
FIXED
mozilla65
Tracking | Status | |
---|---|---|
firefox65 | --- | fixed |
People
(Reporter: MatsPalmgren_bugz, Assigned: MatsPalmgren_bugz)
References
Details
(Keywords: dev-doc-complete, testcase)
Attachments
(2 files)
848 bytes,
text/html
|
Details | |
Add -webkit-appearance:meter and make that the default for <meter> for compatibility with other UAs.
7.91 KB,
patch
|
jwatt
:
review+
|
Details | Diff | Splinter Review |
We should add a new 'meter' value to '-webkit-appearance' in the style system, and make the existing 'meterbar' value an alias for 'meter'. We should also replace any existing 'meterbar' values in our UA sheets with 'meter'. In particular, the default value for <meter>. Chrome uses '-webkit-appearance:meter' on the <meter> element. Setting '-webkit-appearance:none' removes the theme and it renders its contents instead. Setting display:inline appears to work but it appears they use an inner anonymous block to render the contents, so it ends up as a block-in-inline. display:contents works as display:none. Edge, on the other hand, uses '-webkit-appearance:none' by default on <meter> and it never renders its contents. display:contents appears to have no effect. Setting the 'background' doesn't seem to work at all. https://html.spec.whatwg.org/multipage/form-elements.html#the-meter-element says: "Content model: Phrasing content, but there must be no meter element descendants." ... "Authors are encouraged to include a textual representation of the gauge's state in the element's contents, for users of user agents that do not support the meter element."
Assignee | ||
Comment 1•6 years ago
|
||
> Edge, ... display:contents appears to have no effect.
Oh right, I forgot - they don't support it, LOL.
Assignee | ||
Comment 2•6 years ago
|
||
Safari also has '-webkit-appearance:meter' on <meter>. It renders the test somewhat like Firefox - not rendering its contents in particular. We should probably try to avoid emulating that part Chrome's behavior if we can (and file a bug on Chrome instead).
Comment 3•6 years ago
|
||
Note that chrome has something similar for <progress> and it's not fun: https://bugs.chromium.org/p/chromium/issues/detail?id=853558 I don't know if they have the same bug with <meter>, but it wouldn't surprise me.
Assignee | ||
Comment 4•6 years ago
|
||
Yeah, technically it's a violation of the HTML spec since they do support <meter>. I read the spec text as only applying to UAs that don't support the <meter> element at all, in which case the contents will render naturally.
Assignee | ||
Comment 5•6 years ago
|
||
https://treeherder.mozilla.org/#/jobs?repo=try&revision=633acd32da539d4174a83c36c58f137874ed7ca8
Assignee: nobody → mats
Assignee | ||
Comment 6•6 years ago
|
||
Keep our old value 'meterbar' as an alias for now, but unship 'meterchunk' by restricting it to UA/chrome sheets only.
Attachment #9023257 -
Flags: review?(jwatt)
Updated•6 years ago
|
Attachment #9023257 -
Flags: review?(jwatt) → review+
Pushed by mpalmgren@mozilla.com: https://hg.mozilla.org/integration/mozilla-inbound/rev/06421db62f78 Add -webkit-appearance:meter and make that the default for <meter> for compatibility with other UAs. r=jwatt
Comment 8•6 years ago
|
||
bugherder |
https://hg.mozilla.org/mozilla-central/rev/06421db62f78
Status: NEW → RESOLVED
Closed: 6 years ago
Resolution: --- → FIXED
Target Milestone: --- → mozilla65
Keywords: dev-doc-needed
Comment 10•6 years ago
|
||
Note to MDN writers: I've added a note to the Fx65 rel notes to cover this: https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/65#CSS As for the docs, this should be a simple matter of adding the value to the appearance reference page and the compat data.
Comment 11•5 years ago
|
||
Updated the table to add meter support for FF, made it standard, and added comment on meterbar to use meter instead. https://developer.mozilla.org/en-US/docs/Web/CSS/appearance
Keywords: dev-doc-needed → dev-doc-complete
You need to log in
before you can comment on or make changes to this bug.
Description
•