| <html> |
| <head> |
| <meta charset="UTF-8" /> |
| <title>Canvas Normalized String Test</title> |
| </head> |
| |
| <body> |
| <p>On success, two same text string with equal width will be rendered.</p> |
| <canvas id="myCanvas" width="300px" height="300px" style="border:1px solid #c3c3c3;"> |
| Your browser does not support the canvas element. |
| </canvas> |
| <div id="console"></div> |
| |
| <script type="text/javascript"> |
| function compareImageData(img1,img2) |
| { |
| if(img1.data.length != img2.data.length) |
| return false; |
| |
| for(var i = 0; i < img1.data.length; ++i){ |
| if(img1.data[i] != img2.data[i]) |
| return false; |
| } |
| return true; |
| } |
| |
| function compareStrings(string1, string2, fontSize, ctx, yCo) |
| { |
| ctx.fillText(string1, 10, yCo); |
| var imgDataCombinedText = ctx.getImageData(10,yCo-fontSize, ctx.measureText(string1).width,fontSize); |
| |
| yCo += fontSize * 2; |
| ctx.fillText(string2, 10, yCo); |
| var imgData = ctx.getImageData(10, yCo-fontSize, ctx.measureText(string2).width,fontSize); |
| return compareImageData(imgDataCombinedText, imgData); |
| } |
| |
| if (window.testRunner) |
| testRunner.dumpAsText(); |
| |
| var c=document.getElementById("myCanvas"); |
| var ctx=c.getContext("2d"); |
| |
| var yCo = 30; |
| var testFlag = false; |
| var fontFamily = "Arial, san-serif"; |
| var fontSize = 20; |
| ctx.font = fontSize + "px " + fontFamily; |
| |
| // This will test both Complex and Simple code path |
| var latinString="Sample string \u0009 \u000A \u000D string end"; |
| var normalizedLatinString="Sample string \u0020 \u0020 \u0020 string end"; |
| |
| var HindiString="हिन्दी \u0009 \u000A \u000D हिन्दी "; |
| var normalizedHindiString="हिन्दी \u0020 \u0020 \u0020 हिन्दी "; |
| |
| testFlag = compareStrings(latinString, normalizedLatinString, fontSize, ctx, yCo); |
| yCo += fontSize * 4; |
| testFlag = compareStrings(HindiString, normalizedHindiString, fontSize, ctx, yCo); |
| if (testFlag) |
| document.getElementById("console").innerHTML = "TEST PASSED"; |
| else |
| document.getElementById("console").innerHTML = "TEST FAILED"; |
| |
| </script> |
| </body> |
| </html> |
