Bug 226334

Summary: Canvas textBaseline "top" inconsistent with Chrome
Product: WebKit Reporter: Ashley Gullen <ashley>
Component: CanvasAssignee: Nobody <webkit-unassigned>
Status: NEW    
Severity: Normal CC: dino, mmaxfield, ryan, sabouhallawa, simon.fraser, webkit-bug-importer
Priority: P2 Keywords: InRadar
Version: Safari 14   
Hardware: Unspecified   
OS: Unspecified   
Attachments:
Description Flags
test case none

Ashley Gullen
Reported 2021-05-27 08:58:01 PDT
When drawing text with canvas2d with the "top" baseline, Safari's positioning is different to Chrome. Minimal repro: https://downloads.scirra.com/labs/bugs/text-top-baseline/index.html Comparison Safari vs. Chrome image: https://downloads.scirra.com/labs/bugs/text-top-baseline/comparison.png Observed result: notice the text in Safari is positioned a few pixels lower from the top. Expected result: text positioning to be consistent across browsers. This issue makes it difficult to get consistent text positioning when drawing text to canvases, particularly if the text is positioned relatively to other content, such as a box drawn around it, or when trying to calculate vertical alignment. I am not sure which browser is correct, so I'm filing issues with both Safari and Chrome.
Attachments
test case (694 bytes, text/html)
2021-06-04 10:59 PDT, Said Abou-Hallawa 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Ashley Gullen
Comment 1 2021-05-27 09:00:34 PDT
Corresponding Chrome issue: https://bugs.chromium.org/p/chromium/issues/detail?id=1213949
Radar WebKit Bug Importer
Comment 2 2021-06-03 08:58:16 PDT
<rdar://problem/78817913>
Said Abou-Hallawa
Comment 3 2021-06-04 10:59:17 PDT
Created attachment 430593 [details] test case I think there is also a bug in displaying the text with hanging and middle baseline, see the attached "test case".
Note You need to log in before you can comment on or make changes to this bug.