diff options
Diffstat (limited to 'testing/web-platform/tests/2dcontext/text-styles')
26 files changed, 961 insertions, 0 deletions
diff --git a/testing/web-platform/tests/2dcontext/text-styles/.gitkeep b/testing/web-platform/tests/2dcontext/text-styles/.gitkeep new file mode 100644 index 000000000..e69de29bb --- /dev/null +++ b/testing/web-platform/tests/2dcontext/text-styles/.gitkeep diff --git a/testing/web-platform/tests/2dcontext/text-styles/2d.text.align.default.html b/testing/web-platform/tests/2dcontext/text-styles/2d.text.align.default.html new file mode 100644 index 000000000..6c3b5016a --- /dev/null +++ b/testing/web-platform/tests/2dcontext/text-styles/2d.text.align.default.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. --> +<title>Canvas test: 2d.text.align.default</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.align.default</h1> +<p class="desc"></p> + + +<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) { + +_assertSame(ctx.textAlign, 'start', "ctx.textAlign", "'start'"); + + +}); +</script> + diff --git a/testing/web-platform/tests/2dcontext/text-styles/2d.text.align.invalid.html b/testing/web-platform/tests/2dcontext/text-styles/2d.text.align.invalid.html new file mode 100644 index 000000000..36d3aaaf4 --- /dev/null +++ b/testing/web-platform/tests/2dcontext/text-styles/2d.text.align.invalid.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. --> +<title>Canvas test: 2d.text.align.invalid</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.align.invalid</h1> +<p class="desc"></p> + + +<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) { + +ctx.textAlign = 'start'; +ctx.textAlign = 'bogus'; +_assertSame(ctx.textAlign, 'start', "ctx.textAlign", "'start'"); + +ctx.textAlign = 'start'; +ctx.textAlign = 'END'; +_assertSame(ctx.textAlign, 'start', "ctx.textAlign", "'start'"); + +ctx.textAlign = 'start'; +ctx.textAlign = 'end '; +_assertSame(ctx.textAlign, 'start', "ctx.textAlign", "'start'"); + +ctx.textAlign = 'start'; +ctx.textAlign = 'end\0'; +_assertSame(ctx.textAlign, 'start', "ctx.textAlign", "'start'"); + + +}); +</script> + diff --git a/testing/web-platform/tests/2dcontext/text-styles/2d.text.align.valid.html b/testing/web-platform/tests/2dcontext/text-styles/2d.text.align.valid.html new file mode 100644 index 000000000..667f1bb0b --- /dev/null +++ b/testing/web-platform/tests/2dcontext/text-styles/2d.text.align.valid.html @@ -0,0 +1,40 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. --> +<title>Canvas test: 2d.text.align.valid</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.align.valid</h1> +<p class="desc"></p> + + +<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) { + +ctx.textAlign = 'start'; +_assertSame(ctx.textAlign, 'start', "ctx.textAlign", "'start'"); + +ctx.textAlign = 'end'; +_assertSame(ctx.textAlign, 'end', "ctx.textAlign", "'end'"); + +ctx.textAlign = 'left'; +_assertSame(ctx.textAlign, 'left', "ctx.textAlign", "'left'"); + +ctx.textAlign = 'right'; +_assertSame(ctx.textAlign, 'right', "ctx.textAlign", "'right'"); + +ctx.textAlign = 'center'; +_assertSame(ctx.textAlign, 'center', "ctx.textAlign", "'center'"); + + +}); +</script> + diff --git a/testing/web-platform/tests/2dcontext/text-styles/2d.text.baseline.default.html b/testing/web-platform/tests/2dcontext/text-styles/2d.text.baseline.default.html new file mode 100644 index 000000000..b19bcc37e --- /dev/null +++ b/testing/web-platform/tests/2dcontext/text-styles/2d.text.baseline.default.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. --> +<title>Canvas test: 2d.text.baseline.default</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.baseline.default</h1> +<p class="desc"></p> + + +<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) { + +_assertSame(ctx.textBaseline, 'alphabetic', "ctx.textBaseline", "'alphabetic'"); + + +}); +</script> + diff --git a/testing/web-platform/tests/2dcontext/text-styles/2d.text.baseline.invalid.html b/testing/web-platform/tests/2dcontext/text-styles/2d.text.baseline.invalid.html new file mode 100644 index 000000000..4cba62a14 --- /dev/null +++ b/testing/web-platform/tests/2dcontext/text-styles/2d.text.baseline.invalid.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. --> +<title>Canvas test: 2d.text.baseline.invalid</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.baseline.invalid</h1> +<p class="desc"></p> + + +<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) { + +ctx.textBaseline = 'top'; +ctx.textBaseline = 'bogus'; +_assertSame(ctx.textBaseline, 'top', "ctx.textBaseline", "'top'"); + +ctx.textBaseline = 'top'; +ctx.textBaseline = 'MIDDLE'; +_assertSame(ctx.textBaseline, 'top', "ctx.textBaseline", "'top'"); + +ctx.textBaseline = 'top'; +ctx.textBaseline = 'middle '; +_assertSame(ctx.textBaseline, 'top', "ctx.textBaseline", "'top'"); + +ctx.textBaseline = 'top'; +ctx.textBaseline = 'middle\0'; +_assertSame(ctx.textBaseline, 'top', "ctx.textBaseline", "'top'"); + + +}); +</script> + diff --git a/testing/web-platform/tests/2dcontext/text-styles/2d.text.baseline.valid.html b/testing/web-platform/tests/2dcontext/text-styles/2d.text.baseline.valid.html new file mode 100644 index 000000000..e2a37b4ed --- /dev/null +++ b/testing/web-platform/tests/2dcontext/text-styles/2d.text.baseline.valid.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. --> +<title>Canvas test: 2d.text.baseline.valid</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.baseline.valid</h1> +<p class="desc"></p> + + +<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) { + +ctx.textBaseline = 'top'; +_assertSame(ctx.textBaseline, 'top', "ctx.textBaseline", "'top'"); + +ctx.textBaseline = 'hanging'; +_assertSame(ctx.textBaseline, 'hanging', "ctx.textBaseline", "'hanging'"); + +ctx.textBaseline = 'middle'; +_assertSame(ctx.textBaseline, 'middle', "ctx.textBaseline", "'middle'"); + +ctx.textBaseline = 'alphabetic'; +_assertSame(ctx.textBaseline, 'alphabetic', "ctx.textBaseline", "'alphabetic'"); + +ctx.textBaseline = 'ideographic'; +_assertSame(ctx.textBaseline, 'ideographic', "ctx.textBaseline", "'ideographic'"); + +ctx.textBaseline = 'bottom'; +_assertSame(ctx.textBaseline, 'bottom', "ctx.textBaseline", "'bottom'"); + + +}); +</script> + diff --git a/testing/web-platform/tests/2dcontext/text-styles/2d.text.draw.baseline.bottom.html b/testing/web-platform/tests/2dcontext/text-styles/2d.text.draw.baseline.bottom.html new file mode 100644 index 000000000..cde7e891d --- /dev/null +++ b/testing/web-platform/tests/2dcontext/text-styles/2d.text.draw.baseline.bottom.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.bottom</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.bottom</h1> +<p class="desc">textBaseline bottom is the bottom of the 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("textBaseline bottom is the bottom of the 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.textBaseline = 'bottom'; + ctx.fillText('CC', 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); + _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/text-styles/2d.text.draw.baseline.hanging.html b/testing/web-platform/tests/2dcontext/text-styles/2d.text.draw.baseline.hanging.html new file mode 100644 index 000000000..e5bdb98cc --- /dev/null +++ b/testing/web-platform/tests/2dcontext/text-styles/2d.text.draw.baseline.hanging.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.hanging</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.hanging</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 = 'hanging'; + ctx.fillText('CC', 0, 12.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/text-styles/2d.text.draw.baseline.ideographic.html b/testing/web-platform/tests/2dcontext/text-styles/2d.text.draw.baseline.ideographic.html new file mode 100644 index 000000000..cc99e1ab4 --- /dev/null +++ b/testing/web-platform/tests/2dcontext/text-styles/2d.text.draw.baseline.ideographic.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.ideographic</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.ideographic</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 = 'ideographic'; + ctx.fillText('CC', 0, 31.25); + _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/text-styles/2d.text.draw.baseline.middle.html b/testing/web-platform/tests/2dcontext/text-styles/2d.text.draw.baseline.middle.html new file mode 100644 index 000000000..6cdbb17e6 --- /dev/null +++ b/testing/web-platform/tests/2dcontext/text-styles/2d.text.draw.baseline.middle.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.middle</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.middle</h1> +<p class="desc">textBaseline middle is the middle of the 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("textBaseline middle is the middle of the 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.textBaseline = 'middle'; + ctx.fillText('CC', 0, 25); + _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/text-styles/2d.text.draw.baseline.top.html b/testing/web-platform/tests/2dcontext/text-styles/2d.text.draw.baseline.top.html new file mode 100644 index 000000000..15c0c1f38 --- /dev/null +++ b/testing/web-platform/tests/2dcontext/text-styles/2d.text.draw.baseline.top.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.top</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.top</h1> +<p class="desc">textBaseline top is the top of the 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("textBaseline top is the top of the 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.textBaseline = 'top'; + ctx.fillText('CC', 0, 0); + _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/text-styles/2d.text.draw.space.collapse.end.html b/testing/web-platform/tests/2dcontext/text-styles/2d.text.draw.space.collapse.end.html new file mode 100644 index 000000000..9ce607000 --- /dev/null +++ b/testing/web-platform/tests/2dcontext/text-styles/2d.text.draw.space.collapse.end.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.space.collapse.end</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.end</h1> +<p class="desc">Space characters at the end of a line are collapsed (per CSS)</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("Space characters at the end of a line are collapsed (per CSS)"); +_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('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/text-styles/2d.text.draw.space.collapse.other.html b/testing/web-platform/tests/2dcontext/text-styles/2d.text.draw.space.collapse.other.html new file mode 100644 index 000000000..25275b5b5 --- /dev/null +++ b/testing/web-platform/tests/2dcontext/text-styles/2d.text.draw.space.collapse.other.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.other</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.other</h1> +<p class="desc">Space characters are converted to U+0020, and collapsed (per CSS)</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("Space characters are converted to U+0020, and collapsed (per CSS)"); +_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 \x09\x0a\x0c\x0d \x09\x0a\x0c\x0dEE', -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/text-styles/2d.text.draw.space.collapse.space.html b/testing/web-platform/tests/2dcontext/text-styles/2d.text.draw.space.collapse.space.html new file mode 100644 index 000000000..3069e7946 --- /dev/null +++ b/testing/web-platform/tests/2dcontext/text-styles/2d.text.draw.space.collapse.space.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.space</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.space</h1> +<p class="desc">Space characters are converted to U+0020, and collapsed (per CSS)</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("Space characters are converted to U+0020, and collapsed (per CSS)"); +_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/text-styles/2d.text.draw.space.collapse.start.html b/testing/web-platform/tests/2dcontext/text-styles/2d.text.draw.space.collapse.start.html new file mode 100644 index 000000000..b3b05f436 --- /dev/null +++ b/testing/web-platform/tests/2dcontext/text-styles/2d.text.draw.space.collapse.start.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.start</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.start</h1> +<p class="desc">Space characters at the start of a line are collapsed (per CSS)</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("Space characters at the start of a line are collapsed (per CSS)"); +_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(' EE', 0, 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/text-styles/2d.text.font.default.html b/testing/web-platform/tests/2dcontext/text-styles/2d.text.font.default.html new file mode 100644 index 000000000..e7405e350 --- /dev/null +++ b/testing/web-platform/tests/2dcontext/text-styles/2d.text.font.default.html @@ -0,0 +1,27 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. --> +<title>Canvas test: 2d.text.font.default</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.font.default</h1> +<p class="desc"></p> + + +<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) { + +_assertSame(ctx.font, '10px sans-serif', "ctx.font", "'10px sans-serif'"); + + +}); +</script> + diff --git a/testing/web-platform/tests/2dcontext/text-styles/2d.text.font.parse.basic.html b/testing/web-platform/tests/2dcontext/text-styles/2d.text.font.parse.basic.html new file mode 100644 index 000000000..b4ae41cbc --- /dev/null +++ b/testing/web-platform/tests/2dcontext/text-styles/2d.text.font.parse.basic.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. --> +<title>Canvas test: 2d.text.font.parse.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.font.parse.basic</h1> +<p class="desc"></p> + + +<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) { + +ctx.font = '20px serif'; +_assertSame(ctx.font, '20px serif', "ctx.font", "'20px serif'"); + +ctx.font = '20PX SERIF'; +_assertSame(ctx.font, '20px serif', "ctx.font", "'20px serif'"); + + +}); +</script> + diff --git a/testing/web-platform/tests/2dcontext/text-styles/2d.text.font.parse.complex.html b/testing/web-platform/tests/2dcontext/text-styles/2d.text.font.parse.complex.html new file mode 100644 index 000000000..51917f361 --- /dev/null +++ b/testing/web-platform/tests/2dcontext/text-styles/2d.text.font.parse.complex.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. --> +<title>Canvas test: 2d.text.font.parse.complex</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.font.parse.complex</h1> +<p class="desc"></p> + + +<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) { + +ctx.font = 'small-caps italic 400 12px/2 Unknown Font, sans-serif'; +_assertSame(ctx.font, 'italic small-caps 12px "Unknown Font", sans-serif', "ctx.font", "'italic small-caps 12px \"Unknown Font\", sans-serif'"); + + +}); +</script> + diff --git a/testing/web-platform/tests/2dcontext/text-styles/2d.text.font.parse.invalid.html b/testing/web-platform/tests/2dcontext/text-styles/2d.text.font.parse.invalid.html new file mode 100644 index 000000000..f65d680b0 --- /dev/null +++ b/testing/web-platform/tests/2dcontext/text-styles/2d.text.font.parse.invalid.html @@ -0,0 +1,56 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. --> +<title>Canvas test: 2d.text.font.parse.invalid</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.font.parse.invalid</h1> +<p class="desc"></p> + + +<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) { + +ctx.font = '20px serif'; +_assertSame(ctx.font, '20px serif', "ctx.font", "'20px serif'"); + +ctx.font = '20px serif'; +ctx.font = 'bogus'; +_assertSame(ctx.font, '20px serif', "ctx.font", "'20px serif'"); + +ctx.font = '20px serif'; +ctx.font = 'inherit'; +_assertSame(ctx.font, '20px serif', "ctx.font", "'20px serif'"); + +ctx.font = '20px serif'; +ctx.font = '10px {bogus}'; +_assertSame(ctx.font, '20px serif', "ctx.font", "'20px serif'"); + +ctx.font = '20px serif'; +ctx.font = '10px initial'; +_assertSame(ctx.font, '20px serif', "ctx.font", "'20px serif'"); + +ctx.font = '20px serif'; +ctx.font = '10px default'; +_assertSame(ctx.font, '20px serif', "ctx.font", "'20px serif'"); + +ctx.font = '20px serif'; +ctx.font = '10px inherit'; +_assertSame(ctx.font, '20px serif', "ctx.font", "'20px serif'"); + +ctx.font = '20px serif'; +ctx.font = '1em serif; background: green; margin: 10px'; +_assertSame(ctx.font, '20px serif', "ctx.font", "'20px serif'"); + + +}); +</script> + diff --git a/testing/web-platform/tests/2dcontext/text-styles/2d.text.font.parse.size.percentage.default.html b/testing/web-platform/tests/2dcontext/text-styles/2d.text.font.parse.size.percentage.default.html new file mode 100644 index 000000000..21eebde0f --- /dev/null +++ b/testing/web-platform/tests/2dcontext/text-styles/2d.text.font.parse.size.percentage.default.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. --> +<title>Canvas test: 2d.text.font.parse.size.percentage.default</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.font.parse.size.percentage.default</h1> +<p class="desc"></p> + + +<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) { + +var canvas2 = document.createElement('canvas'); +var ctx2 = canvas2.getContext('2d'); +ctx2.font = '1000% serif'; +_assertSame(ctx2.font, '100px serif', "ctx2.font", "'100px serif'"); + + +}); +</script> + diff --git a/testing/web-platform/tests/2dcontext/text-styles/2d.text.font.parse.size.percentage.html b/testing/web-platform/tests/2dcontext/text-styles/2d.text.font.parse.size.percentage.html new file mode 100644 index 000000000..6a05e48cf --- /dev/null +++ b/testing/web-platform/tests/2dcontext/text-styles/2d.text.font.parse.size.percentage.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. --> +<title>Canvas test: 2d.text.font.parse.size.percentage</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.font.parse.size.percentage</h1> +<p class="desc"></p> + + +<p class="output">Actual output:</p> +<canvas id="c" class="output" style="font-size: 144px" 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) { + +ctx.font = '50% serif'; +_assertSame(ctx.font, '72px serif', "ctx.font", "'72px serif'"); +canvas.setAttribute('style', 'font-size: 100px'); +_assertSame(ctx.font, '72px serif', "ctx.font", "'72px serif'"); + + +}); +</script> + diff --git a/testing/web-platform/tests/2dcontext/text-styles/2d.text.font.parse.system.html b/testing/web-platform/tests/2dcontext/text-styles/2d.text.font.parse.system.html new file mode 100644 index 000000000..bc86f5c15 --- /dev/null +++ b/testing/web-platform/tests/2dcontext/text-styles/2d.text.font.parse.system.html @@ -0,0 +1,28 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. --> +<title>Canvas test: 2d.text.font.parse.system</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.font.parse.system</h1> +<p class="desc">System fonts must be computed to explicit values</p> + + +<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("System fonts must be computed to explicit values"); +_addTest(function(canvas, ctx) { + +ctx.font = 'message-box'; +_assertDifferent(ctx.font, 'message-box', "ctx.font", "'message-box'"); + + +}); +</script> + diff --git a/testing/web-platform/tests/2dcontext/text-styles/2d.text.measure.width.space.html b/testing/web-platform/tests/2dcontext/text-styles/2d.text.measure.width.space.html new file mode 100644 index 000000000..dfa1dee1c --- /dev/null +++ b/testing/web-platform/tests/2dcontext/text-styles/2d.text.measure.width.space.html @@ -0,0 +1,44 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. --> +<title>Canvas test: 2d.text.measure.width.space</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.space</h1> +<p class="desc">Space characters are converted to U+0020 and collapsed (per CSS)</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("Space characters are converted to U+0020 and collapsed (per CSS)"); +_addTest(function(canvas, ctx) { + +deferTest(); +setTimeout(t.step_func_done(function () { + ctx.font = '50px CanvasTest'; + _assertSame(ctx.measureText('A B').width, 150, "ctx.measureText('A B').width", "150"); + _assertSame(ctx.measureText('A B').width, 150, "ctx.measureText('A B').width", "150"); + _assertSame(ctx.measureText('A \x09\x0a\x0c\x0d \x09\x0a\x0c\x0dB').width, 150, "ctx.measureText('A \\x09\\x0a\\x0c\\x0d \\x09\\x0a\\x0c\\x0dB').width", "150"); + _assert(ctx.measureText('A \x0b B').width >= 200, "ctx.measureText('A \\x0b B').width >= 200"); + + _assertSame(ctx.measureText(' AB').width, 100, "ctx.measureText(' AB').width", "100"); + _assertSame(ctx.measureText('AB ').width, 100, "ctx.measureText('AB ').width", "100"); +}), 500); + + +}); +</script> + diff --git a/testing/web-platform/tests/2dcontext/text-styles/canvas_text_font_001-ref.htm b/testing/web-platform/tests/2dcontext/text-styles/canvas_text_font_001-ref.htm new file mode 100644 index 000000000..1a19757e0 --- /dev/null +++ b/testing/web-platform/tests/2dcontext/text-styles/canvas_text_font_001-ref.htm @@ -0,0 +1,22 @@ +<!doctype HTML> +<html> + <head> + <title>HTML5 Canvas Test: Ignore property-independent style sheet syntax "inherit" in Text (reference)</title> + <script type="text/javascript"> + function runTest() + { + var canvas = document.getElementById("canvas1"); + var ctx = canvas.getContext("2d"); + + ctx.font = "40px Ahem"; + ctx.fillText("Filler", 5, 50); + ctx.fillText("Filler", 5, 100); + } + </script> + </head> + <body onload="runTest()"> + <p>Description: Ignore "inherit" property-independent style sheet syntax without assigning a new font value.</p> + <p>Test passes if there are two identical black boxes below.</p> + <canvas id="canvas1" width="300" height="150">Browser does not support HTML5 Canvas.</canvas> + </body> +</html> diff --git a/testing/web-platform/tests/2dcontext/text-styles/canvas_text_font_001.htm b/testing/web-platform/tests/2dcontext/text-styles/canvas_text_font_001.htm new file mode 100644 index 000000000..923ce71c0 --- /dev/null +++ b/testing/web-platform/tests/2dcontext/text-styles/canvas_text_font_001.htm @@ -0,0 +1,33 @@ +<!doctype HTML> +<html> + <head> + <title>HTML5 Canvas Test: Ignore property-independent style sheet syntax "inherit" in Text</title> + <link rel="match" href="canvas_text_font_001-ref.htm" /> + <link rel="author" title="Microsoft" href="http://www.microsoft.com" /> + <link rel="help" href="http://www.w3.org/TR/2dcontext/#dom-context-2d-font" /> + <meta name="assert" content=": Ignore 'inherit' property-independent style sheet syntax without assigning a new font value." /> + <script type="text/javascript"> + function runTest() + { + var canvas = document.getElementById("canvas1"); + var ctx = canvas.getContext("2d"); + + // Assign a valid font. + ctx.font = "40px Ahem"; + + // Assign property-independent style sheet syntax 'inherit' as font (this must be ignored). + ctx.font = "20px inherit"; + ctx.fillText("Filler", 5, 50); + + // Assign a valid font which was used earlier. + ctx.font = "40px Ahem"; + ctx.fillText("Filler", 5, 100); + } + </script> + </head> + <body onload="runTest()"> + <p>Description: Ignore "inherit" property-independent style sheet syntax without assigning a new font value.</p> + <p>Test passes if there are two identical black boxes below.</p> + <canvas id="canvas1" width="300" height="150">Browser does not support HTML5 Canvas.</canvas> + </body> +</html> |