Index: third_party/WebKit/LayoutTests/fast/canvas/canvas-textMetrics-width.html |
diff --git a/third_party/WebKit/LayoutTests/fast/canvas/canvas-textMetrics-width.html b/third_party/WebKit/LayoutTests/fast/canvas/canvas-textMetrics-width.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..41c00020bb6dfd7d3ad1127cd6f73697b54fdb0e |
--- /dev/null |
+++ b/third_party/WebKit/LayoutTests/fast/canvas/canvas-textMetrics-width.html |
@@ -0,0 +1,28 @@ |
+<!DOCTYPE html> |
+<head> |
+<style> |
+@font-face { |
+ font-family: Ahem; |
+ src: url('../../resources/Ahem.ttf'); |
+} |
+</style> |
+</head> |
+<body> |
+<p>On success, the red text "Hello World" should be tightly contained inside the two thin red lines.</p> |
+<canvas id="canvas" width="300" height="50"></canvas> |
+<script> |
+if (window.testRunner) |
+ testRunner.dumpAsTextWithPixelResults(); |
+ |
+var canvas = document.getElementById('canvas'); |
+var ctx = canvas.getContext('2d'); |
+var text = "Hello World"; |
+ctx.font = "50px Ahem"; |
+ctx.fillStyle = '#FF0000'; |
+ctx.textBaseline = "top"; |
+ctx.fillText(text, 1, 0); |
+var textMetrics = ctx.measureText(text); |
+ctx.fillRect(0, 0, 1, 50); |
+ctx.fillRect(Math.ceil(textMetrics.width), 0, 1, 50); |
+</script> |
+</body> |