Bug 56925

Summary: Canvas text measurements wrong
Product: WebKit Reporter: sean hanna <hannasm>
Component: CanvasAssignee: Myles C. Maxfield <mmaxfield>
Status: RESOLVED WORKSFORME    
Severity: Normal CC: krit, mdelaney7, mmaxfield
Priority: P2    
Version: 528+ (Nightly build)   
Hardware: PC   
OS: Windows XP   
URL: http://jsfiddle.net/k44x3/1/

Description sean hanna 2011-03-23 08:29:11 PDT
I've created a good test case for this issue at jsfiddle url.

http://jsfiddle.net/k44x3/1/

Using a dom / javascript based text measurement approach, safari yields the actual width of the text.

Using canvas based approach the text measurement jumps around and becomes wildly inaccurate as text length increases.

Tested in nightly snapshot WebKit-SVN-r80840

Oddly, versions of chrome from the oldest version 1.0 to latest 10.0 handle these measurements fine, and I thought chrome integrated webkit so don't ask me how that happened. MOST versions of chrome i tested on were reporting webkit version 534 instead of the 533 that is reported for safari (by jquery browser detection.

This test case generates accurate measurements in firefox and opera versions i've tested too.
Comment 1 Dirk Schulze 2014-04-03 02:28:41 PDT
I get 
Need at least three spaces
Canvas calculated length of 172
JQuery width() calculated length of 174

Seems close. Firefox returns 173.56666564941406. Blink return 172 for both, query and canvas. Is this still valid?
Comment 2 Dirk Schulze 2014-04-05 13:59:25 PDT
Please reopen if I am mistaken.