summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas
diff options
context:
space:
mode:
authorMatt A. Tobin <mattatobin@localhost.localdomain>2018-02-02 04:16:08 -0500
committerMatt A. Tobin <mattatobin@localhost.localdomain>2018-02-02 04:16:08 -0500
commit5f8de423f190bbb79a62f804151bc24824fa32d8 (patch)
tree10027f336435511475e392454359edea8e25895d /testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas
parent49ee0794b5d912db1f95dce6eb52d781dc210db5 (diff)
downloadUXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.gz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.lz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.xz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.zip
Add m-esr52 at 52.6.0
Diffstat (limited to 'testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas')
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/.gitkeep0
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.center.html48
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.end.ltr.html48
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.end.rtl.html48
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.left.html48
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.right.html48
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.start.ltr.html48
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.start.rtl.html48
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.baseline.alphabetic.html48
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.basic-manual.html32
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.basic.pngbin0 -> 1062 bytes
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.NaN.html32
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.bound.html45
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.fontface.html45
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.large-manual.html31
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.large.pngbin0 -> 1062 bytes
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.negative.html32
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.small.html32
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.zero.html32
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.rtl-manual.html32
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.rtl.pngbin0 -> 1062 bytes
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.unaffected.html42
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fontface.html45
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fontface.notinpage.html44
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fontface.repeat.html45
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.kern.consistent-manual.html36
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.space.basic.html43
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.space.collapse.nonspace.html43
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.stroke.basic-manual.html33
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.stroke.basic.pngbin0 -> 1637 bytes
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.stroke.unaffected.html43
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.measure.width.basic.html43
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.measure.width.empty.html38
33 files changed, 1152 insertions, 0 deletions
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/.gitkeep b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/.gitkeep
new file mode 100644
index 000000000..e69de29bb
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/.gitkeep
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.center.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.center.html
new file mode 100644
index 000000000..bcbdbd665
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.center.html
@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.draw.align.center</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<style>
+@font-face {
+ font-family: CanvasTest;
+ src: url("/fonts/CanvasTest.ttf");
+}
+</style>
+<body class="show_output">
+
+<h1>2d.text.draw.align.center</h1>
+<p class="desc">textAlign center is the center of the em squares (not the bounding box)</p>
+
+
+<span style="font-family: CanvasTest; position: absolute; visibility: hidden">A</span>
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("textAlign center is the center of the em squares (not the bounding box)");
+_addTest(function(canvas, ctx) {
+
+ctx.font = '50px CanvasTest';
+deferTest();
+setTimeout(t.step_func_done(function () {
+ ctx.fillStyle = '#f00';
+ ctx.fillRect(0, 0, 100, 50);
+ ctx.fillStyle = '#0f0';
+ ctx.textAlign = 'center';
+ ctx.fillText('DD', 50, 37.5);
+ _assertPixelApprox(canvas, 5,5, 0,255,0,255, "5,5", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 95,5, 0,255,0,255, "95,5", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 25,25, 0,255,0,255, "25,25", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 75,25, 0,255,0,255, "75,25", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 5,45, 0,255,0,255, "5,45", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 95,45, 0,255,0,255, "95,45", "0,255,0,255", 2);
+}), 500);
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.end.ltr.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.end.ltr.html
new file mode 100644
index 000000000..681085859
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.end.ltr.html
@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.draw.align.end.ltr</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<style>
+@font-face {
+ font-family: CanvasTest;
+ src: url("/fonts/CanvasTest.ttf");
+}
+</style>
+<body class="show_output">
+
+<h1>2d.text.draw.align.end.ltr</h1>
+<p class="desc">textAlign end with ltr is the right edge</p>
+
+
+<span style="font-family: CanvasTest; position: absolute; visibility: hidden">A</span>
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50" dir="ltr"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("textAlign end with ltr is the right edge");
+_addTest(function(canvas, ctx) {
+
+ctx.font = '50px CanvasTest';
+deferTest();
+setTimeout(t.step_func_done(function () {
+ ctx.fillStyle = '#f00';
+ ctx.fillRect(0, 0, 100, 50);
+ ctx.fillStyle = '#0f0';
+ ctx.textAlign = 'end';
+ ctx.fillText('DD', 100, 37.5);
+ _assertPixelApprox(canvas, 5,5, 0,255,0,255, "5,5", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 95,5, 0,255,0,255, "95,5", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 25,25, 0,255,0,255, "25,25", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 75,25, 0,255,0,255, "75,25", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 5,45, 0,255,0,255, "5,45", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 95,45, 0,255,0,255, "95,45", "0,255,0,255", 2);
+}), 500);
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.end.rtl.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.end.rtl.html
new file mode 100644
index 000000000..1ccd2bccb
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.end.rtl.html
@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.draw.align.end.rtl</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<style>
+@font-face {
+ font-family: CanvasTest;
+ src: url("/fonts/CanvasTest.ttf");
+}
+</style>
+<body class="show_output">
+
+<h1>2d.text.draw.align.end.rtl</h1>
+<p class="desc">textAlign end with rtl is the left edge</p>
+
+
+<span style="font-family: CanvasTest; position: absolute; visibility: hidden">A</span>
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50" dir="rtl"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("textAlign end with rtl is the left edge");
+_addTest(function(canvas, ctx) {
+
+ctx.font = '50px CanvasTest';
+deferTest();
+setTimeout(t.step_func_done(function () {
+ ctx.fillStyle = '#f00';
+ ctx.fillRect(0, 0, 100, 50);
+ ctx.fillStyle = '#0f0';
+ ctx.textAlign = 'end';
+ ctx.fillText('DD', 0, 37.5);
+ _assertPixelApprox(canvas, 5,5, 0,255,0,255, "5,5", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 95,5, 0,255,0,255, "95,5", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 25,25, 0,255,0,255, "25,25", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 75,25, 0,255,0,255, "75,25", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 5,45, 0,255,0,255, "5,45", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 95,45, 0,255,0,255, "95,45", "0,255,0,255", 2);
+}), 500);
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.left.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.left.html
new file mode 100644
index 000000000..5e7418e36
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.left.html
@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.draw.align.left</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<style>
+@font-face {
+ font-family: CanvasTest;
+ src: url("/fonts/CanvasTest.ttf");
+}
+</style>
+<body class="show_output">
+
+<h1>2d.text.draw.align.left</h1>
+<p class="desc">textAlign left is the left of the first em square (not the bounding box)</p>
+
+
+<span style="font-family: CanvasTest; position: absolute; visibility: hidden">A</span>
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("textAlign left is the left of the first em square (not the bounding box)");
+_addTest(function(canvas, ctx) {
+
+ctx.font = '50px CanvasTest';
+deferTest();
+setTimeout(t.step_func_done(function () {
+ ctx.fillStyle = '#f00';
+ ctx.fillRect(0, 0, 100, 50);
+ ctx.fillStyle = '#0f0';
+ ctx.textAlign = 'left';
+ ctx.fillText('DD', 0, 37.5);
+ _assertPixelApprox(canvas, 5,5, 0,255,0,255, "5,5", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 95,5, 0,255,0,255, "95,5", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 25,25, 0,255,0,255, "25,25", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 75,25, 0,255,0,255, "75,25", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 5,45, 0,255,0,255, "5,45", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 95,45, 0,255,0,255, "95,45", "0,255,0,255", 2);
+}), 500);
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.right.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.right.html
new file mode 100644
index 000000000..81e3acf36
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.right.html
@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.draw.align.right</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<style>
+@font-face {
+ font-family: CanvasTest;
+ src: url("/fonts/CanvasTest.ttf");
+}
+</style>
+<body class="show_output">
+
+<h1>2d.text.draw.align.right</h1>
+<p class="desc">textAlign right is the right of the last em square (not the bounding box)</p>
+
+
+<span style="font-family: CanvasTest; position: absolute; visibility: hidden">A</span>
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("textAlign right is the right of the last em square (not the bounding box)");
+_addTest(function(canvas, ctx) {
+
+ctx.font = '50px CanvasTest';
+deferTest();
+setTimeout(t.step_func_done(function () {
+ ctx.fillStyle = '#f00';
+ ctx.fillRect(0, 0, 100, 50);
+ ctx.fillStyle = '#0f0';
+ ctx.textAlign = 'right';
+ ctx.fillText('DD', 100, 37.5);
+ _assertPixelApprox(canvas, 5,5, 0,255,0,255, "5,5", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 95,5, 0,255,0,255, "95,5", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 25,25, 0,255,0,255, "25,25", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 75,25, 0,255,0,255, "75,25", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 5,45, 0,255,0,255, "5,45", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 95,45, 0,255,0,255, "95,45", "0,255,0,255", 2);
+}), 500);
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.start.ltr.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.start.ltr.html
new file mode 100644
index 000000000..f47ef78a7
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.start.ltr.html
@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.draw.align.start.ltr</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<style>
+@font-face {
+ font-family: CanvasTest;
+ src: url("/fonts/CanvasTest.ttf");
+}
+</style>
+<body class="show_output">
+
+<h1>2d.text.draw.align.start.ltr</h1>
+<p class="desc">textAlign start with ltr is the left edge</p>
+
+
+<span style="font-family: CanvasTest; position: absolute; visibility: hidden">A</span>
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50" dir="ltr"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("textAlign start with ltr is the left edge");
+_addTest(function(canvas, ctx) {
+
+ctx.font = '50px CanvasTest';
+deferTest();
+setTimeout(t.step_func_done(function () {
+ ctx.fillStyle = '#f00';
+ ctx.fillRect(0, 0, 100, 50);
+ ctx.fillStyle = '#0f0';
+ ctx.textAlign = 'start';
+ ctx.fillText('DD', 0, 37.5);
+ _assertPixelApprox(canvas, 5,5, 0,255,0,255, "5,5", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 95,5, 0,255,0,255, "95,5", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 25,25, 0,255,0,255, "25,25", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 75,25, 0,255,0,255, "75,25", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 5,45, 0,255,0,255, "5,45", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 95,45, 0,255,0,255, "95,45", "0,255,0,255", 2);
+}), 500);
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.start.rtl.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.start.rtl.html
new file mode 100644
index 000000000..cc09b9e4d
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.align.start.rtl.html
@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.draw.align.start.rtl</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<style>
+@font-face {
+ font-family: CanvasTest;
+ src: url("/fonts/CanvasTest.ttf");
+}
+</style>
+<body class="show_output">
+
+<h1>2d.text.draw.align.start.rtl</h1>
+<p class="desc">textAlign start with rtl is the right edge</p>
+
+
+<span style="font-family: CanvasTest; position: absolute; visibility: hidden">A</span>
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50" dir="rtl"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("textAlign start with rtl is the right edge");
+_addTest(function(canvas, ctx) {
+
+ctx.font = '50px CanvasTest';
+deferTest();
+setTimeout(t.step_func_done(function () {
+ ctx.fillStyle = '#f00';
+ ctx.fillRect(0, 0, 100, 50);
+ ctx.fillStyle = '#0f0';
+ ctx.textAlign = 'start';
+ ctx.fillText('DD', 100, 37.5);
+ _assertPixelApprox(canvas, 5,5, 0,255,0,255, "5,5", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 95,5, 0,255,0,255, "95,5", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 25,25, 0,255,0,255, "25,25", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 75,25, 0,255,0,255, "75,25", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 5,45, 0,255,0,255, "5,45", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 95,45, 0,255,0,255, "95,45", "0,255,0,255", 2);
+}), 500);
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.baseline.alphabetic.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.baseline.alphabetic.html
new file mode 100644
index 000000000..bdb65ab90
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.baseline.alphabetic.html
@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.draw.baseline.alphabetic</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<style>
+@font-face {
+ font-family: CanvasTest;
+ src: url("/fonts/CanvasTest.ttf");
+}
+</style>
+<body class="show_output">
+
+<h1>2d.text.draw.baseline.alphabetic</h1>
+<p class="desc"></p>
+
+
+<span style="font-family: CanvasTest; position: absolute; visibility: hidden">A</span>
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("");
+_addTest(function(canvas, ctx) {
+
+ctx.font = '50px CanvasTest';
+deferTest();
+setTimeout(t.step_func_done(function () {
+ ctx.fillStyle = '#f00';
+ ctx.fillRect(0, 0, 100, 50);
+ ctx.fillStyle = '#0f0';
+ ctx.textBaseline = 'alphabetic';
+ ctx.fillText('CC', 0, 37.5);
+ _assertPixelApprox(canvas, 5,5, 0,255,0,255, "5,5", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 95,5, 0,255,0,255, "95,5", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 25,25, 0,255,0,255, "25,25", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 75,25, 0,255,0,255, "75,25", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 5,45, 0,255,0,255, "5,45", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 95,45, 0,255,0,255, "95,45", "0,255,0,255", 2);
+}), 500);
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.basic-manual.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.basic-manual.html
new file mode 100644
index 000000000..5a4be6d37
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.basic-manual.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.draw.fill.basic</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<body class="show_output">
+
+<h1>2d.text.draw.fill.basic</h1>
+<p class="desc">fillText draws filled text</p>
+
+
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="2d.text.draw.fill.basic.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("fillText draws filled text");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#000';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#0f0';
+ctx.strokeStyle = '#f00';
+ctx.font = '35px Arial, sans-serif';
+ctx.fillText('PASS', 5, 35);
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.basic.png b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.basic.png
new file mode 100644
index 000000000..deaef2c95
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.basic.png
Binary files differ
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.NaN.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.NaN.html
new file mode 100644
index 000000000..28647ac55
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.NaN.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.draw.fill.maxWidth.NaN</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<body class="show_output">
+
+<h1>2d.text.draw.fill.maxWidth.NaN</h1>
+<p class="desc">fillText handles maxWidth correctly</p>
+
+
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("fillText handles maxWidth correctly");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#f00';
+ctx.font = '35px Arial, sans-serif';
+ctx.fillText('fail fail fail fail fail', 5, 35, NaN);
+_assertGreen(ctx, 100, 50);
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.bound.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.bound.html
new file mode 100644
index 000000000..3282f273e
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.bound.html
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.draw.fill.maxWidth.bound</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<style>
+@font-face {
+ font-family: CanvasTest;
+ src: url("/fonts/CanvasTest.ttf");
+}
+</style>
+<body class="show_output">
+
+<h1>2d.text.draw.fill.maxWidth.bound</h1>
+<p class="desc">fillText handles maxWidth based on line size, not bounding box size</p>
+
+
+<span style="font-family: CanvasTest; position: absolute; visibility: hidden">A</span>
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("fillText handles maxWidth based on line size, not bounding box size");
+_addTest(function(canvas, ctx) {
+
+ctx.font = '50px CanvasTest';
+deferTest();
+setTimeout(t.step_func_done(function () {
+ ctx.fillStyle = '#f00';
+ ctx.fillRect(0, 0, 100, 50);
+ ctx.fillStyle = '#0f0';
+ ctx.fillText('DD', 0, 37.5, 100);
+ _assertPixelApprox(canvas, 5,5, 0,255,0,255, "5,5", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 95,5, 0,255,0,255, "95,5", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 25,25, 0,255,0,255, "25,25", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 75,25, 0,255,0,255, "75,25", "0,255,0,255", 2);
+}), 500);
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.fontface.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.fontface.html
new file mode 100644
index 000000000..d138047f6
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.fontface.html
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.draw.fill.maxWidth.fontface</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<style>
+@font-face {
+ font-family: CanvasTest;
+ src: url("/fonts/CanvasTest.ttf");
+}
+</style>
+<body class="show_output">
+
+<h1>2d.text.draw.fill.maxWidth.fontface</h1>
+<p class="desc">fillText works on @font-face fonts</p>
+
+
+<span style="font-family: CanvasTest; position: absolute; visibility: hidden">A</span>
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("fillText works on @font-face fonts");
+_addTest(function(canvas, ctx) {
+
+ctx.font = '50px CanvasTest';
+deferTest();
+setTimeout(t.step_func_done(function () {
+ ctx.fillStyle = '#0f0';
+ ctx.fillRect(0, 0, 100, 50);
+ ctx.fillStyle = '#f00';
+ ctx.fillText('EEEE', -50, 37.5, 40);
+ _assertPixelApprox(canvas, 5,5, 0,255,0,255, "5,5", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 95,5, 0,255,0,255, "95,5", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 25,25, 0,255,0,255, "25,25", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 75,25, 0,255,0,255, "75,25", "0,255,0,255", 2);
+}), 500);
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.large-manual.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.large-manual.html
new file mode 100644
index 000000000..5f599c84d
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.large-manual.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.draw.fill.maxWidth.large</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<body class="show_output">
+
+<h1>2d.text.draw.fill.maxWidth.large</h1>
+<p class="desc">fillText handles maxWidth correctly</p>
+
+
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="2d.text.draw.fill.maxWidth.large.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("fillText handles maxWidth correctly");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#000';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#0f0';
+ctx.font = '35px Arial, sans-serif';
+ctx.fillText('PASS', 5, 35, 200);
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.large.png b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.large.png
new file mode 100644
index 000000000..deaef2c95
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.large.png
Binary files differ
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.negative.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.negative.html
new file mode 100644
index 000000000..a6ec4f290
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.negative.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.draw.fill.maxWidth.negative</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<body class="show_output">
+
+<h1>2d.text.draw.fill.maxWidth.negative</h1>
+<p class="desc">fillText handles maxWidth correctly</p>
+
+
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("fillText handles maxWidth correctly");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#f00';
+ctx.font = '35px Arial, sans-serif';
+ctx.fillText('fail fail fail fail fail', 5, 35, -1);
+_assertGreen(ctx, 100, 50);
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.small.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.small.html
new file mode 100644
index 000000000..d0364d872
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.small.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.draw.fill.maxWidth.small</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<body class="show_output">
+
+<h1>2d.text.draw.fill.maxWidth.small</h1>
+<p class="desc">fillText handles maxWidth correctly</p>
+
+
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("fillText handles maxWidth correctly");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#f00';
+ctx.font = '35px Arial, sans-serif';
+ctx.fillText('fail fail fail fail fail', -100, 35, 90);
+_assertGreen(ctx, 100, 50);
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.zero.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.zero.html
new file mode 100644
index 000000000..176e43197
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.maxWidth.zero.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.draw.fill.maxWidth.zero</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<body class="show_output">
+
+<h1>2d.text.draw.fill.maxWidth.zero</h1>
+<p class="desc">fillText handles maxWidth correctly</p>
+
+
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("fillText handles maxWidth correctly");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#f00';
+ctx.font = '35px Arial, sans-serif';
+ctx.fillText('fail fail fail fail fail', 5, 35, 0);
+_assertGreen(ctx, 100, 50);
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.rtl-manual.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.rtl-manual.html
new file mode 100644
index 000000000..1066b837d
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.rtl-manual.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.draw.fill.rtl</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<body class="show_output">
+
+<h1>2d.text.draw.fill.rtl</h1>
+<p class="desc">fillText respects Right-To-Left Override characters</p>
+
+
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="2d.text.draw.fill.rtl.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("fillText respects Right-To-Left Override characters");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#000';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#0f0';
+ctx.strokeStyle = '#f00';
+ctx.font = '35px Arial, sans-serif';
+ctx.fillText('\u202eFAIL \xa0 \xa0 SSAP', 5, 35);
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.rtl.png b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.rtl.png
new file mode 100644
index 000000000..deaef2c95
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.rtl.png
Binary files differ
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.unaffected.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.unaffected.html
new file mode 100644
index 000000000..a7ddee418
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fill.unaffected.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.draw.fill.unaffected</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<body class="show_output">
+
+<h1>2d.text.draw.fill.unaffected</h1>
+<p class="desc">fillText does not start a new path or subpath</p>
+
+
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("fillText does not start a new path or subpath");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.moveTo(0, 0);
+ctx.lineTo(100, 0);
+
+ctx.font = '35px Arial, sans-serif';
+ctx.fillText('FAIL', 5, 35);
+
+ctx.lineTo(100, 50);
+ctx.lineTo(0, 50);
+ctx.fillStyle = '#0f0';
+ctx.fill();
+
+_assertPixel(canvas, 50,25, 0,255,0,255, "50,25", "0,255,0,255");
+_assertPixel(canvas, 5,45, 0,255,0,255, "5,45", "0,255,0,255");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fontface.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fontface.html
new file mode 100644
index 000000000..7bfbb7feb
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fontface.html
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.draw.fontface</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<style>
+@font-face {
+ font-family: CanvasTest;
+ src: url("/fonts/CanvasTest.ttf");
+}
+</style>
+<body class="show_output">
+
+<h1>2d.text.draw.fontface</h1>
+<p class="desc"></p>
+
+
+<span style="font-family: CanvasTest; position: absolute; visibility: hidden">A</span>
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("");
+_addTest(function(canvas, ctx) {
+
+ctx.font = '67px CanvasTest';
+deferTest();
+setTimeout(t.step_func_done(function () {
+ ctx.fillStyle = '#f00';
+ ctx.fillRect(0, 0, 100, 50);
+ ctx.fillStyle = '#0f0';
+ ctx.fillText('AA', 0, 50);
+ _assertPixelApprox(canvas, 5,5, 0,255,0,255, "5,5", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 95,5, 0,255,0,255, "95,5", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 25,25, 0,255,0,255, "25,25", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 75,25, 0,255,0,255, "75,25", "0,255,0,255", 2);
+}), 500);
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fontface.notinpage.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fontface.notinpage.html
new file mode 100644
index 000000000..6c4eb4919
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fontface.notinpage.html
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.draw.fontface.notinpage</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<style>
+@font-face {
+ font-family: CanvasTest;
+ src: url("/fonts/CanvasTest.ttf");
+}
+</style>
+<body class="show_output">
+
+<h1>2d.text.draw.fontface.notinpage</h1>
+<p class="desc">@font-face fonts should work even if they are not used in the page</p>
+
+
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("@font-face fonts should work even if they are not used in the page");
+_addTest(function(canvas, ctx) {
+
+ctx.font = '67px CanvasTest';
+deferTest();
+setTimeout(t.step_func_done(function () {
+ ctx.fillStyle = '#f00';
+ ctx.fillRect(0, 0, 100, 50);
+ ctx.fillStyle = '#0f0';
+ ctx.fillText('AA', 0, 50);
+ _assertPixelApprox(canvas, 5,5, 0,255,0,255, "5,5", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 95,5, 0,255,0,255, "95,5", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 25,25, 0,255,0,255, "25,25", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 75,25, 0,255,0,255, "75,25", "0,255,0,255", 2);
+}), 500);
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fontface.repeat.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fontface.repeat.html
new file mode 100644
index 000000000..30cfb4c7f
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.fontface.repeat.html
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.draw.fontface.repeat</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<style>
+@font-face {
+ font-family: CanvasTest;
+ src: url("/fonts/CanvasTest.ttf");
+}
+</style>
+<body class="show_output">
+
+<h1>2d.text.draw.fontface.repeat</h1>
+<p class="desc">Draw with the font immediately, then wait a bit until and draw again. (This crashes some version of WebKit.)</p>
+
+
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("Draw with the font immediately, then wait a bit until and draw again. (This crashes some version of WebKit.)");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.font = '67px CanvasTest';
+ctx.fillStyle = '#0f0';
+ctx.fillText('AA', 0, 50);
+deferTest();
+setTimeout(t.step_func_done(function () {
+ ctx.fillText('AA', 0, 50);
+ _assertPixelApprox(canvas, 5,5, 0,255,0,255, "5,5", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 95,5, 0,255,0,255, "95,5", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 25,25, 0,255,0,255, "25,25", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 75,25, 0,255,0,255, "75,25", "0,255,0,255", 2);
+}), 500);
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.kern.consistent-manual.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.kern.consistent-manual.html
new file mode 100644
index 000000000..12618f4f6
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.kern.consistent-manual.html
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.draw.kern.consistent</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<body class="show_output">
+
+<h1>2d.text.draw.kern.consistent</h1>
+<p class="desc">Stroked and filled text should have exactly the same kerning so it overlaps</p>
+
+
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("Stroked and filled text should have exactly the same kerning so it overlaps");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#f00';
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 3;
+ctx.font = '20px Arial, sans-serif';
+ctx.fillText('VAVAVAVAVAVAVA', -50, 25);
+ctx.fillText('ToToToToToToTo', -50, 45);
+ctx.strokeText('VAVAVAVAVAVAVA', -50, 25);
+ctx.strokeText('ToToToToToToTo', -50, 45);
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.space.basic.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.space.basic.html
new file mode 100644
index 000000000..046ce7c7a
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.space.basic.html
@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.draw.space.basic</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<style>
+@font-face {
+ font-family: CanvasTest;
+ src: url("/fonts/CanvasTest.ttf");
+}
+</style>
+<body class="show_output">
+
+<h1>2d.text.draw.space.basic</h1>
+<p class="desc">U+0020 is rendered the correct size (1em wide)</p>
+
+
+<span style="font-family: CanvasTest; position: absolute; visibility: hidden">A</span>
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("U+0020 is rendered the correct size (1em wide)");
+_addTest(function(canvas, ctx) {
+
+ctx.font = '50px CanvasTest';
+deferTest();
+setTimeout(t.step_func_done(function () {
+ ctx.fillStyle = '#f00';
+ ctx.fillRect(0, 0, 100, 50);
+ ctx.fillStyle = '#0f0';
+ ctx.fillText('E EE', -100, 37.5);
+ _assertPixelApprox(canvas, 25,25, 0,255,0,255, "25,25", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 75,25, 0,255,0,255, "75,25", "0,255,0,255", 2);
+}), 500);
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.space.collapse.nonspace.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.space.collapse.nonspace.html
new file mode 100644
index 000000000..9dd441ade
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.space.collapse.nonspace.html
@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.draw.space.collapse.nonspace</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<style>
+@font-face {
+ font-family: CanvasTest;
+ src: url("/fonts/CanvasTest.ttf");
+}
+</style>
+<body class="show_output">
+
+<h1>2d.text.draw.space.collapse.nonspace</h1>
+<p class="desc">Non-space characters are not converted to U+0020 and collapsed</p>
+
+
+<span style="font-family: CanvasTest; position: absolute; visibility: hidden">A</span>
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("Non-space characters are not converted to U+0020 and collapsed");
+_addTest(function(canvas, ctx) {
+
+ctx.font = '50px CanvasTest';
+deferTest();
+setTimeout(t.step_func_done(function () {
+ ctx.fillStyle = '#f00';
+ ctx.fillRect(0, 0, 100, 50);
+ ctx.fillStyle = '#0f0';
+ ctx.fillText('E\x0b EE', -150, 37.5);
+ _assertPixelApprox(canvas, 25,25, 0,255,0,255, "25,25", "0,255,0,255", 2);
+ _assertPixelApprox(canvas, 75,25, 0,255,0,255, "75,25", "0,255,0,255", 2);
+}), 500);
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.stroke.basic-manual.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.stroke.basic-manual.html
new file mode 100644
index 000000000..f9eac1f62
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.stroke.basic-manual.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.draw.stroke.basic</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<body class="show_output">
+
+<h1>2d.text.draw.stroke.basic</h1>
+<p class="desc">strokeText draws stroked text</p>
+
+
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="2d.text.draw.stroke.basic.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("strokeText draws stroked text");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#000';
+ctx.fillRect(0, 0, 100, 50);
+ctx.strokeStyle = '#0f0';
+ctx.fillStyle = '#f00';
+ctx.lineWidth = 1;
+ctx.font = '35px Arial, sans-serif';
+ctx.strokeText('PASS', 5, 35);
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.stroke.basic.png b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.stroke.basic.png
new file mode 100644
index 000000000..fe1b43b46
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.stroke.basic.png
Binary files differ
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.stroke.unaffected.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.stroke.unaffected.html
new file mode 100644
index 000000000..1da4d9277
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.draw.stroke.unaffected.html
@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.draw.stroke.unaffected</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<body class="show_output">
+
+<h1>2d.text.draw.stroke.unaffected</h1>
+<p class="desc">strokeText does not start a new path or subpath</p>
+
+
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("strokeText does not start a new path or subpath");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.moveTo(0, 0);
+ctx.lineTo(100, 0);
+
+ctx.font = '35px Arial, sans-serif';
+ctx.strokeStyle = '#f00';
+ctx.strokeText('FAIL', 5, 35);
+
+ctx.lineTo(100, 50);
+ctx.lineTo(0, 50);
+ctx.fillStyle = '#0f0';
+ctx.fill();
+
+_assertPixel(canvas, 50,25, 0,255,0,255, "50,25", "0,255,0,255");
+_assertPixel(canvas, 5,45, 0,255,0,255, "5,45", "0,255,0,255");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.measure.width.basic.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.measure.width.basic.html
new file mode 100644
index 000000000..40b43dece
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.measure.width.basic.html
@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.measure.width.basic</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<style>
+@font-face {
+ font-family: CanvasTest;
+ src: url("/fonts/CanvasTest.ttf");
+}
+</style>
+<body class="show_output">
+
+<h1>2d.text.measure.width.basic</h1>
+<p class="desc"></p>
+
+
+<span style="font-family: CanvasTest; position: absolute; visibility: hidden">A</span>
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+
+<ul id="d"></ul>
+<script>
+var t = async_test("");
+_addTest(function(canvas, ctx) {
+
+deferTest();
+setTimeout(t.step_func_done(function () {
+ ctx.font = '50px CanvasTest';
+ _assertSame(ctx.measureText('A').width, 50, "ctx.measureText('A').width", "50");
+ _assertSame(ctx.measureText('AA').width, 100, "ctx.measureText('AA').width", "100");
+ _assertSame(ctx.measureText('ABCD').width, 200, "ctx.measureText('ABCD').width", "200");
+
+ ctx.font = '100px CanvasTest';
+ _assertSame(ctx.measureText('A').width, 100, "ctx.measureText('A').width", "100");
+}), 500);
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.measure.width.empty.html b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.measure.width.empty.html
new file mode 100644
index 000000000..67a9b405a
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-text-to-the-canvas/2d.text.measure.width.empty.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.text.measure.width.empty</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<style>
+@font-face {
+ font-family: CanvasTest;
+ src: url("/fonts/CanvasTest.ttf");
+}
+</style>
+<body class="show_output">
+
+<h1>2d.text.measure.width.empty</h1>
+<p class="desc">The empty string has zero width</p>
+
+
+<span style="font-family: CanvasTest; position: absolute; visibility: hidden">A</span>
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+
+<ul id="d"></ul>
+<script>
+var t = async_test("The empty string has zero width");
+_addTest(function(canvas, ctx) {
+
+deferTest();
+setTimeout(t.step_func_done(function () {
+ ctx.font = '50px CanvasTest';
+ _assertSame(ctx.measureText("").width, 0, "ctx.measureText(\"\").width", "0");
+}), 500);
+
+
+});
+</script>
+