Bug 51317

Summary: Canvas poor text rendering on Windows using fillText()
Product: WebKit Reporter: jonhilton64
Component: CanvasAssignee: Nobody <webkit-unassigned>
Status: UNCONFIRMED    
Severity: Normal CC: ahmad.saleem792, ap, bfulgham, mdelaney7
Priority: P2    
Version: 528+ (Nightly build)   
Hardware: PC   
OS: Windows 8   
Attachments:
Description Flags
Screenshot
none
Safari 15.5 matches other browsers none

jonhilton64
Reported 2010-12-19 20:30:33 PST
Created attachment 76973 [details] Screenshot Using Safari and WebKit.exe, the fillText() function renders poor quality fonts compared to other browsers such as IE and Chrome as shown in the attached screen shot. Here is the HTML to reproduce the problem: <!DOCTYPE html> <html> <head> <script> function draw() { var canvas = document.getElementById('canvas'); var context = canvas.getContext('2d'); context.save(); context.font = '10px Arial'; context.fillText('Hello World!', 20, 10); context.font = '12px Arial'; context.fillText('Hello World!', 20, 50); context.font = '16px Arial'; context.fillText('Hello World!', 20, 90); context.font = '20px Arial'; context.fillText('Hello World!', 20, 130); context.font = '24px Arial'; context.fillText('Hello World!', 20, 170); context.restore(); } </script> </head> <body onload="draw()"> <p><canvas id="canvas" tabindex="1" width="500" height="500" /></p> </body> </html>
Attachments
Screenshot (42.18 KB, image/png)
2010-12-19 20:30 PST, jonhilton64 		no flags
Details
Safari 15.5 matches other browsers (489.71 KB, image/png)
2022-06-01 16:38 PDT, Ahmad Saleem 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Ahmad Saleem
Comment 1 2022-06-01 16:38:34 PDT
Created attachment 459943 [details] Safari 15.5 matches other browsers I am unable to reproduce this bug by copying the test case from Comment 01 and changing into JS Fiddle (https://jsfiddle.net/0m1p95gx/) in Safari 15.5 on macOS 12.4. It matches other browsers and from the attached reference screenshots, it was from Safari on Windows while this bug was filed as "Mac OS X". I think it might be Windows specific font rendering issue due to different APIs (e.g. Direct2D or OpenGL etc.). I think since all browsers are now rendering text same without any issue. It should be marked as "RESOLVED INVALID" or "RESOLVED CONFIGURATION CHANGED" depending on whether it was platform specific bug or just something fixed in Safari down the line. Thanks!
Alexey Proskuryakov
Comment 2 2022-06-01 17:02:24 PDT
WebKit still supports Windows, so I don't think that testing Safari invalidates this bug report. I'm changing the version from macOS to Windows though, to reduce confusion. There is a good chance that this no longer reproduces even on Windows, of course.
Note You need to log in before you can comment on or make changes to this bug.