Bug 186355

Summary: All WebKit based browsers render <meter> elements in an unexpected way
Product: WebKit Reporter: Chris Deeming <chris+webkitbugzilla>
Component: Layout and RenderingAssignee: Nobody <webkit-unassigned>
Status: RESOLVED INVALID    
Severity: Normal CC: bfulgham, simon.fraser, zalan
Priority: P2    
Version: Safari 11   
Hardware: All   
OS: All   

Description Chris Deeming 2018-06-06 10:04:39 PDT 
Hello

I'm hesitant to report this as technically it isn't all WebKit based browsers. It also affects Blink (Chrome) and EdgeHTML (MS Edge) and it only works correctly (in my mind, at least) in Mozilla browsers.

But, certainly, in the cases that are (in my opinion) incorrect, the common factor appears to be WebKit (assuming that Blink is a fork and Microsoft tend to be more closely mirroring WebKit in its standards).

Anyway, it's quite simple. Open the following URL in both Safari/Chrome and Firefox:

https://jsfiddle.net/chrisxf/kqxt5pfa/

You will see that in WebKit browsers both value 3 and 4 are green, whereas in Firefox only value 4 is green, and value 3 is yellow.

I've noted what the expected results are and explained the logic for that.

It's entirely possible that the bug is on Mozilla's side, but the logic I've written seems to make the most sense to me and suggests that WebKit could be wrong. It could also be possible my logic is just totally wrong...

Any advice or future fixes appreciated.

Chris
Comment 1 Simon Fraser (smfr) 2018-06-06 10:49:17 PDT 
I'm not sure I agree. The "high" attribute specifies the lower bound of the "high" range, so if value == high, then the high color should be used.
Comment 2 Chris Deeming 2018-06-06 11:22:41 PDT 
(In reply to Simon Fraser (smfr) from comment #1)
> I'm not sure I agree. The "high" attribute specifies the lower bound of the
> "high" range, so if value == high, then the high color should be used.

You know, I can see your point, and I think you're right.

I just totally dumbed it down for myself and my value is essentially 75% which is in the last third (66.6%-100%) so that should be high.

Ok, I guess we can close this. I'll file a report with Mozilla instead.

Thanks Simon.