From 5f8de423f190bbb79a62f804151bc24824fa32d8 Mon Sep 17 00:00:00 2001
From: "Matt A. Tobin" <mattatobin@localhost.localdomain>
Date: Fri, 2 Feb 2018 04:16:08 -0500
Subject: Add m-esr52 at 52.6.0

---
 .../tests/2dcontext/line-styles/.gitkeep           |   0
 .../2dcontext/line-styles/2d.line.cap.butt.html    |  61 ++++++++++++
 .../2dcontext/line-styles/2d.line.cap.closed.html  |  46 +++++++++
 .../2dcontext/line-styles/2d.line.cap.invalid.html |  52 +++++++++++
 .../2dcontext/line-styles/2d.line.cap.open.html    |  46 +++++++++
 .../2dcontext/line-styles/2d.line.cap.round.html   |  77 +++++++++++++++
 .../2dcontext/line-styles/2d.line.cap.square.html  |  61 ++++++++++++
 .../2dcontext/line-styles/2d.line.cap.valid.html   |  34 +++++++
 .../tests/2dcontext/line-styles/2d.line.cross.html |  43 +++++++++
 .../2dcontext/line-styles/2d.line.defaults.html    |  30 ++++++
 .../2dcontext/line-styles/2d.line.join.bevel.html  |  80 ++++++++++++++++
 .../2dcontext/line-styles/2d.line.join.closed.html |  45 +++++++++
 .../line-styles/2d.line.join.invalid.html          |  52 +++++++++++
 .../2dcontext/line-styles/2d.line.join.miter.html  |  71 ++++++++++++++
 .../2dcontext/line-styles/2d.line.join.open.html   |  45 +++++++++
 .../line-styles/2d.line.join.parallel.html         |  42 +++++++++
 .../2dcontext/line-styles/2d.line.join.round.html  |  78 ++++++++++++++++
 .../2dcontext/line-styles/2d.line.join.valid.html  |  34 +++++++
 .../2dcontext/line-styles/2d.line.miter.acute.html |  52 +++++++++++
 .../line-styles/2d.line.miter.exceeded.html        |  44 +++++++++
 .../line-styles/2d.line.miter.invalid.html         |  48 ++++++++++
 .../line-styles/2d.line.miter.lineedge.html        |  41 ++++++++
 .../line-styles/2d.line.miter.obtuse.html          |  52 +++++++++++
 .../line-styles/2d.line.miter.rightangle.html      |  44 +++++++++
 .../2dcontext/line-styles/2d.line.miter.valid.html |  37 ++++++++
 .../line-styles/2d.line.miter.within.html          |  44 +++++++++
 .../tests/2dcontext/line-styles/2d.line.union.html |  46 +++++++++
 .../2dcontext/line-styles/2d.line.width.basic.html |  63 +++++++++++++
 .../line-styles/2d.line.width.invalid.html         |  48 ++++++++++
 .../line-styles/2d.line.width.scaledefault.html    |  40 ++++++++
 .../line-styles/2d.line.width.transformed.html     |  69 ++++++++++++++
 .../2dcontext/line-styles/2d.line.width.valid.html |  37 ++++++++
 .../canvas_linestyles_linecap_001-ref.htm          |  11 +++
 .../line-styles/canvas_linestyles_linecap_001.htm  |  37 ++++++++
 .../tests/2dcontext/line-styles/lineto_a.html      |  26 ++++++
 .../tests/2dcontext/line-styles/lineto_ref.html    |  15 +++
 .../tests/2dcontext/line-styles/setLineDash.html   | 104 +++++++++++++++++++++
 37 files changed, 1755 insertions(+)
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/.gitkeep
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.butt.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.closed.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.invalid.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.open.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.round.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.square.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.valid.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.cross.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.defaults.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.join.bevel.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.join.closed.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.join.invalid.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.join.miter.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.join.open.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.join.parallel.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.join.round.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.join.valid.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.acute.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.exceeded.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.invalid.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.lineedge.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.obtuse.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.rightangle.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.valid.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.within.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.union.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.width.basic.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.width.invalid.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.width.scaledefault.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.width.transformed.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/2d.line.width.valid.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/canvas_linestyles_linecap_001-ref.htm
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/canvas_linestyles_linecap_001.htm
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/lineto_a.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/lineto_ref.html
 create mode 100644 testing/web-platform/tests/2dcontext/line-styles/setLineDash.html

(limited to 'testing/web-platform/tests/2dcontext/line-styles')

diff --git a/testing/web-platform/tests/2dcontext/line-styles/.gitkeep b/testing/web-platform/tests/2dcontext/line-styles/.gitkeep
new file mode 100644
index 000000000..e69de29bb
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.butt.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.butt.html
new file mode 100644
index 000000000..353676233
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.butt.html
@@ -0,0 +1,61 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.cap.butt</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.line.cap.butt</h1>
+<p class="desc">lineCap 'butt' is rendered 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("lineCap 'butt' is rendered correctly");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.lineCap = 'butt';
+ctx.lineWidth = 20;
+
+ctx.fillStyle = '#f00';
+ctx.strokeStyle = '#0f0';
+ctx.fillRect(15, 15, 20, 20);
+ctx.beginPath();
+ctx.moveTo(25, 15);
+ctx.lineTo(25, 35);
+ctx.stroke();
+
+ctx.fillStyle = '#0f0';
+ctx.strokeStyle = '#f00';
+ctx.beginPath();
+ctx.moveTo(75, 15);
+ctx.lineTo(75, 35);
+ctx.stroke();
+ctx.fillRect(65, 15, 20, 20);
+
+_assertPixel(canvas, 25,14, 0,255,0,255, "25,14", "0,255,0,255");
+_assertPixel(canvas, 25,15, 0,255,0,255, "25,15", "0,255,0,255");
+_assertPixel(canvas, 25,16, 0,255,0,255, "25,16", "0,255,0,255");
+_assertPixel(canvas, 25,34, 0,255,0,255, "25,34", "0,255,0,255");
+_assertPixel(canvas, 25,35, 0,255,0,255, "25,35", "0,255,0,255");
+_assertPixel(canvas, 25,36, 0,255,0,255, "25,36", "0,255,0,255");
+
+_assertPixel(canvas, 75,14, 0,255,0,255, "75,14", "0,255,0,255");
+_assertPixel(canvas, 75,15, 0,255,0,255, "75,15", "0,255,0,255");
+_assertPixel(canvas, 75,16, 0,255,0,255, "75,16", "0,255,0,255");
+_assertPixel(canvas, 75,34, 0,255,0,255, "75,34", "0,255,0,255");
+_assertPixel(canvas, 75,35, 0,255,0,255, "75,35", "0,255,0,255");
+_assertPixel(canvas, 75,36, 0,255,0,255, "75,36", "0,255,0,255");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.closed.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.closed.html
new file mode 100644
index 000000000..f8e233a41
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.closed.html
@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.cap.closed</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.line.cap.closed</h1>
+<p class="desc">Line caps are not drawn at the corners of an unclosed rectangle</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("Line caps are not drawn at the corners of an unclosed rectangle");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#0f0';
+ctx.strokeStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.lineJoin = 'bevel';
+ctx.lineCap = 'square';
+ctx.lineWidth = 400;
+
+ctx.beginPath();
+ctx.moveTo(200, 200);
+ctx.lineTo(200, 1000);
+ctx.lineTo(1000, 1000);
+ctx.lineTo(1000, 200);
+ctx.closePath();
+ctx.stroke();
+
+_assertPixel(canvas, 1,1, 0,255,0,255, "1,1", "0,255,0,255");
+_assertPixel(canvas, 48,1, 0,255,0,255, "48,1", "0,255,0,255");
+_assertPixel(canvas, 48,48, 0,255,0,255, "48,48", "0,255,0,255");
+_assertPixel(canvas, 1,48, 0,255,0,255, "1,48", "0,255,0,255");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.invalid.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.invalid.html
new file mode 100644
index 000000000..1db32a9d6
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.invalid.html
@@ -0,0 +1,52 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.cap.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.line.cap.invalid</h1>
+<p class="desc">Setting lineCap to invalid values is ignored</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("Setting lineCap to invalid values is ignored");
+_addTest(function(canvas, ctx) {
+
+ctx.lineCap = 'butt'
+_assertSame(ctx.lineCap, 'butt', "ctx.lineCap", "'butt'");
+
+ctx.lineCap = 'butt';
+ctx.lineCap = 'invalid';
+_assertSame(ctx.lineCap, 'butt', "ctx.lineCap", "'butt'");
+
+ctx.lineCap = 'butt';
+ctx.lineCap = 'ROUND';
+_assertSame(ctx.lineCap, 'butt', "ctx.lineCap", "'butt'");
+
+ctx.lineCap = 'butt';
+ctx.lineCap = 'round\0';
+_assertSame(ctx.lineCap, 'butt', "ctx.lineCap", "'butt'");
+
+ctx.lineCap = 'butt';
+ctx.lineCap = 'round ';
+_assertSame(ctx.lineCap, 'butt', "ctx.lineCap", "'butt'");
+
+ctx.lineCap = 'butt';
+ctx.lineCap = "";
+_assertSame(ctx.lineCap, 'butt', "ctx.lineCap", "'butt'");
+
+ctx.lineCap = 'butt';
+ctx.lineCap = 'bevel';
+_assertSame(ctx.lineCap, 'butt', "ctx.lineCap", "'butt'");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.open.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.open.html
new file mode 100644
index 000000000..499773085
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.open.html
@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.cap.open</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.line.cap.open</h1>
+<p class="desc">Line caps are drawn at the corners of an unclosed rectangle</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("Line caps are drawn at the corners of an unclosed rectangle");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#f00';
+ctx.strokeStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.lineJoin = 'bevel';
+ctx.lineCap = 'square';
+ctx.lineWidth = 400;
+
+ctx.beginPath();
+ctx.moveTo(200, 200);
+ctx.lineTo(200, 1000);
+ctx.lineTo(1000, 1000);
+ctx.lineTo(1000, 200);
+ctx.lineTo(200, 200);
+ctx.stroke();
+
+_assertPixel(canvas, 1,1, 0,255,0,255, "1,1", "0,255,0,255");
+_assertPixel(canvas, 48,1, 0,255,0,255, "48,1", "0,255,0,255");
+_assertPixel(canvas, 48,48, 0,255,0,255, "48,48", "0,255,0,255");
+_assertPixel(canvas, 1,48, 0,255,0,255, "1,48", "0,255,0,255");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.round.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.round.html
new file mode 100644
index 000000000..675d11ce2
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.round.html
@@ -0,0 +1,77 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.cap.round</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.line.cap.round</h1>
+<p class="desc">lineCap 'round' is rendered 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("lineCap 'round' is rendered correctly");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+var tol = 1; // tolerance to avoid antialiasing artifacts
+
+ctx.lineCap = 'round';
+ctx.lineWidth = 20;
+
+
+ctx.fillStyle = '#f00';
+ctx.strokeStyle = '#0f0';
+
+ctx.beginPath();
+ctx.moveTo(35-tol, 15);
+ctx.arc(25, 15, 10-tol, 0, Math.PI, true);
+ctx.arc(25, 35, 10-tol, Math.PI, 0, true);
+ctx.fill();
+
+ctx.beginPath();
+ctx.moveTo(25, 15);
+ctx.lineTo(25, 35);
+ctx.stroke();
+
+
+ctx.fillStyle = '#0f0';
+ctx.strokeStyle = '#f00';
+
+ctx.beginPath();
+ctx.moveTo(75, 15);
+ctx.lineTo(75, 35);
+ctx.stroke();
+
+ctx.beginPath();
+ctx.moveTo(85+tol, 15);
+ctx.arc(75, 15, 10+tol, 0, Math.PI, true);
+ctx.arc(75, 35, 10+tol, Math.PI, 0, true);
+ctx.fill();
+
+_assertPixel(canvas, 17,6, 0,255,0,255, "17,6", "0,255,0,255");
+_assertPixel(canvas, 25,6, 0,255,0,255, "25,6", "0,255,0,255");
+_assertPixel(canvas, 32,6, 0,255,0,255, "32,6", "0,255,0,255");
+_assertPixel(canvas, 17,43, 0,255,0,255, "17,43", "0,255,0,255");
+_assertPixel(canvas, 25,43, 0,255,0,255, "25,43", "0,255,0,255");
+_assertPixel(canvas, 32,43, 0,255,0,255, "32,43", "0,255,0,255");
+
+_assertPixel(canvas, 67,6, 0,255,0,255, "67,6", "0,255,0,255");
+_assertPixel(canvas, 75,6, 0,255,0,255, "75,6", "0,255,0,255");
+_assertPixel(canvas, 82,6, 0,255,0,255, "82,6", "0,255,0,255");
+_assertPixel(canvas, 67,43, 0,255,0,255, "67,43", "0,255,0,255");
+_assertPixel(canvas, 75,43, 0,255,0,255, "75,43", "0,255,0,255");
+_assertPixel(canvas, 82,43, 0,255,0,255, "82,43", "0,255,0,255");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.square.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.square.html
new file mode 100644
index 000000000..ea1e4d949
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.square.html
@@ -0,0 +1,61 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.cap.square</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.line.cap.square</h1>
+<p class="desc">lineCap 'square' is rendered 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("lineCap 'square' is rendered correctly");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.lineCap = 'square';
+ctx.lineWidth = 20;
+
+ctx.fillStyle = '#f00';
+ctx.strokeStyle = '#0f0';
+ctx.fillRect(15, 5, 20, 40);
+ctx.beginPath();
+ctx.moveTo(25, 15);
+ctx.lineTo(25, 35);
+ctx.stroke();
+
+ctx.fillStyle = '#0f0';
+ctx.strokeStyle = '#f00';
+ctx.beginPath();
+ctx.moveTo(75, 15);
+ctx.lineTo(75, 35);
+ctx.stroke();
+ctx.fillRect(65, 5, 20, 40);
+
+_assertPixel(canvas, 25,4, 0,255,0,255, "25,4", "0,255,0,255");
+_assertPixel(canvas, 25,5, 0,255,0,255, "25,5", "0,255,0,255");
+_assertPixel(canvas, 25,6, 0,255,0,255, "25,6", "0,255,0,255");
+_assertPixel(canvas, 25,44, 0,255,0,255, "25,44", "0,255,0,255");
+_assertPixel(canvas, 25,45, 0,255,0,255, "25,45", "0,255,0,255");
+_assertPixel(canvas, 25,46, 0,255,0,255, "25,46", "0,255,0,255");
+
+_assertPixel(canvas, 75,4, 0,255,0,255, "75,4", "0,255,0,255");
+_assertPixel(canvas, 75,5, 0,255,0,255, "75,5", "0,255,0,255");
+_assertPixel(canvas, 75,6, 0,255,0,255, "75,6", "0,255,0,255");
+_assertPixel(canvas, 75,44, 0,255,0,255, "75,44", "0,255,0,255");
+_assertPixel(canvas, 75,45, 0,255,0,255, "75,45", "0,255,0,255");
+_assertPixel(canvas, 75,46, 0,255,0,255, "75,46", "0,255,0,255");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.valid.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.valid.html
new file mode 100644
index 000000000..6ac119d4a
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.cap.valid.html
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.cap.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.line.cap.valid</h1>
+<p class="desc">Setting lineCap to valid values works</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("Setting lineCap to valid values works");
+_addTest(function(canvas, ctx) {
+
+ctx.lineCap = 'butt'
+_assertSame(ctx.lineCap, 'butt', "ctx.lineCap", "'butt'");
+
+ctx.lineCap = 'round';
+_assertSame(ctx.lineCap, 'round', "ctx.lineCap", "'round'");
+
+ctx.lineCap = 'square';
+_assertSame(ctx.lineCap, 'square', "ctx.lineCap", "'square'");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.cross.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.cross.html
new file mode 100644
index 000000000..61b2125c4
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.cross.html
@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.cross</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.line.cross</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>
+<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.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.lineWidth = 200;
+ctx.lineJoin = 'bevel';
+
+ctx.strokeStyle = '#f00';
+ctx.beginPath();
+ctx.moveTo(110, 50);
+ctx.lineTo(110, 60);
+ctx.lineTo(100, 60);
+ctx.stroke();
+
+_assertPixel(canvas, 1,1, 0,255,0,255, "1,1", "0,255,0,255");
+_assertPixel(canvas, 48,1, 0,255,0,255, "48,1", "0,255,0,255");
+_assertPixel(canvas, 48,48, 0,255,0,255, "48,48", "0,255,0,255");
+_assertPixel(canvas, 1,48, 0,255,0,255, "1,48", "0,255,0,255");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.defaults.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.defaults.html
new file mode 100644
index 000000000..8b680785d
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.defaults.html
@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.defaults</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.line.defaults</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.lineWidth, 1, "ctx.lineWidth", "1");
+_assertSame(ctx.lineCap, 'butt', "ctx.lineCap", "'butt'");
+_assertSame(ctx.lineJoin, 'miter', "ctx.lineJoin", "'miter'");
+_assertSame(ctx.miterLimit, 10, "ctx.miterLimit", "10");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.join.bevel.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.join.bevel.html
new file mode 100644
index 000000000..72c0186e1
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.join.bevel.html
@@ -0,0 +1,80 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.join.bevel</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.line.join.bevel</h1>
+<p class="desc">lineJoin 'bevel' is rendered 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("lineJoin 'bevel' is rendered correctly");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+var tol = 1; // tolerance to avoid antialiasing artifacts
+
+ctx.lineJoin = 'bevel';
+ctx.lineWidth = 20;
+
+ctx.fillStyle = '#f00';
+ctx.strokeStyle = '#0f0';
+
+ctx.fillRect(10, 10, 20, 20);
+ctx.fillRect(20, 20, 20, 20);
+ctx.beginPath();
+ctx.moveTo(30, 20);
+ctx.lineTo(40-tol, 20);
+ctx.lineTo(30, 10+tol);
+ctx.fill();
+
+ctx.beginPath();
+ctx.moveTo(10, 20);
+ctx.lineTo(30, 20);
+ctx.lineTo(30, 40);
+ctx.stroke();
+
+
+ctx.fillStyle = '#0f0';
+ctx.strokeStyle = '#f00';
+
+ctx.beginPath();
+ctx.moveTo(60, 20);
+ctx.lineTo(80, 20);
+ctx.lineTo(80, 40);
+ctx.stroke();
+
+ctx.fillRect(60, 10, 20, 20);
+ctx.fillRect(70, 20, 20, 20);
+ctx.beginPath();
+ctx.moveTo(80, 20);
+ctx.lineTo(90+tol, 20);
+ctx.lineTo(80, 10-tol);
+ctx.fill();
+
+_assertPixel(canvas, 34,16, 0,255,0,255, "34,16", "0,255,0,255");
+_assertPixel(canvas, 34,15, 0,255,0,255, "34,15", "0,255,0,255");
+_assertPixel(canvas, 35,15, 0,255,0,255, "35,15", "0,255,0,255");
+_assertPixel(canvas, 36,15, 0,255,0,255, "36,15", "0,255,0,255");
+_assertPixel(canvas, 36,14, 0,255,0,255, "36,14", "0,255,0,255");
+
+_assertPixel(canvas, 84,16, 0,255,0,255, "84,16", "0,255,0,255");
+_assertPixel(canvas, 84,15, 0,255,0,255, "84,15", "0,255,0,255");
+_assertPixel(canvas, 85,15, 0,255,0,255, "85,15", "0,255,0,255");
+_assertPixel(canvas, 86,15, 0,255,0,255, "86,15", "0,255,0,255");
+_assertPixel(canvas, 86,14, 0,255,0,255, "86,14", "0,255,0,255");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.join.closed.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.join.closed.html
new file mode 100644
index 000000000..1f2bf5cb7
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.join.closed.html
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.join.closed</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.line.join.closed</h1>
+<p class="desc">Line joins are drawn at the corner of a closed rectangle</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("Line joins are drawn at the corner of a closed rectangle");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#f00';
+ctx.strokeStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.lineJoin = 'miter';
+ctx.lineWidth = 200;
+
+ctx.beginPath();
+ctx.moveTo(100, 50);
+ctx.lineTo(100, 1000);
+ctx.lineTo(1000, 1000);
+ctx.lineTo(1000, 50);
+ctx.closePath();
+ctx.stroke();
+
+_assertPixel(canvas, 1,1, 0,255,0,255, "1,1", "0,255,0,255");
+_assertPixel(canvas, 48,1, 0,255,0,255, "48,1", "0,255,0,255");
+_assertPixel(canvas, 48,48, 0,255,0,255, "48,48", "0,255,0,255");
+_assertPixel(canvas, 1,48, 0,255,0,255, "1,48", "0,255,0,255");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.join.invalid.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.join.invalid.html
new file mode 100644
index 000000000..9d54d90b1
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.join.invalid.html
@@ -0,0 +1,52 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.join.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.line.join.invalid</h1>
+<p class="desc">Setting lineJoin to invalid values is ignored</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("Setting lineJoin to invalid values is ignored");
+_addTest(function(canvas, ctx) {
+
+ctx.lineJoin = 'bevel'
+_assertSame(ctx.lineJoin, 'bevel', "ctx.lineJoin", "'bevel'");
+
+ctx.lineJoin = 'bevel';
+ctx.lineJoin = 'invalid';
+_assertSame(ctx.lineJoin, 'bevel', "ctx.lineJoin", "'bevel'");
+
+ctx.lineJoin = 'bevel';
+ctx.lineJoin = 'ROUND';
+_assertSame(ctx.lineJoin, 'bevel', "ctx.lineJoin", "'bevel'");
+
+ctx.lineJoin = 'bevel';
+ctx.lineJoin = 'round\0';
+_assertSame(ctx.lineJoin, 'bevel', "ctx.lineJoin", "'bevel'");
+
+ctx.lineJoin = 'bevel';
+ctx.lineJoin = 'round ';
+_assertSame(ctx.lineJoin, 'bevel', "ctx.lineJoin", "'bevel'");
+
+ctx.lineJoin = 'bevel';
+ctx.lineJoin = "";
+_assertSame(ctx.lineJoin, 'bevel', "ctx.lineJoin", "'bevel'");
+
+ctx.lineJoin = 'bevel';
+ctx.lineJoin = 'butt';
+_assertSame(ctx.lineJoin, 'bevel', "ctx.lineJoin", "'bevel'");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.join.miter.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.join.miter.html
new file mode 100644
index 000000000..8a6d4a60e
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.join.miter.html
@@ -0,0 +1,71 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.join.miter</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.line.join.miter</h1>
+<p class="desc">lineJoin 'miter' is rendered 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("lineJoin 'miter' is rendered correctly");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.lineJoin = 'miter';
+ctx.lineWidth = 20;
+
+ctx.fillStyle = '#f00';
+ctx.strokeStyle = '#0f0';
+
+ctx.fillStyle = '#f00';
+ctx.strokeStyle = '#0f0';
+
+ctx.fillRect(10, 10, 30, 20);
+ctx.fillRect(20, 10, 20, 30);
+
+ctx.beginPath();
+ctx.moveTo(10, 20);
+ctx.lineTo(30, 20);
+ctx.lineTo(30, 40);
+ctx.stroke();
+
+
+ctx.fillStyle = '#0f0';
+ctx.strokeStyle = '#f00';
+
+ctx.beginPath();
+ctx.moveTo(60, 20);
+ctx.lineTo(80, 20);
+ctx.lineTo(80, 40);
+ctx.stroke();
+
+ctx.fillRect(60, 10, 30, 20);
+ctx.fillRect(70, 10, 20, 30);
+
+_assertPixel(canvas, 38,12, 0,255,0,255, "38,12", "0,255,0,255");
+_assertPixel(canvas, 39,11, 0,255,0,255, "39,11", "0,255,0,255");
+_assertPixel(canvas, 40,10, 0,255,0,255, "40,10", "0,255,0,255");
+_assertPixel(canvas, 41,9, 0,255,0,255, "41,9", "0,255,0,255");
+_assertPixel(canvas, 42,8, 0,255,0,255, "42,8", "0,255,0,255");
+
+_assertPixel(canvas, 88,12, 0,255,0,255, "88,12", "0,255,0,255");
+_assertPixel(canvas, 89,11, 0,255,0,255, "89,11", "0,255,0,255");
+_assertPixel(canvas, 90,10, 0,255,0,255, "90,10", "0,255,0,255");
+_assertPixel(canvas, 91,9, 0,255,0,255, "91,9", "0,255,0,255");
+_assertPixel(canvas, 92,8, 0,255,0,255, "92,8", "0,255,0,255");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.join.open.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.join.open.html
new file mode 100644
index 000000000..a72291bc3
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.join.open.html
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.join.open</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.line.join.open</h1>
+<p class="desc">Line joins are not drawn at the corner of an unclosed rectangle</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("Line joins are not drawn at the corner of an unclosed rectangle");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#0f0';
+ctx.strokeStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.lineJoin = 'miter';
+ctx.lineWidth = 200;
+
+ctx.beginPath();
+ctx.moveTo(100, 50);
+ctx.lineTo(100, 1000);
+ctx.lineTo(1000, 1000);
+ctx.lineTo(1000, 50);
+ctx.lineTo(100, 50);
+ctx.stroke();
+
+_assertPixel(canvas, 1,1, 0,255,0,255, "1,1", "0,255,0,255");
+_assertPixel(canvas, 48,1, 0,255,0,255, "48,1", "0,255,0,255");
+_assertPixel(canvas, 48,48, 0,255,0,255, "48,48", "0,255,0,255");
+_assertPixel(canvas, 1,48, 0,255,0,255, "1,48", "0,255,0,255");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.join.parallel.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.join.parallel.html
new file mode 100644
index 000000000..2a8956d7e
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.join.parallel.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.join.parallel</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.line.join.parallel</h1>
+<p class="desc">Line joins are drawn at 180-degree joins</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("Line joins are drawn at 180-degree joins");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 300;
+ctx.lineJoin = 'round';
+ctx.beginPath();
+ctx.moveTo(-100, 25);
+ctx.lineTo(0, 25);
+ctx.lineTo(-100, 25);
+ctx.stroke();
+
+_assertPixel(canvas, 1,1, 0,255,0,255, "1,1", "0,255,0,255");
+_assertPixel(canvas, 48,1, 0,255,0,255, "48,1", "0,255,0,255");
+_assertPixel(canvas, 48,48, 0,255,0,255, "48,48", "0,255,0,255");
+_assertPixel(canvas, 1,48, 0,255,0,255, "1,48", "0,255,0,255");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.join.round.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.join.round.html
new file mode 100644
index 000000000..4a827adce
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.join.round.html
@@ -0,0 +1,78 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.join.round</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.line.join.round</h1>
+<p class="desc">lineJoin 'round' is rendered 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("lineJoin 'round' is rendered correctly");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+var tol = 1; // tolerance to avoid antialiasing artifacts
+
+ctx.lineJoin = 'round';
+ctx.lineWidth = 20;
+
+ctx.fillStyle = '#f00';
+ctx.strokeStyle = '#0f0';
+
+ctx.fillRect(10, 10, 20, 20);
+ctx.fillRect(20, 20, 20, 20);
+ctx.beginPath();
+ctx.moveTo(30, 20);
+ctx.arc(30, 20, 10-tol, 0, 2*Math.PI, true);
+ctx.fill();
+
+ctx.beginPath();
+ctx.moveTo(10, 20);
+ctx.lineTo(30, 20);
+ctx.lineTo(30, 40);
+ctx.stroke();
+
+
+ctx.fillStyle = '#0f0';
+ctx.strokeStyle = '#f00';
+
+ctx.beginPath();
+ctx.moveTo(60, 20);
+ctx.lineTo(80, 20);
+ctx.lineTo(80, 40);
+ctx.stroke();
+
+ctx.fillRect(60, 10, 20, 20);
+ctx.fillRect(70, 20, 20, 20);
+ctx.beginPath();
+ctx.moveTo(80, 20);
+ctx.arc(80, 20, 10+tol, 0, 2*Math.PI, true);
+ctx.fill();
+
+_assertPixel(canvas, 36,14, 0,255,0,255, "36,14", "0,255,0,255");
+_assertPixel(canvas, 36,13, 0,255,0,255, "36,13", "0,255,0,255");
+_assertPixel(canvas, 37,13, 0,255,0,255, "37,13", "0,255,0,255");
+_assertPixel(canvas, 38,13, 0,255,0,255, "38,13", "0,255,0,255");
+_assertPixel(canvas, 38,12, 0,255,0,255, "38,12", "0,255,0,255");
+
+_assertPixel(canvas, 86,14, 0,255,0,255, "86,14", "0,255,0,255");
+_assertPixel(canvas, 86,13, 0,255,0,255, "86,13", "0,255,0,255");
+_assertPixel(canvas, 87,13, 0,255,0,255, "87,13", "0,255,0,255");
+_assertPixel(canvas, 88,13, 0,255,0,255, "88,13", "0,255,0,255");
+_assertPixel(canvas, 88,12, 0,255,0,255, "88,12", "0,255,0,255");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.join.valid.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.join.valid.html
new file mode 100644
index 000000000..98fec4cb7
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.join.valid.html
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.join.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.line.join.valid</h1>
+<p class="desc">Setting lineJoin to valid values works</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("Setting lineJoin to valid values works");
+_addTest(function(canvas, ctx) {
+
+ctx.lineJoin = 'bevel'
+_assertSame(ctx.lineJoin, 'bevel', "ctx.lineJoin", "'bevel'");
+
+ctx.lineJoin = 'round';
+_assertSame(ctx.lineJoin, 'round', "ctx.lineJoin", "'round'");
+
+ctx.lineJoin = 'miter';
+_assertSame(ctx.lineJoin, 'miter', "ctx.lineJoin", "'miter'");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.acute.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.acute.html
new file mode 100644
index 000000000..f11a32164
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.acute.html
@@ -0,0 +1,52 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.miter.acute</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.line.miter.acute</h1>
+<p class="desc">Miter joins are drawn correctly with acute angles</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("Miter joins are drawn correctly with acute angles");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.lineWidth = 200;
+ctx.lineJoin = 'miter';
+
+ctx.strokeStyle = '#0f0';
+ctx.miterLimit = 2.614;
+ctx.beginPath();
+ctx.moveTo(100, 1000);
+ctx.lineTo(100, 100);
+ctx.lineTo(1000, 1000);
+ctx.stroke();
+
+ctx.strokeStyle = '#f00';
+ctx.miterLimit = 2.613;
+ctx.beginPath();
+ctx.moveTo(100, 1000);
+ctx.lineTo(100, 100);
+ctx.lineTo(1000, 1000);
+ctx.stroke();
+
+_assertPixel(canvas, 1,1, 0,255,0,255, "1,1", "0,255,0,255");
+_assertPixel(canvas, 48,1, 0,255,0,255, "48,1", "0,255,0,255");
+_assertPixel(canvas, 48,48, 0,255,0,255, "48,48", "0,255,0,255");
+_assertPixel(canvas, 1,48, 0,255,0,255, "1,48", "0,255,0,255");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.exceeded.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.exceeded.html
new file mode 100644
index 000000000..1cbcd3cad
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.exceeded.html
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.miter.exceeded</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.line.miter.exceeded</h1>
+<p class="desc">Miter joins are not drawn when the miter limit is exceeded</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("Miter joins are not drawn when the miter limit is exceeded");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.lineWidth = 400;
+ctx.lineJoin = 'miter';
+
+ctx.strokeStyle = '#f00';
+ctx.miterLimit = 1.414;
+ctx.beginPath();
+ctx.moveTo(200, 1000);
+ctx.lineTo(200, 200);
+ctx.lineTo(1000, 201); // slightly non-right-angle to avoid being a special case
+ctx.stroke();
+
+_assertPixel(canvas, 1,1, 0,255,0,255, "1,1", "0,255,0,255");
+_assertPixel(canvas, 48,1, 0,255,0,255, "48,1", "0,255,0,255");
+_assertPixel(canvas, 48,48, 0,255,0,255, "48,48", "0,255,0,255");
+_assertPixel(canvas, 1,48, 0,255,0,255, "1,48", "0,255,0,255");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.invalid.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.invalid.html
new file mode 100644
index 000000000..4f7fd69bc
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.invalid.html
@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.miter.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.line.miter.invalid</h1>
+<p class="desc">Setting miterLimit to invalid values is ignored</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("Setting miterLimit to invalid values is ignored");
+_addTest(function(canvas, ctx) {
+
+ctx.miterLimit = 1.5;
+_assertSame(ctx.miterLimit, 1.5, "ctx.miterLimit", "1.5");
+
+ctx.miterLimit = 1.5;
+ctx.miterLimit = 0;
+_assertSame(ctx.miterLimit, 1.5, "ctx.miterLimit", "1.5");
+
+ctx.miterLimit = 1.5;
+ctx.miterLimit = -1;
+_assertSame(ctx.miterLimit, 1.5, "ctx.miterLimit", "1.5");
+
+ctx.miterLimit = 1.5;
+ctx.miterLimit = Infinity;
+_assertSame(ctx.miterLimit, 1.5, "ctx.miterLimit", "1.5");
+
+ctx.miterLimit = 1.5;
+ctx.miterLimit = -Infinity;
+_assertSame(ctx.miterLimit, 1.5, "ctx.miterLimit", "1.5");
+
+ctx.miterLimit = 1.5;
+ctx.miterLimit = NaN;
+_assertSame(ctx.miterLimit, 1.5, "ctx.miterLimit", "1.5");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.lineedge.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.lineedge.html
new file mode 100644
index 000000000..54c2ce539
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.lineedge.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.miter.lineedge</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.line.miter.lineedge</h1>
+<p class="desc">Miter joins are not drawn when the miter limit is exceeded at the corners of a zero-height rectangle</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("Miter joins are not drawn when the miter limit is exceeded at the corners of a zero-height rectangle");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.lineWidth = 200;
+ctx.lineJoin = 'miter';
+
+ctx.strokeStyle = '#f00';
+ctx.miterLimit = 1.414;
+ctx.beginPath();
+ctx.strokeRect(100, 25, 200, 0);
+
+_assertPixel(canvas, 1,1, 0,255,0,255, "1,1", "0,255,0,255");
+_assertPixel(canvas, 48,1, 0,255,0,255, "48,1", "0,255,0,255");
+_assertPixel(canvas, 48,48, 0,255,0,255, "48,48", "0,255,0,255");
+_assertPixel(canvas, 1,48, 0,255,0,255, "1,48", "0,255,0,255");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.obtuse.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.obtuse.html
new file mode 100644
index 000000000..40ebdd1f8
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.obtuse.html
@@ -0,0 +1,52 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.miter.obtuse</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.line.miter.obtuse</h1>
+<p class="desc">Miter joins are drawn correctly with obtuse angles</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("Miter joins are drawn correctly with obtuse angles");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.lineWidth = 1600;
+ctx.lineJoin = 'miter';
+
+ctx.strokeStyle = '#0f0';
+ctx.miterLimit = 1.083;
+ctx.beginPath();
+ctx.moveTo(800, 10000);
+ctx.lineTo(800, 300);
+ctx.lineTo(10000, -8900);
+ctx.stroke();
+
+ctx.strokeStyle = '#f00';
+ctx.miterLimit = 1.082;
+ctx.beginPath();
+ctx.moveTo(800, 10000);
+ctx.lineTo(800, 300);
+ctx.lineTo(10000, -8900);
+ctx.stroke();
+
+_assertPixel(canvas, 1,1, 0,255,0,255, "1,1", "0,255,0,255");
+_assertPixel(canvas, 48,1, 0,255,0,255, "48,1", "0,255,0,255");
+_assertPixel(canvas, 48,48, 0,255,0,255, "48,48", "0,255,0,255");
+_assertPixel(canvas, 1,48, 0,255,0,255, "1,48", "0,255,0,255");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.rightangle.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.rightangle.html
new file mode 100644
index 000000000..ebcfb261a
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.rightangle.html
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.miter.rightangle</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.line.miter.rightangle</h1>
+<p class="desc">Miter joins are not drawn when the miter limit is exceeded, on exact right angles</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("Miter joins are not drawn when the miter limit is exceeded, on exact right angles");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.lineWidth = 400;
+ctx.lineJoin = 'miter';
+
+ctx.strokeStyle = '#f00';
+ctx.miterLimit = 1.414;
+ctx.beginPath();
+ctx.moveTo(200, 1000);
+ctx.lineTo(200, 200);
+ctx.lineTo(1000, 200);
+ctx.stroke();
+
+_assertPixel(canvas, 1,1, 0,255,0,255, "1,1", "0,255,0,255");
+_assertPixel(canvas, 48,1, 0,255,0,255, "48,1", "0,255,0,255");
+_assertPixel(canvas, 48,48, 0,255,0,255, "48,48", "0,255,0,255");
+_assertPixel(canvas, 1,48, 0,255,0,255, "1,48", "0,255,0,255");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.valid.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.valid.html
new file mode 100644
index 000000000..59148aa56
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.valid.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.miter.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.line.miter.valid</h1>
+<p class="desc">Setting miterLimit to valid values works</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("Setting miterLimit to valid values works");
+_addTest(function(canvas, ctx) {
+
+ctx.miterLimit = 1.5;
+_assertSame(ctx.miterLimit, 1.5, "ctx.miterLimit", "1.5");
+
+ctx.miterLimit = "1e1";
+_assertSame(ctx.miterLimit, 10, "ctx.miterLimit", "10");
+
+ctx.miterLimit = 1/1024;
+_assertSame(ctx.miterLimit, 1/1024, "ctx.miterLimit", "1/1024");
+
+ctx.miterLimit = 1000;
+_assertSame(ctx.miterLimit, 1000, "ctx.miterLimit", "1000");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.within.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.within.html
new file mode 100644
index 000000000..5ed57e0cc
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.miter.within.html
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.miter.within</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.line.miter.within</h1>
+<p class="desc">Miter joins are drawn when the miter limit is not quite exceeded</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("Miter joins are drawn when the miter limit is not quite exceeded");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.lineWidth = 400;
+ctx.lineJoin = 'miter';
+
+ctx.strokeStyle = '#0f0';
+ctx.miterLimit = 1.416;
+ctx.beginPath();
+ctx.moveTo(200, 1000);
+ctx.lineTo(200, 200);
+ctx.lineTo(1000, 201);
+ctx.stroke();
+
+_assertPixel(canvas, 1,1, 0,255,0,255, "1,1", "0,255,0,255");
+_assertPixel(canvas, 48,1, 0,255,0,255, "48,1", "0,255,0,255");
+_assertPixel(canvas, 48,48, 0,255,0,255, "48,48", "0,255,0,255");
+_assertPixel(canvas, 1,48, 0,255,0,255, "1,48", "0,255,0,255");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.union.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.union.html
new file mode 100644
index 000000000..92fa2f1a2
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.union.html
@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.union</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.line.union</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>
+<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.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.lineWidth = 100;
+ctx.lineCap = 'round';
+
+ctx.strokeStyle = '#0f0';
+ctx.beginPath();
+ctx.moveTo(0, 24);
+ctx.lineTo(100, 25);
+ctx.lineTo(0, 26);
+ctx.closePath();
+ctx.stroke();
+
+_assertPixel(canvas, 1,1, 0,255,0,255, "1,1", "0,255,0,255");
+_assertPixel(canvas, 25,1, 0,255,0,255, "25,1", "0,255,0,255");
+_assertPixel(canvas, 48,1, 0,255,0,255, "48,1", "0,255,0,255");
+_assertPixel(canvas, 1,48, 0,255,0,255, "1,48", "0,255,0,255");
+_assertPixel(canvas, 25,1, 0,255,0,255, "25,1", "0,255,0,255");
+_assertPixel(canvas, 48,48, 0,255,0,255, "48,48", "0,255,0,255");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.width.basic.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.width.basic.html
new file mode 100644
index 000000000..b61baaf24
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.width.basic.html
@@ -0,0 +1,63 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.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">
+<body class="show_output">
+
+<h1>2d.line.width.basic</h1>
+<p class="desc">lineWidth determines the width of line strokes</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("lineWidth determines the width of line strokes");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.lineWidth = 20;
+// Draw a green line over a red box, to check the line is not too small
+ctx.fillStyle = '#f00';
+ctx.strokeStyle = '#0f0';
+ctx.fillRect(15, 15, 20, 20);
+ctx.beginPath();
+ctx.moveTo(25, 15);
+ctx.lineTo(25, 35);
+ctx.stroke();
+
+// Draw a green box over a red line, to check the line is not too large
+ctx.fillStyle = '#0f0';
+ctx.strokeStyle = '#f00';
+ctx.beginPath();
+ctx.moveTo(75, 15);
+ctx.lineTo(75, 35);
+ctx.stroke();
+ctx.fillRect(65, 15, 20, 20);
+
+_assertPixel(canvas, 14,25, 0,255,0,255, "14,25", "0,255,0,255");
+_assertPixel(canvas, 15,25, 0,255,0,255, "15,25", "0,255,0,255");
+_assertPixel(canvas, 16,25, 0,255,0,255, "16,25", "0,255,0,255");
+_assertPixel(canvas, 25,25, 0,255,0,255, "25,25", "0,255,0,255");
+_assertPixel(canvas, 34,25, 0,255,0,255, "34,25", "0,255,0,255");
+_assertPixel(canvas, 35,25, 0,255,0,255, "35,25", "0,255,0,255");
+_assertPixel(canvas, 36,25, 0,255,0,255, "36,25", "0,255,0,255");
+
+_assertPixel(canvas, 64,25, 0,255,0,255, "64,25", "0,255,0,255");
+_assertPixel(canvas, 65,25, 0,255,0,255, "65,25", "0,255,0,255");
+_assertPixel(canvas, 66,25, 0,255,0,255, "66,25", "0,255,0,255");
+_assertPixel(canvas, 75,25, 0,255,0,255, "75,25", "0,255,0,255");
+_assertPixel(canvas, 84,25, 0,255,0,255, "84,25", "0,255,0,255");
+_assertPixel(canvas, 85,25, 0,255,0,255, "85,25", "0,255,0,255");
+_assertPixel(canvas, 86,25, 0,255,0,255, "86,25", "0,255,0,255");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.width.invalid.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.width.invalid.html
new file mode 100644
index 000000000..d5cd3ab0a
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.width.invalid.html
@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.width.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.line.width.invalid</h1>
+<p class="desc">Setting lineWidth to invalid values is ignored</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("Setting lineWidth to invalid values is ignored");
+_addTest(function(canvas, ctx) {
+
+ctx.lineWidth = 1.5;
+_assertSame(ctx.lineWidth, 1.5, "ctx.lineWidth", "1.5");
+
+ctx.lineWidth = 1.5;
+ctx.lineWidth = 0;
+_assertSame(ctx.lineWidth, 1.5, "ctx.lineWidth", "1.5");
+
+ctx.lineWidth = 1.5;
+ctx.lineWidth = -1;
+_assertSame(ctx.lineWidth, 1.5, "ctx.lineWidth", "1.5");
+
+ctx.lineWidth = 1.5;
+ctx.lineWidth = Infinity;
+_assertSame(ctx.lineWidth, 1.5, "ctx.lineWidth", "1.5");
+
+ctx.lineWidth = 1.5;
+ctx.lineWidth = -Infinity;
+_assertSame(ctx.lineWidth, 1.5, "ctx.lineWidth", "1.5");
+
+ctx.lineWidth = 1.5;
+ctx.lineWidth = NaN;
+_assertSame(ctx.lineWidth, 1.5, "ctx.lineWidth", "1.5");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.width.scaledefault.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.width.scaledefault.html
new file mode 100644
index 000000000..154d7b582
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.width.scaledefault.html
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.width.scaledefault</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.line.width.scaledefault</h1>
+<p class="desc">Default lineWidth strokes are affected by scale transformations</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("Default lineWidth strokes are affected by scale transformations");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.scale(50, 50);
+ctx.strokeStyle = '#0f0';
+ctx.moveTo(0, 0.5);
+ctx.lineTo(2, 0.5);
+ctx.stroke();
+
+_assertPixel(canvas, 25,25, 0,255,0,255, "25,25", "0,255,0,255");
+_assertPixel(canvas, 50,25, 0,255,0,255, "50,25", "0,255,0,255");
+_assertPixel(canvas, 75,25, 0,255,0,255, "75,25", "0,255,0,255");
+_assertPixel(canvas, 50,5, 0,255,0,255, "50,5", "0,255,0,255");
+_assertPixel(canvas, 50,45, 0,255,0,255, "50,45", "0,255,0,255");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.width.transformed.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.width.transformed.html
new file mode 100644
index 000000000..903321f44
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.width.transformed.html
@@ -0,0 +1,69 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.width.transformed</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.line.width.transformed</h1>
+<p class="desc">Line stroke widths are affected by scale transformations</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("Line stroke widths are affected by scale transformations");
+_addTest(function(canvas, ctx) {
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.lineWidth = 4;
+// Draw a green line over a red box, to check the line is not too small
+ctx.fillStyle = '#f00';
+ctx.strokeStyle = '#0f0';
+ctx.fillRect(15, 15, 20, 20);
+ctx.save();
+ ctx.scale(5, 1);
+ ctx.beginPath();
+ ctx.moveTo(5, 15);
+ ctx.lineTo(5, 35);
+ ctx.stroke();
+ctx.restore();
+
+// Draw a green box over a red line, to check the line is not too large
+ctx.fillStyle = '#0f0';
+ctx.strokeStyle = '#f00';
+ctx.save();
+ ctx.scale(-5, 1);
+ ctx.beginPath();
+ ctx.moveTo(-15, 15);
+ ctx.lineTo(-15, 35);
+ ctx.stroke();
+ctx.restore();
+ctx.fillRect(65, 15, 20, 20);
+
+_assertPixel(canvas, 14,25, 0,255,0,255, "14,25", "0,255,0,255");
+_assertPixel(canvas, 15,25, 0,255,0,255, "15,25", "0,255,0,255");
+_assertPixel(canvas, 16,25, 0,255,0,255, "16,25", "0,255,0,255");
+_assertPixel(canvas, 25,25, 0,255,0,255, "25,25", "0,255,0,255");
+_assertPixel(canvas, 34,25, 0,255,0,255, "34,25", "0,255,0,255");
+_assertPixel(canvas, 35,25, 0,255,0,255, "35,25", "0,255,0,255");
+_assertPixel(canvas, 36,25, 0,255,0,255, "36,25", "0,255,0,255");
+
+_assertPixel(canvas, 64,25, 0,255,0,255, "64,25", "0,255,0,255");
+_assertPixel(canvas, 65,25, 0,255,0,255, "65,25", "0,255,0,255");
+_assertPixel(canvas, 66,25, 0,255,0,255, "66,25", "0,255,0,255");
+_assertPixel(canvas, 75,25, 0,255,0,255, "75,25", "0,255,0,255");
+_assertPixel(canvas, 84,25, 0,255,0,255, "84,25", "0,255,0,255");
+_assertPixel(canvas, 85,25, 0,255,0,255, "85,25", "0,255,0,255");
+_assertPixel(canvas, 86,25, 0,255,0,255, "86,25", "0,255,0,255");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/2d.line.width.valid.html b/testing/web-platform/tests/2dcontext/line-styles/2d.line.width.valid.html
new file mode 100644
index 000000000..c89fa56a6
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/2d.line.width.valid.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by tools/gentest.py. -->
+<title>Canvas test: 2d.line.width.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.line.width.valid</h1>
+<p class="desc">Setting lineWidth to valid values works</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("Setting lineWidth to valid values works");
+_addTest(function(canvas, ctx) {
+
+ctx.lineWidth = 1.5;
+_assertSame(ctx.lineWidth, 1.5, "ctx.lineWidth", "1.5");
+
+ctx.lineWidth = "1e1";
+_assertSame(ctx.lineWidth, 10, "ctx.lineWidth", "10");
+
+ctx.lineWidth = 1/1024;
+_assertSame(ctx.lineWidth, 1/1024, "ctx.lineWidth", "1/1024");
+
+ctx.lineWidth = 1000;
+_assertSame(ctx.lineWidth, 1000, "ctx.lineWidth", "1000");
+
+
+});
+</script>
+
diff --git a/testing/web-platform/tests/2dcontext/line-styles/canvas_linestyles_linecap_001-ref.htm b/testing/web-platform/tests/2dcontext/line-styles/canvas_linestyles_linecap_001-ref.htm
new file mode 100644
index 000000000..f85af9aab
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/canvas_linestyles_linecap_001-ref.htm
@@ -0,0 +1,11 @@
+<!doctype HTML>
+<html>
+    <head>
+        <title>HTML5 Canvas Test: "square" lineCap</title>
+        <link rel="author" title="Microsoft" href="http://www.microsoft.com" />
+    </head>
+    <body>
+        <p>Description: The square value of lineCap means that a rectangle with the length of the line width and the width of half the line width, placed flat against the edge perpendicular to the direction of the line, must be added at the end of each line.</p>
+        <div><img src='/images/black-rectangle.png' alt='black rect' /></div>
+    </body>
+</html>
diff --git a/testing/web-platform/tests/2dcontext/line-styles/canvas_linestyles_linecap_001.htm b/testing/web-platform/tests/2dcontext/line-styles/canvas_linestyles_linecap_001.htm
new file mode 100644
index 000000000..583dbc9d1
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/canvas_linestyles_linecap_001.htm
@@ -0,0 +1,37 @@
+<!doctype HTML>
+<html>
+    <head>
+        <title>HTML5 Canvas Test: "square" lineCap</title>
+        <link rel="match" href="canvas_linestyles_linecap_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-linecap" />
+        <meta name="assert" content="The square value of lineCap means that a rectangle with the length of the line width and the width of half the line width, placed flat against the edge perpendicular to the direction of the line, must be added at the end of each line." />
+        <script type="text/javascript">
+            function runTest()
+            {
+                var canvas = document.getElementById("canvas1");
+                var ctx = canvas.getContext("2d");
+
+                // Draw the first red rectangle.
+                ctx.fillStyle ="rgba(255, 0, 0, 1.0)";
+                ctx.fillRect(75, 0, 25, 50);
+
+                // Draw second red rectangle.
+                ctx.fillRect(0, 0, 25, 50);
+
+                // Draw a line with square lineCap.
+                ctx.strokeStyle = "rgba(0, 0, 0, 1.0)";
+                ctx.lineWidth = 50;
+                ctx.lineCap = "square";
+                ctx.beginPath();
+                ctx.moveTo(25, 25);
+                ctx.lineTo(75, 25);
+                ctx.stroke();
+            }
+        </script>
+    </head>
+    <body onload="runTest()">
+        <p>Description: The square value of lineCap means that a rectangle with the length of the line width and the width of half the line width, placed flat against the edge perpendicular to the direction of the line, must be added at the end of each line.</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/line-styles/lineto_a.html b/testing/web-platform/tests/2dcontext/line-styles/lineto_a.html
new file mode 100644
index 000000000..7e692f937
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/lineto_a.html
@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<meta charset=utf-8>
+<link rel=match href=lineto_ref.html>
+<style>
+  html, body {
+    margin: 0;
+    padding: 0;
+  }
+</style>
+<canvas id="c" width="150" height="150" >
+Your browser does not support the HTML5 canvas tag.</canvas>
+
+<script>
+var c = document.getElementById("c");
+var ctx = c.getContext("2d");
+
+ctx.beginPath();
+ctx.moveTo(20, 20);
+ctx.lineTo(20, 130);
+ctx.lineTo(130, 130);
+ctx.lineTo(130, 20);
+ctx.closePath();
+
+ctx.fillStyle = '#90EE90';
+ctx.fill();
+</script>
diff --git a/testing/web-platform/tests/2dcontext/line-styles/lineto_ref.html b/testing/web-platform/tests/2dcontext/line-styles/lineto_ref.html
new file mode 100644
index 000000000..3dc78ff80
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/lineto_ref.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<meta charset=utf-8>
+<style>
+  html, body {
+    margin: 0;
+    padding: 0;
+  }
+  div {
+    background: #90EE90;
+    width: 110px;
+    height: 110px;
+    margin: 20px;
+  }
+</style>
+<div></div>
diff --git a/testing/web-platform/tests/2dcontext/line-styles/setLineDash.html b/testing/web-platform/tests/2dcontext/line-styles/setLineDash.html
new file mode 100644
index 000000000..06fcada76
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/line-styles/setLineDash.html
@@ -0,0 +1,104 @@
+<!DOCTYPE html>
+<meta charset=utf-8>
+<title>setLineDash</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<canvas id="canvas"></canvas>
+<script>
+test(function() {
+  var canvas = document.getElementById('canvas');
+  var ctx = canvas.getContext('2d');
+
+  var initial = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
+
+  ctx.setLineDash(initial);
+  assert_array_equals(ctx.getLineDash(), initial, "line dash sanity");
+
+  ctx.setLineDash([Infinity]);
+  assert_array_equals(ctx.getLineDash(), initial, "Inf doesn't reset line dash");
+
+  ctx.setLineDash([NaN]);
+  assert_array_equals(ctx.getLineDash(), initial, "NaN doesn't reset line dash");
+
+  ctx.setLineDash([-1]);
+  assert_array_equals(ctx.getLineDash(), initial, "Negative doesn't reset line dash");
+}, "Invalid arguments to setLineDash()");
+
+test(function() {
+  var canvas = document.getElementById('canvas');
+  var ctx = canvas.getContext('2d');
+  assert_equals(ctx.lineDashOffset, 0);
+
+  ctx.setLineDash([15, 10]);
+  ctx.lineDashOffset = 5;
+  ctx.strokeRect(10,10,100,100);
+
+  var lineDash = ctx.getLineDash();
+  assert_array_equals(lineDash, [15, 10]);
+  assert_equals(ctx.lineDashOffset, 5);
+
+  ctx.setLineDash([5, 10, 15]);
+  ctx.strokeRect(20, 20, 120, 120);
+  lineDash = ctx.getLineDash();
+  assert_array_equals(lineDash, [5, 10, 15, 5, 10, 15]);
+
+  ctx.setLineDash(["1", 2]);
+  lineDash = ctx.getLineDash();
+  assert_array_equals(lineDash, [1, 2]);
+
+  ctx.clearRect(0, 0, 700, 700);
+  assert_equals(ctx.lineDashOffset, 5);
+
+  ctx.setLineDash([20, 10]);
+  ctx.lineDashOffset = 0;
+  // Make the test immune to plaform anti-aliasing discrepancies.
+  ctx.lineWidth = 4;
+  ctx.strokeStyle = '#00FF00';
+  ctx.strokeRect(10.5, 10.5, 30, 30);
+
+  _assertPixel(canvas, 25, 10, 0, 255, 0, 255, 0);
+  _assertPixel(canvas, 35, 10, 0, 0, 0, 0, 0);
+  _assertPixel(canvas, 40, 25, 0, 255, 0, 255, 0);
+  _assertPixel(canvas, 40, 35, 0, 0, 0, 0, 0);
+  _assertPixel(canvas, 25, 40, 0, 255, 0, 255, 0);
+  _assertPixel(canvas, 15, 40, 0, 0, 0, 0, 0);
+  _assertPixel(canvas, 10, 25, 0, 255, 0, 255, 0);
+  _assertPixel(canvas, 10, 15, 0, 0, 0, 0, 0);
+
+  // Verify that lineDashOffset works as expected.
+  ctx.lineDashOffset = 20;
+  ctx.strokeRect(50.5, 10.5, 30, 30);
+  _assertPixel(canvas, 55, 10, 0, 0, 0, 0, 0);
+  _assertPixel(canvas, 65, 10, 0, 255, 0, 255, 0);
+  _assertPixel(canvas, 80, 15, 0, 0, 0, 0, 0);
+  _assertPixel(canvas, 80, 25, 0, 255, 0, 255, 0);
+  _assertPixel(canvas, 75, 40, 0, 0, 0, 0, 0);
+  _assertPixel(canvas, 65, 40, 0, 255, 0, 255, 0);
+  _assertPixel(canvas, 50, 35, 0, 0, 0, 0, 0);
+  _assertPixel(canvas, 50, 25, 0, 255, 0, 255, 0);
+
+  // Verify negative lineDashOffset.
+  ctx.lineDashOffset = -10;
+  ctx.strokeRect(90.5, 10.5, 30, 30);
+  _assertPixel(canvas, 95, 10, 0, 0, 0, 0, 0);
+  _assertPixel(canvas, 105, 10, 0, 255, 0, 255, 0);
+  _assertPixel(canvas, 120, 15, 0, 0, 0, 0, 0);
+  _assertPixel(canvas, 120, 25, 0, 255, 0, 255, 0);
+  _assertPixel(canvas, 115, 40, 0, 0, 0, 0, 0);
+  _assertPixel(canvas, 105, 40, 0, 255, 0, 255, 0);
+  _assertPixel(canvas, 90, 35, 0, 0, 0, 0, 0);
+  _assertPixel(canvas, 90, 25, 0, 255, 0, 255, 0);
+
+  // Ensure that all zeros or negative pattern does not cause error state in
+  // context.
+  ctx.setLineDash([0, 0]);
+  ctx.strokeRect(130.5, 10.5, 10, 10);
+  ctx.setLineDash([-1]);
+  ctx.strokeRect(130.5, 10.5, 10, 10);
+  _assertPixel(canvas, 135, 15, 0, 0, 0, 0, 0);
+  ctx.fillStyle = '#00FF00';
+  ctx.fillRect(130, 10, 10, 10);
+  _assertPixel(canvas, 135, 15, 0, 255, 0, 255, 0);
+});
+</script>
-- 
cgit v1.2.3