summaryrefslogtreecommitdiffstats
path: root/dom/canvas/test/test_canvas.html
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-07 19:33:14 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-07 19:33:14 +0000
commit36d22d82aa202bb199967e9512281e9a53db42c9 (patch)
tree105e8c98ddea1c1e4784a60a5a6410fa416be2de /dom/canvas/test/test_canvas.html
parentInitial commit. (diff)
downloadfirefox-esr-upstream.tar.xz
firefox-esr-upstream.zip
Adding upstream version 115.7.0esr.upstream/115.7.0esrupstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'dom/canvas/test/test_canvas.html')
-rw-r--r--dom/canvas/test/test_canvas.html25752
1 files changed, 25752 insertions, 0 deletions
diff --git a/dom/canvas/test/test_canvas.html b/dom/canvas/test/test_canvas.html
new file mode 100644
index 0000000000..d9a9b4ab35
--- /dev/null
+++ b/dom/canvas/test/test_canvas.html
@@ -0,0 +1,25752 @@
+<!DOCTYPE HTML>
+<title>Canvas Tests</title>
+<script src="/tests/SimpleTest/SimpleTest.js"></script>
+<link rel="stylesheet" href="/tests/SimpleTest/test.css">
+<body>
+<script>
+
+SimpleTest.waitForExplicitFinish();
+SimpleTest.requestFlakyTimeout("untriaged");
+const Cc = SpecialPowers.Cc;
+const Cr = SpecialPowers.Cr;
+
+function IsD2DEnabled() {
+ var enabled = false;
+
+ try {
+ enabled = Cc["@mozilla.org/gfx/info;1"].getService(SpecialPowers.Ci.nsIGfxInfo).D2DEnabled;
+ } catch(e) {}
+
+ return enabled;
+}
+
+function IsLinux() {
+ var os = "";
+
+ try {
+ os = Cc["@mozilla.org/xre/app-info;1"]
+ .getService(SpecialPowers.Ci.nsIXULRuntime).OS;
+ } catch (e) {}
+
+ return os.indexOf("Linux") == 0 &&
+ !navigator.appVersion.includes("Android");
+}
+
+function IsWindows() {
+ var os = "";
+
+ try {
+ os = Cc["@mozilla.org/xre/app-info;1"]
+ .getService(SpecialPowers.Ci.nsIXULRuntime).OS;
+ } catch (e) {}
+
+ return os.indexOf("WINNT") == 0;
+}
+
+function IsAzureSkia() {
+ var enabled = false;
+
+ try {
+ var backend = Cc["@mozilla.org/gfx/info;1"].getService(SpecialPowers.Ci.nsIGfxInfo).AzureCanvasBackend;
+ enabled = (backend == "skia");
+ } catch (e) { }
+
+ return enabled;
+}
+
+function IsAzureCairo() {
+ var enabled = false;
+
+ try {
+ var backend = Cc["@mozilla.org/gfx/info;1"].getService(SpecialPowers.Ci.nsIGfxInfo).AzureCanvasBackend;
+ enabled = (backend == "cairo");
+ } catch (e) { }
+
+ return enabled;
+}
+
+</script>
+<!-- Includes all the tests in the dom/canvas/tests except for test_bug397524.html -->
+
+<!-- [[[ test_2d.canvas.readonly.html ]]] -->
+
+<p>Canvas test: 2d.canvas.readonly</p>
+<!-- Testing: CanvasRenderingContext2D.canvas is readonly -->
+<canvas id="c1" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_canvas_readonly() {
+
+var canvas = document.getElementById('c1');
+var ctx = canvas.getContext('2d');
+
+var c = document.createElement('canvas');
+var d = ctx.canvas;
+ok(c !== d, "c !== d");
+try { ctx.canvas = c; } catch (e) {} // not sure whether this should throw or not...
+ok(ctx.canvas === d, "ctx.canvas === d");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.canvas.reference.html ]]] -->
+
+<p>Canvas test: 2d.canvas.reference</p>
+<!-- Testing: CanvasRenderingContext2D.canvas refers back to its canvas -->
+<canvas id="c2" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_canvas_reference() {
+
+var canvas = document.getElementById('c2');
+var ctx = canvas.getContext('2d');
+
+ok(ctx.canvas === canvas, "ctx.canvas === canvas");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.clearRect.basic.html ]]] -->
+
+<p>Canvas test: 2d.clearRect.basic</p>
+<canvas id="c3" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+function isPixel(ctx, x,y, r,g,b,a, d) {
+ var pos = x + "," + y;
+ var colour = r + "," + g + "," + b + "," + a;
+ var pixel = ctx.getImageData(x, y, 1, 1);
+ var pr = pixel.data[0],
+ pg = pixel.data[1],
+ pb = pixel.data[2],
+ pa = pixel.data[3];
+ ok(r-d <= pr && pr <= r+d &&
+ g-d <= pg && pg <= g+d &&
+ b-d <= pb && pb <= b+d &&
+ a-d <= pa && pa <= a+d,
+ "pixel "+pos+" of "+ctx.canvas.id+" is "+pr+","+pg+","+pb+","+pa+"; expected "+colour+" +/- "+d);
+}
+
+function test_2d_clearRect_basic() {
+
+var canvas = document.getElementById('c3');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.clearRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,0,0,0, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.clearRect.clip.html ]]] -->
+
+<p>Canvas test: 2d.clearRect.clip</p>
+<canvas id="c4" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_clearRect_clip() {
+
+var canvas = document.getElementById('c4');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.beginPath();
+ctx.rect(0, 0, 16, 16);
+ctx.clip();
+
+ctx.clearRect(0, 0, 100, 50);
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 16, 16);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.clearRect.globalalpha.html ]]] -->
+
+<p>Canvas test: 2d.clearRect.globalalpha</p>
+<canvas id="c5" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_clearRect_globalalpha() {
+
+var canvas = document.getElementById('c5');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalAlpha = 0.1;
+ctx.clearRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,0,0,0, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.clearRect.globalcomposite.html ]]] -->
+
+<p>Canvas test: 2d.clearRect.globalcomposite</p>
+<canvas id="c6" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_clearRect_globalcomposite() {
+
+var canvas = document.getElementById('c6');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-atop';
+ctx.clearRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,0,0,0, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.clearRect.negative.html ]]] -->
+
+<p>Canvas test: 2d.clearRect.negative</p>
+<canvas id="c7" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_clearRect_negative() {
+
+var canvas = document.getElementById('c7');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.clearRect(0, 0, 50, 25);
+ctx.clearRect(100, 0, -50, 25);
+ctx.clearRect(0, 50, 50, -25);
+ctx.clearRect(100, 50, -50, -25);
+isPixel(ctx, 25,12, 0,0,0,0, 0);
+isPixel(ctx, 75,12, 0,0,0,0, 0);
+isPixel(ctx, 25,37, 0,0,0,0, 0);
+isPixel(ctx, 75,37, 0,0,0,0, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.clearRect.nonfinite.html ]]] -->
+
+<p>Canvas test: 2d.clearRect.nonfinite</p>
+<!-- Testing: clearRect() with Infinity/NaN is ignored -->
+<canvas id="c8" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_clearRect_nonfinite() {
+
+var canvas = document.getElementById('c8');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.clearRect(Infinity, 0, 100, 50);
+ctx.clearRect(-Infinity, 0, 100, 50);
+ctx.clearRect(NaN, 0, 100, 50);
+ctx.clearRect(0, Infinity, 100, 50);
+ctx.clearRect(0, -Infinity, 100, 50);
+ctx.clearRect(0, NaN, 100, 50);
+ctx.clearRect(0, 0, Infinity, 50);
+ctx.clearRect(0, 0, -Infinity, 50);
+ctx.clearRect(0, 0, NaN, 50);
+ctx.clearRect(0, 0, 100, Infinity);
+ctx.clearRect(0, 0, 100, -Infinity);
+ctx.clearRect(0, 0, 100, NaN);
+ctx.clearRect(Infinity, Infinity, 100, 50);
+ctx.clearRect(Infinity, Infinity, Infinity, 50);
+ctx.clearRect(Infinity, Infinity, Infinity, Infinity);
+ctx.clearRect(Infinity, Infinity, 100, Infinity);
+ctx.clearRect(Infinity, 0, Infinity, 50);
+ctx.clearRect(Infinity, 0, Infinity, Infinity);
+ctx.clearRect(Infinity, 0, 100, Infinity);
+ctx.clearRect(0, Infinity, Infinity, 50);
+ctx.clearRect(0, Infinity, Infinity, Infinity);
+ctx.clearRect(0, Infinity, 100, Infinity);
+ctx.clearRect(0, 0, Infinity, Infinity);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.clearRect.path.html ]]] -->
+
+<p>Canvas test: 2d.clearRect.path</p>
+<canvas id="c9" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_clearRect_path() {
+
+var canvas = document.getElementById('c9');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.beginPath();
+ctx.rect(0, 0, 100, 50);
+ctx.clearRect(0, 0, 16, 16);
+ctx.fill();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.clearRect.shadow.html ]]] -->
+
+<p>Canvas test: 2d.clearRect.shadow</p>
+<canvas id="c10" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_clearRect_shadow() {
+
+var canvas = document.getElementById('c10');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.shadowColor = '#f00';
+ctx.shadowBlur = 0;
+ctx.shadowOffsetX = 0;
+ctx.shadowOffsetY = 50;
+ctx.clearRect(0, -50, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.clearRect.transform.html ]]] -->
+
+<p>Canvas test: 2d.clearRect.transform</p>
+<canvas id="c11" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_clearRect_transform() {
+
+var canvas = document.getElementById('c11');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.scale(10, 10);
+ctx.translate(0, 5);
+ctx.clearRect(0, -5, 10, 5);
+isPixel(ctx, 50,25, 0,0,0,0, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.clearRect.zero.html ]]] -->
+
+<p>Canvas test: 2d.clearRect.zero</p>
+<canvas id="c12" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_clearRect_zero() {
+
+var canvas = document.getElementById('c12');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.clearRect(0, 0, 100, 0);
+ctx.clearRect(0, 0, 0, 50);
+ctx.clearRect(0, 0, 0, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.canvas.copy.html ]]] -->
+
+<p>Canvas test: 2d.composite.canvas.copy</p>
+<canvas id="c13" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_canvas_copy() {
+
+var canvas = document.getElementById('c13');
+var ctx = canvas.getContext('2d');
+
+
+var canvas2 = document.createElement('canvas');
+canvas2.width = canvas.width;
+canvas2.height = canvas.height;
+var ctx2 = canvas2.getContext('2d');
+ctx2.drawImage(document.getElementById('yellow75_1.png'), 0, 0);
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'copy';
+ctx.drawImage(canvas2, 0, 0);
+isPixel(ctx, 50,25, 255,255,0,191, 5);
+
+
+}
+</script>
+<img src="image_yellow75.png" id="yellow75_1.png" class="resource">
+
+<!-- [[[ test_2d.composite.canvas.destination-atop.html ]]] -->
+
+<p>Canvas test: 2d.composite.canvas.destination-atop</p>
+<canvas id="c14" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_canvas_destination_atop() {
+
+var canvas = document.getElementById('c14');
+var ctx = canvas.getContext('2d');
+
+
+var canvas2 = document.createElement('canvas');
+canvas2.width = canvas.width;
+canvas2.height = canvas.height;
+var ctx2 = canvas2.getContext('2d');
+ctx2.drawImage(document.getElementById('yellow75_2.png'), 0, 0);
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-atop';
+ctx.drawImage(canvas2, 0, 0);
+isPixel(ctx, 50,25, 127,255,127,191, 5);
+
+
+}
+</script>
+<img src="image_yellow75.png" id="yellow75_2.png" class="resource">
+
+<!-- [[[ test_2d.composite.canvas.destination-in.html ]]] -->
+
+<p>Canvas test: 2d.composite.canvas.destination-in</p>
+<canvas id="c15" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_canvas_destination_in() {
+
+var canvas = document.getElementById('c15');
+var ctx = canvas.getContext('2d');
+
+
+var canvas2 = document.createElement('canvas');
+canvas2.width = canvas.width;
+canvas2.height = canvas.height;
+var ctx2 = canvas2.getContext('2d');
+ctx2.drawImage(document.getElementById('yellow75_3.png'), 0, 0);
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-in';
+ctx.drawImage(canvas2, 0, 0);
+isPixel(ctx, 50,25, 0,255,255,95, 5);
+
+
+}
+</script>
+<img src="image_yellow75.png" id="yellow75_3.png" class="resource">
+
+<!-- [[[ test_2d.composite.canvas.destination-out.html ]]] -->
+
+<p>Canvas test: 2d.composite.canvas.destination-out</p>
+<canvas id="c16" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_canvas_destination_out() {
+
+var canvas = document.getElementById('c16');
+var ctx = canvas.getContext('2d');
+
+
+var canvas2 = document.createElement('canvas');
+canvas2.width = canvas.width;
+canvas2.height = canvas.height;
+var ctx2 = canvas2.getContext('2d');
+ctx2.drawImage(document.getElementById('yellow75_4.png'), 0, 0);
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-out';
+ctx.drawImage(canvas2, 0, 0);
+isPixel(ctx, 50,25, 0,255,255,31, 5);
+
+
+}
+</script>
+<img src="image_yellow75.png" id="yellow75_4.png" class="resource">
+
+<!-- [[[ test_2d.composite.canvas.destination-over.html ]]] -->
+
+<p>Canvas test: 2d.composite.canvas.destination-over</p>
+<canvas id="c17" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_canvas_destination_over() {
+
+var canvas = document.getElementById('c17');
+var ctx = canvas.getContext('2d');
+
+
+var canvas2 = document.createElement('canvas');
+canvas2.width = canvas.width;
+canvas2.height = canvas.height;
+var ctx2 = canvas2.getContext('2d');
+ctx2.drawImage(document.getElementById('yellow75_5.png'), 0, 0);
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-over';
+ctx.drawImage(canvas2, 0, 0);
+isPixel(ctx, 50,25, 109,255,145,223, 5);
+
+
+}
+</script>
+<img src="image_yellow75.png" id="yellow75_5.png" class="resource">
+
+<!-- [[[ test_2d.composite.canvas.lighter.html ]]] -->
+
+<p>Canvas test: 2d.composite.canvas.lighter</p>
+<canvas id="c18" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_canvas_lighter() {
+
+var canvas = document.getElementById('c18');
+var ctx = canvas.getContext('2d');
+
+
+var canvas2 = document.createElement('canvas');
+canvas2.width = canvas.width;
+canvas2.height = canvas.height;
+var ctx2 = canvas2.getContext('2d');
+ctx2.drawImage(document.getElementById('yellow75_6.png'), 0, 0);
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'lighter';
+ctx.drawImage(canvas2, 0, 0);
+isPixel(ctx, 50,25, 191,255,127,255, 5);
+
+
+}
+</script>
+<img src="image_yellow75.png" id="yellow75_6.png" class="resource">
+
+<!-- [[[ test_2d.composite.canvas.source-atop.html ]]] -->
+
+<p>Canvas test: 2d.composite.canvas.source-atop</p>
+<canvas id="c19" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_canvas_source_atop() {
+
+var canvas = document.getElementById('c19');
+var ctx = canvas.getContext('2d');
+
+
+var canvas2 = document.createElement('canvas');
+canvas2.width = canvas.width;
+canvas2.height = canvas.height;
+var ctx2 = canvas2.getContext('2d');
+ctx2.drawImage(document.getElementById('yellow75_7.png'), 0, 0);
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'source-atop';
+ctx.drawImage(canvas2, 0, 0);
+isPixel(ctx, 50,25, 191,255,63,127, 5);
+
+
+}
+</script>
+<img src="image_yellow75.png" id="yellow75_7.png" class="resource">
+
+<!-- [[[ test_2d.composite.canvas.source-in.html ]]] -->
+
+<p>Canvas test: 2d.composite.canvas.source-in</p>
+<canvas id="c20" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_canvas_source_in() {
+
+var canvas = document.getElementById('c20');
+var ctx = canvas.getContext('2d');
+
+
+var canvas2 = document.createElement('canvas');
+canvas2.width = canvas.width;
+canvas2.height = canvas.height;
+var ctx2 = canvas2.getContext('2d');
+ctx2.drawImage(document.getElementById('yellow75_8.png'), 0, 0);
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'source-in';
+ctx.drawImage(canvas2, 0, 0);
+isPixel(ctx, 50,25, 255,255,0,95, 5);
+
+
+}
+</script>
+<img src="image_yellow75.png" id="yellow75_8.png" class="resource">
+
+<!-- [[[ test_2d.composite.canvas.source-out.html ]]] -->
+
+<p>Canvas test: 2d.composite.canvas.source-out</p>
+<canvas id="c21" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_canvas_source_out() {
+
+var canvas = document.getElementById('c21');
+var ctx = canvas.getContext('2d');
+
+
+var canvas2 = document.createElement('canvas');
+canvas2.width = canvas.width;
+canvas2.height = canvas.height;
+var ctx2 = canvas2.getContext('2d');
+ctx2.drawImage(document.getElementById('yellow75_9.png'), 0, 0);
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'source-out';
+ctx.drawImage(canvas2, 0, 0);
+isPixel(ctx, 50,25, 255,255,0,95, 5);
+
+
+}
+</script>
+<img src="image_yellow75.png" id="yellow75_9.png" class="resource">
+
+<!-- [[[ test_2d.composite.canvas.source-over.html ]]] -->
+
+<p>Canvas test: 2d.composite.canvas.source-over</p>
+<canvas id="c22" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_canvas_source_over() {
+
+var canvas = document.getElementById('c22');
+var ctx = canvas.getContext('2d');
+
+
+var canvas2 = document.createElement('canvas');
+canvas2.width = canvas.width;
+canvas2.height = canvas.height;
+var ctx2 = canvas2.getContext('2d');
+ctx2.drawImage(document.getElementById('yellow75_10.png'), 0, 0);
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'source-over';
+ctx.drawImage(canvas2, 0, 0);
+isPixel(ctx, 50,25, 218,255,36,223, 5);
+
+
+}
+</script>
+<img src="image_yellow75.png" id="yellow75_10.png" class="resource">
+
+<!-- [[[ test_2d.composite.canvas.xor.html ]]] -->
+
+<p>Canvas test: 2d.composite.canvas.xor</p>
+<canvas id="c23" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_canvas_xor() {
+
+var canvas = document.getElementById('c23');
+var ctx = canvas.getContext('2d');
+
+
+var canvas2 = document.createElement('canvas');
+canvas2.width = canvas.width;
+canvas2.height = canvas.height;
+var ctx2 = canvas2.getContext('2d');
+ctx2.drawImage(document.getElementById('yellow75_11.png'), 0, 0);
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'xor';
+ctx.drawImage(canvas2, 0, 0);
+isPixel(ctx, 50,25, 191,255,63,127, 5);
+
+
+}
+</script>
+<img src="image_yellow75.png" id="yellow75_11.png" class="resource">
+
+<!-- [[[ test_2d.composite.clip.copy.html ]]] -->
+
+<p>Canvas test: 2d.composite.clip.copy</p>
+<!-- Testing: fill() does not affect pixels outside the clip region. -->
+<canvas id="c24" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_clip_copy() {
+
+var canvas = document.getElementById('c24');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'copy';
+ctx.rect(-20, -20, 10, 10);
+ctx.clip();
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 50, 50);
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.clip.destination-atop.html ]]] -->
+
+<p>Canvas test: 2d.composite.clip.destination-atop</p>
+<!-- Testing: fill() does not affect pixels outside the clip region. -->
+<canvas id="c25" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_clip_destination_atop() {
+
+var canvas = document.getElementById('c25');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-atop';
+ctx.rect(-20, -20, 10, 10);
+ctx.clip();
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 50, 50);
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.clip.destination-in.html ]]] -->
+
+<p>Canvas test: 2d.composite.clip.destination-in</p>
+<!-- Testing: fill() does not affect pixels outside the clip region. -->
+<canvas id="c26" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_clip_destination_in() {
+
+var canvas = document.getElementById('c26');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-in';
+ctx.rect(-20, -20, 10, 10);
+ctx.clip();
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 50, 50);
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.clip.destination-out.html ]]] -->
+
+<p>Canvas test: 2d.composite.clip.destination-out</p>
+<!-- Testing: fill() does not affect pixels outside the clip region. -->
+<canvas id="c27" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_clip_destination_out() {
+
+var canvas = document.getElementById('c27');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-out';
+ctx.rect(-20, -20, 10, 10);
+ctx.clip();
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 50, 50);
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.clip.destination-over.html ]]] -->
+
+<p>Canvas test: 2d.composite.clip.destination-over</p>
+<!-- Testing: fill() does not affect pixels outside the clip region. -->
+<canvas id="c28" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_clip_destination_over() {
+
+var canvas = document.getElementById('c28');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-over';
+ctx.rect(-20, -20, 10, 10);
+ctx.clip();
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 50, 50);
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.clip.lighter.html ]]] -->
+
+<p>Canvas test: 2d.composite.clip.lighter</p>
+<!-- Testing: fill() does not affect pixels outside the clip region. -->
+<canvas id="c29" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_clip_lighter() {
+
+var canvas = document.getElementById('c29');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'lighter';
+ctx.rect(-20, -20, 10, 10);
+ctx.clip();
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 50, 50);
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.clip.source-atop.html ]]] -->
+
+<p>Canvas test: 2d.composite.clip.source-atop</p>
+<!-- Testing: fill() does not affect pixels outside the clip region. -->
+<canvas id="c30" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_clip_source_atop() {
+
+var canvas = document.getElementById('c30');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'source-atop';
+ctx.rect(-20, -20, 10, 10);
+ctx.clip();
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 50, 50);
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.clip.source-in.html ]]] -->
+
+<p>Canvas test: 2d.composite.clip.source-in</p>
+<!-- Testing: fill() does not affect pixels outside the clip region. -->
+<canvas id="c31" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_clip_source_in() {
+
+var canvas = document.getElementById('c31');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'source-in';
+ctx.rect(-20, -20, 10, 10);
+ctx.clip();
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 50, 50);
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.clip.source-out.html ]]] -->
+
+<p>Canvas test: 2d.composite.clip.source-out</p>
+<!-- Testing: fill() does not affect pixels outside the clip region. -->
+<canvas id="c32" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_clip_source_out() {
+
+var canvas = document.getElementById('c32');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'source-out';
+ctx.rect(-20, -20, 10, 10);
+ctx.clip();
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 50, 50);
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.clip.source-over.html ]]] -->
+
+<p>Canvas test: 2d.composite.clip.source-over</p>
+<!-- Testing: fill() does not affect pixels outside the clip region. -->
+<canvas id="c33" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_clip_source_over() {
+
+var canvas = document.getElementById('c33');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'source-over';
+ctx.rect(-20, -20, 10, 10);
+ctx.clip();
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 50, 50);
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.clip.xor.html ]]] -->
+
+<p>Canvas test: 2d.composite.clip.xor</p>
+<!-- Testing: fill() does not affect pixels outside the clip region. -->
+<canvas id="c34" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_clip_xor() {
+
+var canvas = document.getElementById('c34');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'xor';
+ctx.rect(-20, -20, 10, 10);
+ctx.clip();
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 50, 50);
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.globalAlpha.canvas.html ]]] -->
+
+<p>Canvas test: 2d.composite.globalAlpha.canvas</p>
+<canvas id="c35" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_globalAlpha_canvas() {
+
+var canvas = document.getElementById('c35');
+var ctx = canvas.getContext('2d');
+
+var canvas2 = document.createElement('canvas');
+canvas2.width = 100;
+canvas2.height = 50;
+var ctx2 = canvas2.getContext('2d');
+ctx2.fillStyle = '#f00';
+ctx2.fillRect(0, 0, 100, 50);
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalAlpha = 0.01; // avoid any potential alpha=0 optimisations
+ctx.drawImage(canvas2, 0, 0);
+isPixel(ctx, 50,25, 2,253,0,255, 2);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.globalAlpha.canvaspattern.html ]]] -->
+
+<p>Canvas test: 2d.composite.globalAlpha.canvaspattern - bug 401790</p>
+<canvas id="c36" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function todo_isPixel(ctx, x,y, r,g,b,a, d) {
+ var pos = x + "," + y;
+ var colour = r + "," + g + "," + b + "," + a;
+ var pixel = ctx.getImageData(x, y, 1, 1);
+ var pr = pixel.data[0],
+ pg = pixel.data[1],
+ pb = pixel.data[2],
+ pa = pixel.data[3];
+ todo(r-d <= pr && pr <= r+d &&
+ g-d <= pg && pg <= g+d &&
+ b-d <= pb && pb <= b+d &&
+ a-d <= pa && pa <= a+d,
+ "pixel "+pos+" of "+ctx.canvas.id+" is "+pr+","+pg+","+pb+","+pa+" (marked todo); expected "+colour+" +/- " + d);
+}
+
+function test_2d_composite_globalAlpha_canvaspattern() {
+
+var canvas = document.getElementById('c36');
+var ctx = canvas.getContext('2d');
+
+var canvas2 = document.createElement('canvas');
+canvas2.width = 100;
+canvas2.height = 50;
+var ctx2 = canvas2.getContext('2d');
+ctx2.fillStyle = '#f00';
+ctx2.fillRect(0, 0, 100, 50);
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = ctx.createPattern(canvas2, 'no-repeat');
+ctx.globalAlpha = 0.01; // avoid any potential alpha=0 optimisations
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 2,253,0,255, 2);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.globalAlpha.default.html ]]] -->
+
+<p>Canvas test: 2d.composite.globalAlpha.default</p>
+<canvas id="c37" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_composite_globalAlpha_default() {
+
+var canvas = document.getElementById('c37');
+var ctx = canvas.getContext('2d');
+
+ok(ctx.globalAlpha === 1.0, "ctx.globalAlpha === 1.0");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.globalAlpha.fill.html ]]] -->
+
+<p>Canvas test: 2d.composite.globalAlpha.fill</p>
+<canvas id="c38" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_globalAlpha_fill() {
+
+var canvas = document.getElementById('c38');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalAlpha = 0.01; // avoid any potential alpha=0 optimisations
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 2,253,0,255, 2);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.globalAlpha.image.html ]]] -->
+
+<p>Canvas test: 2d.composite.globalAlpha.image</p>
+<canvas id="c39" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_globalAlpha_image() {
+
+var canvas = document.getElementById('c39');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalAlpha = 0.01; // avoid any potential alpha=0 optimisations
+ctx.drawImage(document.getElementById('red_1.png'), 0, 0);
+isPixel(ctx, 50,25, 2,253,0,255, 2);
+
+
+}
+</script>
+<img src="image_red.png" id="red_1.png" class="resource">
+
+<!-- [[[ test_2d.composite.globalAlpha.imagepattern.html ]]] -->
+
+<p>Canvas test: 2d.composite.globalAlpha.imagepattern - bug 401790</p>
+<canvas id="c40" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_composite_globalAlpha_imagepattern() {
+
+var canvas = document.getElementById('c40');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = ctx.createPattern(document.getElementById('red_2.png'), 'no-repeat');
+ctx.globalAlpha = 0.01; // avoid any potential alpha=0 optimisations
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 2,253,0,255, 2);
+
+
+}
+</script>
+<img src="image_red.png" id="red_2.png" class="resource">
+
+<!-- [[[ test_2d.composite.globalAlpha.invalid.html ]]] -->
+
+<p>Canvas test: 2d.composite.globalAlpha.invalid</p>
+<canvas id="c41" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_composite_globalAlpha_invalid() {
+
+var canvas = document.getElementById('c41');
+var ctx = canvas.getContext('2d');
+
+ctx.globalAlpha = 0.5;
+var a = ctx.globalAlpha; // might not be exactly 0.5, if it is rounded/quantised, so remember for future comparisons
+ctx.globalAlpha = Infinity;
+ok(ctx.globalAlpha === a, "ctx.globalAlpha === a");
+ctx.globalAlpha = -Infinity;
+ok(ctx.globalAlpha === a, "ctx.globalAlpha === a");
+ctx.globalAlpha = NaN;
+ok(ctx.globalAlpha === a, "ctx.globalAlpha === a");
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.globalAlpha.range.html ]]] -->
+
+<p>Canvas test: 2d.composite.globalAlpha.range</p>
+<canvas id="c42" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_composite_globalAlpha_range() {
+
+var canvas = document.getElementById('c42');
+var ctx = canvas.getContext('2d');
+
+ctx.globalAlpha = 0.5;
+var a = ctx.globalAlpha; // might not be exactly 0.5, if it is rounded/quantised, so remember for future comparisons
+ctx.globalAlpha = 1.1;
+ok(ctx.globalAlpha == a, "ctx.globalAlpha == a");
+ctx.globalAlpha = -0.1;
+ok(ctx.globalAlpha == a, "ctx.globalAlpha == a");
+ctx.globalAlpha = 0;
+ok(ctx.globalAlpha == 0, "ctx.globalAlpha == 0");
+ctx.globalAlpha = 1;
+ok(ctx.globalAlpha == 1, "ctx.globalAlpha == 1");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.image.copy.html ]]] -->
+
+<p>Canvas test: 2d.composite.image.copy</p>
+<canvas id="c43" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_image_copy() {
+
+var canvas = document.getElementById('c43');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'copy';
+ctx.drawImage(document.getElementById('yellow75_12.png'), 0, 0);
+isPixel(ctx, 50,25, 255,255,0,191, 5);
+
+
+}
+</script>
+<img src="image_yellow75.png" id="yellow75_12.png" class="resource">
+
+<!-- [[[ test_2d.composite.image.destination-atop.html ]]] -->
+
+<p>Canvas test: 2d.composite.image.destination-atop</p>
+<canvas id="c44" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_image_destination_atop() {
+
+var canvas = document.getElementById('c44');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-atop';
+ctx.drawImage(document.getElementById('yellow75_13.png'), 0, 0);
+isPixel(ctx, 50,25, 127,255,127,191, 5);
+
+
+}
+</script>
+<img src="image_yellow75.png" id="yellow75_13.png" class="resource">
+
+<!-- [[[ test_2d.composite.image.destination-in.html ]]] -->
+
+<p>Canvas test: 2d.composite.image.destination-in</p>
+<canvas id="c45" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_image_destination_in() {
+
+var canvas = document.getElementById('c45');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-in';
+ctx.drawImage(document.getElementById('yellow75_14.png'), 0, 0);
+isPixel(ctx, 50,25, 0,255,255,95, 5);
+
+
+}
+</script>
+<img src="image_yellow75.png" id="yellow75_14.png" class="resource">
+
+<!-- [[[ test_2d.composite.image.destination-out.html ]]] -->
+
+<p>Canvas test: 2d.composite.image.destination-out</p>
+<canvas id="c46" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_image_destination_out() {
+
+var canvas = document.getElementById('c46');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-out';
+ctx.drawImage(document.getElementById('yellow75_15.png'), 0, 0);
+isPixel(ctx, 50,25, 0,255,255,31, 5);
+
+
+}
+</script>
+<img src="image_yellow75.png" id="yellow75_15.png" class="resource">
+
+<!-- [[[ test_2d.composite.image.destination-over.html ]]] -->
+
+<p>Canvas test: 2d.composite.image.destination-over</p>
+<canvas id="c47" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_image_destination_over() {
+
+var canvas = document.getElementById('c47');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-over';
+ctx.drawImage(document.getElementById('yellow75_16.png'), 0, 0);
+isPixel(ctx, 50,25, 109,255,145,223, 5);
+
+
+}
+</script>
+<img src="image_yellow75.png" id="yellow75_16.png" class="resource">
+
+<!-- [[[ test_2d.composite.image.lighter.html ]]] -->
+
+<p>Canvas test: 2d.composite.image.lighter</p>
+<canvas id="c48" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_image_lighter() {
+
+var canvas = document.getElementById('c48');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'lighter';
+ctx.drawImage(document.getElementById('yellow75_17.png'), 0, 0);
+isPixel(ctx, 50,25, 191,255,127,255, 5);
+
+
+}
+</script>
+<img src="image_yellow75.png" id="yellow75_17.png" class="resource">
+
+<!-- [[[ test_2d.composite.image.source-atop.html ]]] -->
+
+<p>Canvas test: 2d.composite.image.source-atop</p>
+<canvas id="c49" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_image_source_atop() {
+
+var canvas = document.getElementById('c49');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'source-atop';
+ctx.drawImage(document.getElementById('yellow75_18.png'), 0, 0);
+isPixel(ctx, 50,25, 191,255,63,127, 5);
+
+
+}
+</script>
+<img src="image_yellow75.png" id="yellow75_18.png" class="resource">
+
+<!-- [[[ test_2d.composite.image.source-in.html ]]] -->
+
+<p>Canvas test: 2d.composite.image.source-in</p>
+<canvas id="c50" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_image_source_in() {
+
+var canvas = document.getElementById('c50');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'source-in';
+ctx.drawImage(document.getElementById('yellow75_19.png'), 0, 0);
+isPixel(ctx, 50,25, 255,255,0,95, 5);
+
+
+}
+</script>
+<img src="image_yellow75.png" id="yellow75_19.png" class="resource">
+
+<!-- [[[ test_2d.composite.image.source-out.html ]]] -->
+
+<p>Canvas test: 2d.composite.image.source-out</p>
+<canvas id="c51" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_image_source_out() {
+
+var canvas = document.getElementById('c51');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'source-out';
+ctx.drawImage(document.getElementById('yellow75_20.png'), 0, 0);
+isPixel(ctx, 50,25, 255,255,0,95, 5);
+
+
+}
+</script>
+<img src="image_yellow75.png" id="yellow75_20.png" class="resource">
+
+<!-- [[[ test_2d.composite.image.source-over.html ]]] -->
+
+<p>Canvas test: 2d.composite.image.source-over</p>
+<canvas id="c52" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_image_source_over() {
+
+var canvas = document.getElementById('c52');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'source-over';
+ctx.drawImage(document.getElementById('yellow75_21.png'), 0, 0);
+isPixel(ctx, 50,25, 218,255,36,223, 5);
+
+
+}
+</script>
+<img src="image_yellow75.png" id="yellow75_21.png" class="resource">
+
+<!-- [[[ test_2d.composite.image.xor.html ]]] -->
+
+<p>Canvas test: 2d.composite.image.xor</p>
+<canvas id="c53" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_image_xor() {
+
+var canvas = document.getElementById('c53');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'xor';
+ctx.drawImage(document.getElementById('yellow75_22.png'), 0, 0);
+isPixel(ctx, 50,25, 191,255,63,127, 5);
+
+
+}
+</script>
+<img src="image_yellow75.png" id="yellow75_22.png" class="resource">
+
+<!-- [[[ test_2d.composite.operation.casesensitive.html ]]] -->
+
+<p>Canvas test: 2d.composite.operation.casesensitive - bug 401788</p>
+<canvas id="c54" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_composite_operation_casesensitive() {
+
+var canvas = document.getElementById('c54');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.globalCompositeOperation = 'xor';
+ctx.globalCompositeOperation = 'Source-over';
+ok(ctx.globalCompositeOperation == 'xor', "ctx.globalCompositeOperation == 'xor'");
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.operation.darker.html ]]] -->
+
+<p>Canvas test: 2d.composite.operation.darker</p>
+<canvas id="c56" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_composite_operation_darker() {
+
+var canvas = document.getElementById('c56');
+var ctx = canvas.getContext('2d');
+
+ctx.globalCompositeOperation = 'xor';
+ctx.globalCompositeOperation = 'darker';
+ok(ctx.globalCompositeOperation == 'xor', "ctx.globalCompositeOperation == 'xor'");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.operation.default.html ]]] -->
+
+<p>Canvas test: 2d.composite.operation.default</p>
+<canvas id="c57" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_composite_operation_default() {
+
+var canvas = document.getElementById('c57');
+var ctx = canvas.getContext('2d');
+
+ok(ctx.globalCompositeOperation == 'source-over', "ctx.globalCompositeOperation == 'source-over'");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.operation.get.html ]]] -->
+
+<p>Canvas test: 2d.composite.operation.get</p>
+<canvas id="c58" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_composite_operation_get() {
+
+var canvas = document.getElementById('c58');
+var ctx = canvas.getContext('2d');
+
+var modes = ['source-atop', 'source-in', 'source-out', 'source-over',
+ 'destination-atop', 'destination-in', 'destination-out', 'destination-over',
+ 'lighter', 'copy', 'xor'];
+for (var i = 0; i < modes.length; ++i)
+{
+ ctx.globalCompositeOperation = modes[i];
+ ok(ctx.globalCompositeOperation == modes[i], "ctx.globalCompositeOperation == modes[\""+(i)+"\"]");
+}
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.operation.highlight.html ]]] -->
+
+<p>Canvas test: 2d.composite.operation.highlight - bug 401788</p>
+<canvas id="c59" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_composite_operation_highlight() {
+
+var canvas = document.getElementById('c59');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.globalCompositeOperation = 'xor';
+ctx.globalCompositeOperation = 'highlight';
+ok(ctx.globalCompositeOperation == 'xor', "ctx.globalCompositeOperation == 'xor'");
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.operation.nullsuffix.html ]]] -->
+
+<p>Canvas test: 2d.composite.operation.nullsuffix - bug 401788</p>
+<canvas id="c60" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_composite_operation_nullsuffix() {
+
+var canvas = document.getElementById('c60');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.globalCompositeOperation = 'xor';
+ctx.globalCompositeOperation = 'source-over\0';
+ok(ctx.globalCompositeOperation == 'xor', "ctx.globalCompositeOperation == 'xor'");
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.operation.over.html ]]] -->
+
+<p>Canvas test: 2d.composite.operation.over</p>
+<canvas id="c61" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_composite_operation_over() {
+
+var canvas = document.getElementById('c61');
+var ctx = canvas.getContext('2d');
+
+ctx.globalCompositeOperation = 'xor';
+ctx.globalCompositeOperation = 'over';
+ok(ctx.globalCompositeOperation == 'xor', "ctx.globalCompositeOperation == 'xor'");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.operation.unrecognised.html ]]] -->
+
+<p>Canvas test: 2d.composite.operation.unrecognised - bug 401788</p>
+<canvas id="c62" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_composite_operation_unrecognised() {
+
+var canvas = document.getElementById('c62');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.globalCompositeOperation = 'xor';
+ctx.globalCompositeOperation = 'nonexistent';
+ok(ctx.globalCompositeOperation == 'xor', "ctx.globalCompositeOperation == 'xor'");
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.solid.copy.html ]]] -->
+
+<p>Canvas test: 2d.composite.solid.copy</p>
+<canvas id="c63" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_solid_copy() {
+
+var canvas = document.getElementById('c63');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'copy';
+ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 255,255,0,255, 5);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.solid.destination-atop.html ]]] -->
+
+<p>Canvas test: 2d.composite.solid.destination-atop</p>
+<canvas id="c64" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_solid_destination_atop() {
+
+var canvas = document.getElementById('c64');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-atop';
+ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,255,255, 5);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.solid.destination-in.html ]]] -->
+
+<p>Canvas test: 2d.composite.solid.destination-in</p>
+<canvas id="c65" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_solid_destination_in() {
+
+var canvas = document.getElementById('c65');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-in';
+ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,255,255, 5);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.solid.destination-out.html ]]] -->
+
+<p>Canvas test: 2d.composite.solid.destination-out</p>
+<canvas id="c66" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_solid_destination_out() {
+
+var canvas = document.getElementById('c66');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-out';
+ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,0,0,0, 5);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.solid.destination-over.html ]]] -->
+
+<p>Canvas test: 2d.composite.solid.destination-over</p>
+<canvas id="c67" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_solid_destination_over() {
+
+var canvas = document.getElementById('c67');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-over';
+ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,255,255, 5);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.solid.lighter.html ]]] -->
+
+<p>Canvas test: 2d.composite.solid.lighter</p>
+<canvas id="c68" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_solid_lighter() {
+
+var canvas = document.getElementById('c68');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'lighter';
+ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 255,255,255,255, 5);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.solid.source-atop.html ]]] -->
+
+<p>Canvas test: 2d.composite.solid.source-atop</p>
+<canvas id="c69" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_solid_source_atop() {
+
+var canvas = document.getElementById('c69');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'source-atop';
+ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 255,255,0,255, 5);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.solid.source-in.html ]]] -->
+
+<p>Canvas test: 2d.composite.solid.source-in</p>
+<canvas id="c70" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_solid_source_in() {
+
+var canvas = document.getElementById('c70');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'source-in';
+ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 255,255,0,255, 5);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.solid.source-out.html ]]] -->
+
+<p>Canvas test: 2d.composite.solid.source-out</p>
+<canvas id="c71" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_solid_source_out() {
+
+var canvas = document.getElementById('c71');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'source-out';
+ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,0,0,0, 5);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.solid.source-over.html ]]] -->
+
+<p>Canvas test: 2d.composite.solid.source-over</p>
+<canvas id="c72" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_solid_source_over() {
+
+var canvas = document.getElementById('c72');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'source-over';
+ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 255,255,0,255, 5);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.solid.xor.html ]]] -->
+
+<p>Canvas test: 2d.composite.solid.xor</p>
+<canvas id="c73" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_solid_xor() {
+
+var canvas = document.getElementById('c73');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'xor';
+ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,0,0,0, 5);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.transparent.copy.html ]]] -->
+
+<p>Canvas test: 2d.composite.transparent.copy</p>
+<canvas id="c74" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_transparent_copy() {
+
+var canvas = document.getElementById('c74');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'copy';
+ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,0,255,191, 5);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.transparent.destination-atop.html ]]] -->
+
+<p>Canvas test: 2d.composite.transparent.destination-atop</p>
+<canvas id="c75" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_transparent_destination_atop() {
+
+var canvas = document.getElementById('c75');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-atop';
+ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,127,127,191, 5);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.transparent.destination-in.html ]]] -->
+
+<p>Canvas test: 2d.composite.transparent.destination-in</p>
+<canvas id="c76" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_transparent_destination_in() {
+
+var canvas = document.getElementById('c76');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-in';
+ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,95, 5);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.transparent.destination-out.html ]]] -->
+
+<p>Canvas test: 2d.composite.transparent.destination-out</p>
+<canvas id="c77" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_transparent_destination_out() {
+
+var canvas = document.getElementById('c77');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-out';
+ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,31, 5);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.transparent.destination-over.html ]]] -->
+
+<p>Canvas test: 2d.composite.transparent.destination-over</p>
+<canvas id="c78" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_transparent_destination_over() {
+
+var canvas = document.getElementById('c78');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-over';
+ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,145,109,223, 5);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.transparent.lighter.html ]]] -->
+
+<p>Canvas test: 2d.composite.transparent.lighter</p>
+<canvas id="c79" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_transparent_lighter() {
+
+var canvas = document.getElementById('c79');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'lighter';
+ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,127,191,255, 5);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.transparent.source-atop.html ]]] -->
+
+<p>Canvas test: 2d.composite.transparent.source-atop</p>
+<canvas id="c80" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_transparent_source_atop() {
+
+var canvas = document.getElementById('c80');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'source-atop';
+ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,63,191,127, 5);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.transparent.source-in.html ]]] -->
+
+<p>Canvas test: 2d.composite.transparent.source-in</p>
+<canvas id="c81" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_transparent_source_in() {
+
+var canvas = document.getElementById('c81');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'source-in';
+ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,0,255,95, 5);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.transparent.source-out.html ]]] -->
+
+<p>Canvas test: 2d.composite.transparent.source-out</p>
+<canvas id="c82" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_transparent_source_out() {
+
+var canvas = document.getElementById('c82');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'source-out';
+ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,0,255,95, 5);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.transparent.source-over.html ]]] -->
+
+<p>Canvas test: 2d.composite.transparent.source-over</p>
+<canvas id="c83" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_transparent_source_over() {
+
+var canvas = document.getElementById('c83');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'source-over';
+ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,36,218,223, 5);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.transparent.xor.html ]]] -->
+
+<p>Canvas test: 2d.composite.transparent.xor</p>
+<canvas id="c84" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_composite_transparent_xor() {
+
+var canvas = document.getElementById('c84');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'xor';
+ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,63,191,127, 5);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.uncovered.fill.copy.html ]]] -->
+
+<p>Canvas test: 2d.composite.uncovered.fill.copy</p>
+<!-- Testing: fill() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
+<canvas id="c85" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_composite_uncovered_fill_copy() {
+
+var canvas = document.getElementById('c85');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'copy';
+ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
+ctx.translate(0, 25);
+ctx.fillRect(0, 50, 100, 50);
+isPixel(ctx, 50,25, 0,0,0,0, 5);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.uncovered.fill.destination-atop.html ]]] -->
+
+<p>Canvas test: 2d.composite.uncovered.fill.destination-atop</p>
+<!-- Testing: fill() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
+<canvas id="c86" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_composite_uncovered_fill_destination_atop() {
+
+var canvas = document.getElementById('c86');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-atop';
+ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
+ctx.translate(0, 25);
+ctx.fillRect(0, 50, 100, 50);
+isPixel(ctx, 50,25, 0,0,0,0, 5);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.uncovered.fill.destination-in.html ]]] -->
+
+<p>Canvas test: 2d.composite.uncovered.fill.destination-in</p>
+<!-- Testing: fill() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
+<canvas id="c87" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_composite_uncovered_fill_destination_in() {
+
+var canvas = document.getElementById('c87');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-in';
+ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
+ctx.translate(0, 25);
+ctx.fillRect(0, 50, 100, 50);
+isPixel(ctx, 50,25, 0,0,0,0, 5);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.uncovered.fill.source-in.html ]]] -->
+
+<p>Canvas test: 2d.composite.uncovered.fill.source-in</p>
+<!-- Testing: fill() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
+<canvas id="c88" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_composite_uncovered_fill_source_in() {
+
+var canvas = document.getElementById('c88');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'source-in';
+ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
+ctx.translate(0, 25);
+ctx.fillRect(0, 50, 100, 50);
+isPixel(ctx, 50,25, 0,0,0,0, 5);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.uncovered.fill.source-out.html ]]] -->
+
+<p>Canvas test: 2d.composite.uncovered.fill.source-out</p>
+<!-- Testing: fill() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
+<canvas id="c89" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_composite_uncovered_fill_source_out() {
+
+var canvas = document.getElementById('c89');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'source-out';
+ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
+ctx.translate(0, 25);
+ctx.fillRect(0, 50, 100, 50);
+isPixel(ctx, 50,25, 0,0,0,0, 5);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.composite.uncovered.image.copy.html ]]] -->
+
+<p>Canvas test: 2d.composite.uncovered.image.copy</p>
+<!-- Testing: drawImage() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
+<canvas id="c90" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_composite_uncovered_image_copy() {
+
+var canvas = document.getElementById('c90');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'copy';
+ctx.drawImage(document.getElementById('yellow_1.png'), 40, 40, 10, 10, 40, 50, 10, 10);
+isPixel(ctx, 15,15, 0,0,0,0, 5);
+isPixel(ctx, 50,25, 0,0,0,0, 5);
+
+
+}
+</script>
+<img src="image_yellow.png" id="yellow_1.png" class="resource">
+
+<!-- [[[ test_2d.composite.uncovered.image.destination-atop.html ]]] -->
+
+<p>Canvas test: 2d.composite.uncovered.image.destination-atop</p>
+<!-- Testing: drawImage() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
+<canvas id="c91" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_composite_uncovered_image_destination_atop() {
+
+var canvas = document.getElementById('c91');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-atop';
+ctx.drawImage(document.getElementById('yellow_2.png'), 40, 40, 10, 10, 40, 50, 10, 10);
+isPixel(ctx, 15,15, 0,0,0,0, 5);
+isPixel(ctx, 50,25, 0,0,0,0, 5);
+
+
+}
+</script>
+<img src="image_yellow.png" id="yellow_2.png" class="resource">
+
+<!-- [[[ test_2d.composite.uncovered.image.destination-in.html ]]] -->
+
+<p>Canvas test: 2d.composite.uncovered.image.destination-in</p>
+<!-- Testing: drawImage() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
+<canvas id="c92" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_composite_uncovered_image_destination_in() {
+
+var canvas = document.getElementById('c92');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-in';
+ctx.drawImage(document.getElementById('yellow_3.png'), 40, 40, 10, 10, 40, 50, 10, 10);
+isPixel(ctx, 15,15, 0,0,0,0, 5);
+isPixel(ctx, 50,25, 0,0,0,0, 5);
+
+
+}
+</script>
+<img src="image_yellow.png" id="yellow_3.png" class="resource">
+
+<!-- [[[ test_2d.composite.uncovered.image.source-in.html ]]] -->
+
+<p>Canvas test: 2d.composite.uncovered.image.source-in</p>
+<!-- Testing: drawImage() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
+<canvas id="c93" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_composite_uncovered_image_source_in() {
+
+var canvas = document.getElementById('c93');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'source-in';
+ctx.drawImage(document.getElementById('yellow_4.png'), 40, 40, 10, 10, 40, 50, 10, 10);
+isPixel(ctx, 15,15, 0,0,0,0, 5);
+isPixel(ctx, 50,25, 0,0,0,0, 5);
+
+
+}
+</script>
+<img src="image_yellow.png" id="yellow_4.png" class="resource">
+
+<!-- [[[ test_2d.composite.uncovered.image.source-out.html ]]] -->
+
+<p>Canvas test: 2d.composite.uncovered.image.source-out</p>
+<!-- Testing: drawImage() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
+<canvas id="c94" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_composite_uncovered_image_source_out() {
+
+var canvas = document.getElementById('c94');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'source-out';
+ctx.drawImage(document.getElementById('yellow_5.png'), 40, 40, 10, 10, 40, 50, 10, 10);
+isPixel(ctx, 15,15, 0,0,0,0, 5);
+isPixel(ctx, 50,25, 0,0,0,0, 5);
+
+
+}
+</script>
+<img src="image_yellow.png" id="yellow_5.png" class="resource">
+
+<!-- [[[ test_2d.composite.uncovered.pattern.copy.html ]]] -->
+
+<p>Canvas test: 2d.composite.uncovered.pattern.copy</p>
+<!-- Testing: Pattern fill() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
+<canvas id="c95" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_composite_uncovered_pattern_copy() {
+
+var canvas = document.getElementById('c95');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'copy';
+ctx.fillStyle = ctx.createPattern(document.getElementById('yellow_6.png'), 'no-repeat');
+ctx.fillRect(0, 50, 100, 50);
+isPixel(ctx, 50,25, 0,0,0,0, 5);
+
+
+}
+</script>
+<img src="image_yellow.png" id="yellow_6.png" class="resource">
+
+<!-- [[[ test_2d.composite.uncovered.pattern.destination-atop.html ]]] -->
+
+<p>Canvas test: 2d.composite.uncovered.pattern.destination-atop</p>
+<!-- Testing: Pattern fill() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
+<canvas id="c96" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_composite_uncovered_pattern_destination_atop() {
+
+var canvas = document.getElementById('c96');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-atop';
+ctx.fillStyle = ctx.createPattern(document.getElementById('yellow_7.png'), 'no-repeat');
+ctx.fillRect(0, 50, 100, 50);
+isPixel(ctx, 50,25, 0,0,0,0, 5);
+
+
+}
+</script>
+<img src="image_yellow.png" id="yellow_7.png" class="resource">
+
+<!-- [[[ test_2d.composite.uncovered.pattern.destination-in.html ]]] -->
+
+<p>Canvas test: 2d.composite.uncovered.pattern.destination-in</p>
+<!-- Testing: Pattern fill() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
+<canvas id="c97" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_composite_uncovered_pattern_destination_in() {
+
+var canvas = document.getElementById('c97');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-in';
+ctx.fillStyle = ctx.createPattern(document.getElementById('yellow_8.png'), 'no-repeat');
+ctx.fillRect(0, 50, 100, 50);
+isPixel(ctx, 50,25, 0,0,0,0, 5);
+
+
+}
+</script>
+<img src="image_yellow.png" id="yellow_8.png" class="resource">
+
+<!-- [[[ test_2d.composite.uncovered.pattern.source-in.html ]]] -->
+
+<p>Canvas test: 2d.composite.uncovered.pattern.source-in</p>
+<!-- Testing: Pattern fill() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
+<canvas id="c98" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_composite_uncovered_pattern_source_in() {
+
+var canvas = document.getElementById('c98');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'source-in';
+ctx.fillStyle = ctx.createPattern(document.getElementById('yellow_9.png'), 'no-repeat');
+ctx.fillRect(0, 50, 100, 50);
+isPixel(ctx, 50,25, 0,0,0,0, 5);
+
+
+}
+</script>
+<img src="image_yellow.png" id="yellow_9.png" class="resource">
+
+<!-- [[[ test_2d.composite.uncovered.pattern.source-out.html ]]] -->
+
+<p>Canvas test: 2d.composite.uncovered.pattern.source-out</p>
+<!-- Testing: Pattern fill() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
+<canvas id="c99" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_composite_uncovered_pattern_source_out() {
+
+var canvas = document.getElementById('c99');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'source-out';
+ctx.fillStyle = ctx.createPattern(document.getElementById('yellow_10.png'), 'no-repeat');
+ctx.fillRect(0, 50, 100, 50);
+isPixel(ctx, 50,25, 0,0,0,0, 5);
+
+
+}
+</script>
+<img src="image_yellow.png" id="yellow_10.png" class="resource">
+
+<!-- [[[ test_2d.drawImage.3arg.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.3arg</p>
+<canvas id="c100" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_drawImage_3arg() {
+
+var canvas = document.getElementById('c100');
+var ctx = canvas.getContext('2d');
+
+ctx.drawImage(document.getElementById('green_1.png'), 0, 0);
+ctx.drawImage(document.getElementById('red_3.png'), -100, 0);
+ctx.drawImage(document.getElementById('red_3.png'), 100, 0);
+ctx.drawImage(document.getElementById('red_3.png'), 0, -50);
+ctx.drawImage(document.getElementById('red_3.png'), 0, 50);
+
+isPixel(ctx, 0,0, 0,255,0,255, 2);
+isPixel(ctx, 99,0, 0,255,0,255, 2);
+isPixel(ctx, 0,49, 0,255,0,255, 2);
+isPixel(ctx, 99,49, 0,255,0,255, 2);
+
+
+}
+</script>
+<img src="image_red.png" id="red_3.png" class="resource">
+<img src="image_green.png" id="green_1.png" class="resource">
+
+<!-- [[[ test_2d.drawImage.5arg.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.5arg</p>
+<canvas id="c101" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_drawImage_5arg() {
+
+var canvas = document.getElementById('c101');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.drawImage(document.getElementById('green_2.png'), 50, 0, 50, 50);
+ctx.drawImage(document.getElementById('red_4.png'), 0, 0, 50, 50);
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 50, 50);
+
+isPixel(ctx, 0,0, 0,255,0,255, 2);
+isPixel(ctx, 99,0, 0,255,0,255, 2);
+isPixel(ctx, 0,49, 0,255,0,255, 2);
+isPixel(ctx, 99,49, 0,255,0,255, 2);
+
+
+}
+</script>
+<img src="image_red.png" id="red_4.png" class="resource">
+<img src="image_green.png" id="green_2.png" class="resource">
+
+<!-- [[[ test_2d.drawImage.9arg.basic.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.9arg.basic</p>
+<canvas id="c102" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_drawImage_9arg_basic() {
+
+var canvas = document.getElementById('c102');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.drawImage(document.getElementById('green_3.png'), 0, 0, 100, 50, 0, 0, 100, 50);
+isPixel(ctx, 0,0, 0,255,0,255, 2);
+isPixel(ctx, 99,0, 0,255,0,255, 2);
+isPixel(ctx, 0,49, 0,255,0,255, 2);
+isPixel(ctx, 99,49, 0,255,0,255, 2);
+
+
+}
+</script>
+<img src="image_green.png" id="green_3.png" class="resource">
+
+<!-- [[[ test_2d.drawImage.9arg.destpos.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.9arg.destpos</p>
+<canvas id="c103" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_drawImage_9arg_destpos() {
+
+var canvas = document.getElementById('c103');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.drawImage(document.getElementById('green_4.png'), 0, 0, 100, 50, 0, 0, 100, 50);
+ctx.drawImage(document.getElementById('red_5.png'), 0, 0, 100, 50, -100, 0, 100, 50);
+ctx.drawImage(document.getElementById('red_5.png'), 0, 0, 100, 50, 100, 0, 100, 50);
+ctx.drawImage(document.getElementById('red_5.png'), 0, 0, 100, 50, 0, -50, 100, 50);
+ctx.drawImage(document.getElementById('red_5.png'), 0, 0, 100, 50, 0, 50, 100, 50);
+isPixel(ctx, 0,0, 0,255,0,255, 2);
+isPixel(ctx, 99,0, 0,255,0,255, 2);
+isPixel(ctx, 0,49, 0,255,0,255, 2);
+isPixel(ctx, 99,49, 0,255,0,255, 2);
+
+
+}
+</script>
+<img src="image_red.png" id="red_5.png" class="resource">
+<img src="image_green.png" id="green_4.png" class="resource">
+
+<!-- [[[ test_2d.drawImage.9arg.destsize.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.9arg.destsize</p>
+<canvas id="c104" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_drawImage_9arg_destsize() {
+
+var canvas = document.getElementById('c104');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.drawImage(document.getElementById('green_5.png'), 1, 1, 1, 1, 0, 0, 100, 50);
+ctx.drawImage(document.getElementById('red_6.png'), 0, 0, 100, 50, -50, 0, 50, 50);
+ctx.drawImage(document.getElementById('red_6.png'), 0, 0, 100, 50, 100, 0, 50, 50);
+ctx.drawImage(document.getElementById('red_6.png'), 0, 0, 100, 50, 0, -25, 100, 25);
+ctx.drawImage(document.getElementById('red_6.png'), 0, 0, 100, 50, 0, 50, 100, 25);
+isPixel(ctx, 0,0, 0,255,0,255, 2);
+isPixel(ctx, 99,0, 0,255,0,255, 2);
+isPixel(ctx, 0,49, 0,255,0,255, 2);
+isPixel(ctx, 99,49, 0,255,0,255, 2);
+
+
+}
+</script>
+<img src="image_red.png" id="red_6.png" class="resource">
+<img src="image_green.png" id="green_5.png" class="resource">
+
+<!-- [[[ test_2d.drawImage.9arg.sourcepos.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.9arg.sourcepos</p>
+<canvas id="c105" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_drawImage_9arg_sourcepos() {
+
+var canvas = document.getElementById('c105');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.drawImage(document.getElementById('rgrg-256x256_1.png'), 140, 20, 100, 50, 0, 0, 100, 50);
+isPixel(ctx, 0,0, 0,255,0,255, 2);
+isPixel(ctx, 99,0, 0,255,0,255, 2);
+isPixel(ctx, 0,49, 0,255,0,255, 2);
+isPixel(ctx, 99,49, 0,255,0,255, 2);
+
+
+}
+</script>
+<img src="image_rgrg-256x256.png" id="rgrg-256x256_1.png" class="resource">
+
+<!-- [[[ test_2d.drawImage.9arg.sourcesize.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.9arg.sourcesize</p>
+<canvas id="c106" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_drawImage_9arg_sourcesize() {
+
+var canvas = document.getElementById('c106');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.drawImage(document.getElementById('rgrg-256x256_2.png'), 0, 0, 256, 256, 0, 0, 100, 50);
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 51, 26);
+ctx.fillRect(49, 24, 51, 26);
+isPixel(ctx, 0,0, 0,255,0,255, 3);
+isPixel(ctx, 99,0, 0,255,0,255, 3);
+isPixel(ctx, 0,49, 0,255,0,255, 3);
+isPixel(ctx, 99,49, 0,255,0,255, 3);
+isPixel(ctx, 20,20, 0,255,0,255, 3);
+isPixel(ctx, 80,20, 0,255,0,255, 3);
+isPixel(ctx, 20,30, 0,255,0,255, 3);
+isPixel(ctx, 80,30, 0,255,0,255, 3);
+
+
+}
+</script>
+<img src="image_rgrg-256x256.png" id="rgrg-256x256_2.png" class="resource">
+
+<!-- [[[ test_2d.drawImage.alpha.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.alpha</p>
+<canvas id="c107" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_drawImage_alpha() {
+
+var canvas = document.getElementById('c107');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalAlpha = 0;
+ctx.drawImage(document.getElementById('red_7.png'), 0, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 2);
+
+
+}
+</script>
+<img src="image_red.png" id="red_7.png" class="resource">
+
+<!-- [[[ test_2d.drawImage.animated.apng.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.animated.apng</p>
+<!-- Testing: drawImage() of an APNG with no poster frame draws the first frame -->
+<canvas id="c108" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function deferTest() {
+ _deferred = true;
+}
+function wrapFunction(f) {
+ return function () {
+ f.apply(null, arguments);
+ };
+}
+
+var canvas108 = document.getElementById('c108');
+var ctx108 = canvas108.getContext('2d');
+var isDone_test_2d_drawImage_animated_apng = false;
+
+function test_2d_drawImage_animated_apng() {
+
+deferTest();
+setTimeout(wrapFunction(function () {
+ ctx108.drawImage(document.getElementById('anim-gr_1.png'), 0, 0);
+ isPixel(ctx108, 50,25, 0,255,0,255, 2);
+ isDone_test_2d_drawImage_animated_apng = true;
+}), 5000);
+
+
+}
+</script>
+<img src="image_anim-gr.png" id="anim-gr_1.png" class="resource">
+
+<!-- [[[ test_2d.drawImage.animated.gif.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.animated.gif</p>
+<!-- Testing: drawImage() of an animated GIF draws the first frame -->
+<canvas id="c109" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+var canvas109 = document.getElementById('c109');
+var ctx109 = canvas109.getContext('2d');
+var isDone_test_2d_drawImage_animated_gif = false;
+
+function test_2d_drawImage_animated_gif() {
+
+deferTest();
+setTimeout(wrapFunction(function () {
+ ctx109.drawImage(document.getElementById('anim-gr_1.gif'), 0, 0);
+ isPixel(ctx109, 50,25, 0,255,0,255, 2);
+ isDone_test_2d_drawImage_animated_gif = true;
+}), 5000);
+
+
+}
+</script>
+<img src="image_anim-gr.gif" id="anim-gr_1.gif" class="resource">
+
+<!-- [[[ test_2d.drawImage.animated.poster.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.animated.poster</p>
+<!-- Testing: drawImage() of an APNG draws the poster frame -->
+<canvas id="c110" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+var canvas110 = document.getElementById('c110');
+var ctx110 = canvas110.getContext('2d');
+
+
+function test_2d_drawImage_animated_poster() {
+
+ctx110.drawImage(document.getElementById('anim-poster-gr_1.png'), 0, 0);
+todo_isPixel(ctx110, 50,25, 0,255,0,255, 2);
+
+
+}
+</script>
+<img src="image_anim-poster-gr.png" id="anim-poster-gr_1.png" class="resource">
+
+<!-- [[[ test_2d.drawImage.broken.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.broken</p>
+<canvas id="c111" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_drawImage_broken() {
+
+var canvas = document.getElementById('c111');
+var ctx = canvas.getContext('2d');
+
+var img = document.getElementById('broken_1.png');
+todo(img.complete === false, "img.complete === false");
+var _thrown = undefined; try {
+ ctx.drawImage(img, 0, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "InvalidStateError" && _thrown.code == DOMException.INVALID_STATE_ERR, "should throw InvalidStateError");
+
+
+}
+</script>
+<img src="image_broken.png" id="broken_1.png" class="resource">
+
+<!-- [[[ test_2d.drawImage.canvas.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.canvas</p>
+<canvas id="c112" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_drawImage_canvas() {
+
+var canvas = document.getElementById('c112');
+var ctx = canvas.getContext('2d');
+
+var canvas2 = document.createElement('canvas');
+canvas2.width = 100;
+canvas2.height = 50;
+var ctx2 = canvas2.getContext('2d');
+ctx2.fillStyle = '#0f0';
+ctx2.fillRect(0, 0, 100, 50);
+
+ctx.fillStyle = '#f00';
+ctx.drawImage(canvas2, 0, 0);
+
+isPixel(ctx, 0,0, 0,255,0,255, 2);
+isPixel(ctx, 99,0, 0,255,0,255, 2);
+isPixel(ctx, 0,49, 0,255,0,255, 2);
+isPixel(ctx, 99,49, 0,255,0,255, 2);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.drawImage.clip.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.clip</p>
+<canvas id="c113" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_drawImage_clip() {
+
+var canvas = document.getElementById('c113');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.rect(-10, -10, 1, 1);
+ctx.clip();
+ctx.drawImage(document.getElementById('red_8.png'), 0, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 2);
+
+
+}
+</script>
+<img src="image_red.png" id="red_8.png" class="resource">
+
+<!-- [[[ test_2d.drawImage.composite.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.composite</p>
+<canvas id="c114" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_drawImage_composite() {
+
+var canvas = document.getElementById('c114');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'destination-over';
+ctx.drawImage(document.getElementById('red_9.png'), 0, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 2);
+
+
+}
+</script>
+<img src="image_red.png" id="red_9.png" class="resource">
+
+<!-- [[[ test_2d.drawImage.floatsource.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.floatsource</p>
+<canvas id="c115" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_drawImage_floatsource() {
+
+var canvas = document.getElementById('c115');
+var ctx = canvas.getContext('2d');
+
+ctx.drawImage(document.getElementById('green_6.png'), 10.1, 10.1, 0.1, 0.1, 0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 2);
+
+
+}
+</script>
+<img src="image_green.png" id="green_6.png" class="resource">
+
+<!-- [[[ test_2d.drawImage.incomplete.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.incomplete</p>
+<canvas id="c116" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_drawImage_incomplete() {
+
+var canvas = document.getElementById('c116');
+var ctx = canvas.getContext('2d');
+
+var img = new Image();
+todo(img.complete === false, "img.complete === false");
+var _thrown = undefined; try {
+ ctx.drawImage(img, 0, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "InvalidStateError" && _thrown.code == DOMException.INVALID_STATE_ERR, "should throw InvalidStateError");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.drawImage.negativedest.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.negativedest</p>
+<canvas id="c117" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_drawImage_negativedest() {
+
+var canvas = document.getElementById('c117');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.drawImage(document.getElementById('ggrr-256x256_1.png'), 100, 78, 50, 50, 0, 50, 50, -50);
+ctx.drawImage(document.getElementById('ggrr-256x256_1.png'), 100, 128, 50, -50, 100, 50, -50, -50);
+isPixel(ctx, 1,1, 0,255,0,255, 2);
+isPixel(ctx, 1,48, 0,255,0,255, 2);
+isPixel(ctx, 98,1, 0,255,0,255, 2);
+isPixel(ctx, 98,48, 0,255,0,255, 2);
+isPixel(ctx, 48,1, 0,255,0,255, 2);
+isPixel(ctx, 48,48, 0,255,0,255, 2);
+isPixel(ctx, 51,1, 0,255,0,255, 2);
+isPixel(ctx, 51,48, 0,255,0,255, 2);
+isPixel(ctx, 25,25, 0,255,0,255, 2);
+isPixel(ctx, 75,25, 0,255,0,255, 2);
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, 'should not throw exception');
+
+
+}
+</script>
+<img src="image_ggrr-256x256.png" id="ggrr-256x256_1.png" class="resource">
+
+<!-- [[[ test_2d.drawImage.negativesource.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.negativesource</p>
+<canvas id="c118" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_drawImage_negativesource() {
+
+var canvas = document.getElementById('c118');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.drawImage(document.getElementById('ggrr-256x256_2.png'), 100, 78, -100, 50, 0, 0, 50, 50);
+ctx.drawImage(document.getElementById('ggrr-256x256_2.png'), 100, 128, -100, -50, 50, 0, 50, 50);
+isPixel(ctx, 1,1, 0,255,0,255, 2);
+isPixel(ctx, 1,48, 0,255,0,255, 2);
+isPixel(ctx, 98,1, 0,255,0,255, 2);
+isPixel(ctx, 98,48, 0,255,0,255, 2);
+isPixel(ctx, 48,1, 0,255,0,255, 2);
+isPixel(ctx, 48,48, 0,255,0,255, 2);
+isPixel(ctx, 51,1, 0,255,0,255, 2);
+isPixel(ctx, 51,48, 0,255,0,255, 2);
+isPixel(ctx, 25,25, 0,255,0,255, 2);
+isPixel(ctx, 75,25, 0,255,0,255, 2);
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, 'should not throw exception');
+
+
+}
+</script>
+<img src="image_ggrr-256x256.png" id="ggrr-256x256_2.png" class="resource">
+
+<!-- [[[ test_2d.drawImage.nonfinite.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.nonfinite</p>
+<!-- Testing: drawImage() with Infinity/NaN is ignored -->
+<canvas id="c119" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_drawImage_nonfinite() {
+
+var canvas = document.getElementById('c119');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+
+try {
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+var red = document.getElementById('red_10.png');
+ctx.drawImage(red, Infinity, 0);
+ctx.drawImage(red, -Infinity, 0);
+ctx.drawImage(red, NaN, 0);
+ctx.drawImage(red, 0, Infinity);
+ctx.drawImage(red, 0, -Infinity);
+ctx.drawImage(red, 0, NaN);
+ctx.drawImage(red, Infinity, Infinity);
+ctx.drawImage(red, Infinity, 0, 100, 50);
+ctx.drawImage(red, -Infinity, 0, 100, 50);
+ctx.drawImage(red, NaN, 0, 100, 50);
+ctx.drawImage(red, 0, Infinity, 100, 50);
+ctx.drawImage(red, 0, -Infinity, 100, 50);
+ctx.drawImage(red, 0, NaN, 100, 50);
+ctx.drawImage(red, 0, 0, Infinity, 50);
+ctx.drawImage(red, 0, 0, -Infinity, 50);
+ctx.drawImage(red, 0, 0, NaN, 50);
+ctx.drawImage(red, 0, 0, 100, Infinity);
+ctx.drawImage(red, 0, 0, 100, -Infinity);
+ctx.drawImage(red, 0, 0, 100, NaN);
+ctx.drawImage(red, Infinity, Infinity, 100, 50);
+ctx.drawImage(red, Infinity, Infinity, Infinity, 50);
+ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity);
+ctx.drawImage(red, Infinity, Infinity, 100, Infinity);
+ctx.drawImage(red, Infinity, 0, Infinity, 50);
+ctx.drawImage(red, Infinity, 0, Infinity, Infinity);
+ctx.drawImage(red, Infinity, 0, 100, Infinity);
+ctx.drawImage(red, 0, Infinity, Infinity, 50);
+ctx.drawImage(red, 0, Infinity, Infinity, Infinity);
+ctx.drawImage(red, 0, Infinity, 100, Infinity);
+ctx.drawImage(red, 0, 0, Infinity, Infinity);
+ctx.drawImage(red, Infinity, 0, 100, 50, 0, 0, 100, 50);
+ctx.drawImage(red, -Infinity, 0, 100, 50, 0, 0, 100, 50);
+ctx.drawImage(red, NaN, 0, 100, 50, 0, 0, 100, 50);
+ctx.drawImage(red, 0, Infinity, 100, 50, 0, 0, 100, 50);
+ctx.drawImage(red, 0, -Infinity, 100, 50, 0, 0, 100, 50);
+ctx.drawImage(red, 0, NaN, 100, 50, 0, 0, 100, 50);
+ctx.drawImage(red, 0, 0, Infinity, 50, 0, 0, 100, 50);
+ctx.drawImage(red, 0, 0, -Infinity, 50, 0, 0, 100, 50);
+ctx.drawImage(red, 0, 0, NaN, 50, 0, 0, 100, 50);
+ctx.drawImage(red, 0, 0, 100, Infinity, 0, 0, 100, 50);
+ctx.drawImage(red, 0, 0, 100, -Infinity, 0, 0, 100, 50);
+ctx.drawImage(red, 0, 0, 100, NaN, 0, 0, 100, 50);
+ctx.drawImage(red, 0, 0, 100, 50, Infinity, 0, 100, 50);
+ctx.drawImage(red, 0, 0, 100, 50, -Infinity, 0, 100, 50);
+ctx.drawImage(red, 0, 0, 100, 50, NaN, 0, 100, 50);
+ctx.drawImage(red, 0, 0, 100, 50, 0, Infinity, 100, 50);
+ctx.drawImage(red, 0, 0, 100, 50, 0, -Infinity, 100, 50);
+ctx.drawImage(red, 0, 0, 100, 50, 0, NaN, 100, 50);
+ctx.drawImage(red, 0, 0, 100, 50, 0, 0, Infinity, 50);
+ctx.drawImage(red, 0, 0, 100, 50, 0, 0, -Infinity, 50);
+ctx.drawImage(red, 0, 0, 100, 50, 0, 0, NaN, 50);
+ctx.drawImage(red, 0, 0, 100, 50, 0, 0, 100, Infinity);
+ctx.drawImage(red, 0, 0, 100, 50, 0, 0, 100, -Infinity);
+ctx.drawImage(red, 0, 0, 100, 50, 0, 0, 100, NaN);
+ctx.drawImage(red, Infinity, Infinity, 100, 50, 0, 0, 100, 50);
+ctx.drawImage(red, Infinity, Infinity, Infinity, 50, 0, 0, 100, 50);
+ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, 0, 0, 100, 50);
+ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, Infinity, 0, 100, 50);
+ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity, 100, 50);
+ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity, 50);
+ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity);
+ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity, 100, Infinity);
+ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, Infinity, 0, Infinity, 50);
+ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, Infinity, 0, Infinity, Infinity);
+ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, Infinity, 0, 100, Infinity);
+ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, 0, Infinity, 100, 50);
+ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, 0, Infinity, Infinity, 50);
+ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, 0, Infinity, Infinity, Infinity);
+ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, 0, Infinity, 100, Infinity);
+ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, 0, 0, Infinity, 50);
+ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, 0, 0, Infinity, Infinity);
+ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, 0, 0, 100, Infinity);
+ctx.drawImage(red, Infinity, Infinity, Infinity, 50, Infinity, 0, 100, 50);
+ctx.drawImage(red, Infinity, Infinity, Infinity, 50, Infinity, Infinity, 100, 50);
+ctx.drawImage(red, Infinity, Infinity, Infinity, 50, Infinity, Infinity, Infinity, 50);
+ctx.drawImage(red, Infinity, Infinity, Infinity, 50, Infinity, Infinity, Infinity, Infinity);
+ctx.drawImage(red, Infinity, Infinity, Infinity, 50, Infinity, Infinity, 100, Infinity);
+ctx.drawImage(red, Infinity, Infinity, Infinity, 50, Infinity, 0, Infinity, 50);
+ctx.drawImage(red, Infinity, Infinity, Infinity, 50, Infinity, 0, Infinity, Infinity);
+ctx.drawImage(red, Infinity, Infinity, Infinity, 50, Infinity, 0, 100, Infinity);
+ctx.drawImage(red, Infinity, Infinity, Infinity, 50, 0, Infinity, 100, 50);
+ctx.drawImage(red, Infinity, Infinity, Infinity, 50, 0, Infinity, Infinity, 50);
+ctx.drawImage(red, Infinity, Infinity, Infinity, 50, 0, Infinity, Infinity, Infinity);
+ctx.drawImage(red, Infinity, Infinity, Infinity, 50, 0, Infinity, 100, Infinity);
+ctx.drawImage(red, Infinity, Infinity, Infinity, 50, 0, 0, Infinity, 50);
+ctx.drawImage(red, Infinity, Infinity, Infinity, 50, 0, 0, Infinity, Infinity);
+ctx.drawImage(red, Infinity, Infinity, Infinity, 50, 0, 0, 100, Infinity);
+ctx.drawImage(red, Infinity, Infinity, 100, Infinity, 0, 0, 100, 50);
+ctx.drawImage(red, Infinity, Infinity, 100, Infinity, Infinity, 0, 100, 50);
+ctx.drawImage(red, Infinity, Infinity, 100, Infinity, Infinity, Infinity, 100, 50);
+ctx.drawImage(red, Infinity, Infinity, 100, Infinity, Infinity, Infinity, Infinity, 50);
+ctx.drawImage(red, Infinity, Infinity, 100, Infinity, Infinity, Infinity, Infinity, Infinity);
+ctx.drawImage(red, Infinity, Infinity, 100, Infinity, Infinity, Infinity, 100, Infinity);
+ctx.drawImage(red, Infinity, Infinity, 100, Infinity, Infinity, 0, Infinity, 50);
+ctx.drawImage(red, Infinity, Infinity, 100, Infinity, Infinity, 0, Infinity, Infinity);
+ctx.drawImage(red, Infinity, Infinity, 100, Infinity, Infinity, 0, 100, Infinity);
+ctx.drawImage(red, Infinity, Infinity, 100, Infinity, 0, Infinity, 100, 50);
+ctx.drawImage(red, Infinity, Infinity, 100, Infinity, 0, Infinity, Infinity, 50);
+ctx.drawImage(red, Infinity, Infinity, 100, Infinity, 0, Infinity, Infinity, Infinity);
+ctx.drawImage(red, Infinity, Infinity, 100, Infinity, 0, Infinity, 100, Infinity);
+ctx.drawImage(red, Infinity, Infinity, 100, Infinity, 0, 0, Infinity, 50);
+ctx.drawImage(red, Infinity, Infinity, 100, Infinity, 0, 0, Infinity, Infinity);
+ctx.drawImage(red, Infinity, Infinity, 100, Infinity, 0, 0, 100, Infinity);
+ctx.drawImage(red, Infinity, Infinity, 100, 50, Infinity, 0, 100, 50);
+ctx.drawImage(red, Infinity, Infinity, 100, 50, Infinity, Infinity, 100, 50);
+ctx.drawImage(red, Infinity, Infinity, 100, 50, Infinity, Infinity, Infinity, 50);
+ctx.drawImage(red, Infinity, Infinity, 100, 50, Infinity, Infinity, Infinity, Infinity);
+ctx.drawImage(red, Infinity, Infinity, 100, 50, Infinity, Infinity, 100, Infinity);
+ctx.drawImage(red, Infinity, Infinity, 100, 50, Infinity, 0, Infinity, 50);
+ctx.drawImage(red, Infinity, Infinity, 100, 50, Infinity, 0, Infinity, Infinity);
+ctx.drawImage(red, Infinity, Infinity, 100, 50, Infinity, 0, 100, Infinity);
+ctx.drawImage(red, Infinity, Infinity, 100, 50, 0, Infinity, 100, 50);
+ctx.drawImage(red, Infinity, Infinity, 100, 50, 0, Infinity, Infinity, 50);
+ctx.drawImage(red, Infinity, Infinity, 100, 50, 0, Infinity, Infinity, Infinity);
+ctx.drawImage(red, Infinity, Infinity, 100, 50, 0, Infinity, 100, Infinity);
+ctx.drawImage(red, Infinity, Infinity, 100, 50, 0, 0, Infinity, 50);
+ctx.drawImage(red, Infinity, Infinity, 100, 50, 0, 0, Infinity, Infinity);
+ctx.drawImage(red, Infinity, Infinity, 100, 50, 0, 0, 100, Infinity);
+ctx.drawImage(red, Infinity, 0, Infinity, 50, 0, 0, 100, 50);
+ctx.drawImage(red, Infinity, 0, Infinity, Infinity, 0, 0, 100, 50);
+ctx.drawImage(red, Infinity, 0, Infinity, Infinity, Infinity, 0, 100, 50);
+ctx.drawImage(red, Infinity, 0, Infinity, Infinity, Infinity, Infinity, 100, 50);
+ctx.drawImage(red, Infinity, 0, Infinity, Infinity, Infinity, Infinity, Infinity, 50);
+ctx.drawImage(red, Infinity, 0, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity);
+ctx.drawImage(red, Infinity, 0, Infinity, Infinity, Infinity, Infinity, 100, Infinity);
+ctx.drawImage(red, Infinity, 0, Infinity, Infinity, Infinity, 0, Infinity, 50);
+ctx.drawImage(red, Infinity, 0, Infinity, Infinity, Infinity, 0, Infinity, Infinity);
+ctx.drawImage(red, Infinity, 0, Infinity, Infinity, Infinity, 0, 100, Infinity);
+ctx.drawImage(red, Infinity, 0, Infinity, Infinity, 0, Infinity, 100, 50);
+ctx.drawImage(red, Infinity, 0, Infinity, Infinity, 0, Infinity, Infinity, 50);
+ctx.drawImage(red, Infinity, 0, Infinity, Infinity, 0, Infinity, Infinity, Infinity);
+ctx.drawImage(red, Infinity, 0, Infinity, Infinity, 0, Infinity, 100, Infinity);
+ctx.drawImage(red, Infinity, 0, Infinity, Infinity, 0, 0, Infinity, 50);
+ctx.drawImage(red, Infinity, 0, Infinity, Infinity, 0, 0, Infinity, Infinity);
+ctx.drawImage(red, Infinity, 0, Infinity, Infinity, 0, 0, 100, Infinity);
+ctx.drawImage(red, Infinity, 0, Infinity, 50, Infinity, 0, 100, 50);
+ctx.drawImage(red, Infinity, 0, Infinity, 50, Infinity, Infinity, 100, 50);
+ctx.drawImage(red, Infinity, 0, Infinity, 50, Infinity, Infinity, Infinity, 50);
+ctx.drawImage(red, Infinity, 0, Infinity, 50, Infinity, Infinity, Infinity, Infinity);
+ctx.drawImage(red, Infinity, 0, Infinity, 50, Infinity, Infinity, 100, Infinity);
+ctx.drawImage(red, Infinity, 0, Infinity, 50, Infinity, 0, Infinity, 50);
+ctx.drawImage(red, Infinity, 0, Infinity, 50, Infinity, 0, Infinity, Infinity);
+ctx.drawImage(red, Infinity, 0, Infinity, 50, Infinity, 0, 100, Infinity);
+ctx.drawImage(red, Infinity, 0, Infinity, 50, 0, Infinity, 100, 50);
+ctx.drawImage(red, Infinity, 0, Infinity, 50, 0, Infinity, Infinity, 50);
+ctx.drawImage(red, Infinity, 0, Infinity, 50, 0, Infinity, Infinity, Infinity);
+ctx.drawImage(red, Infinity, 0, Infinity, 50, 0, Infinity, 100, Infinity);
+ctx.drawImage(red, Infinity, 0, Infinity, 50, 0, 0, Infinity, 50);
+ctx.drawImage(red, Infinity, 0, Infinity, 50, 0, 0, Infinity, Infinity);
+ctx.drawImage(red, Infinity, 0, Infinity, 50, 0, 0, 100, Infinity);
+ctx.drawImage(red, Infinity, 0, 100, Infinity, 0, 0, 100, 50);
+ctx.drawImage(red, Infinity, 0, 100, Infinity, Infinity, 0, 100, 50);
+ctx.drawImage(red, Infinity, 0, 100, Infinity, Infinity, Infinity, 100, 50);
+ctx.drawImage(red, Infinity, 0, 100, Infinity, Infinity, Infinity, Infinity, 50);
+ctx.drawImage(red, Infinity, 0, 100, Infinity, Infinity, Infinity, Infinity, Infinity);
+ctx.drawImage(red, Infinity, 0, 100, Infinity, Infinity, Infinity, 100, Infinity);
+ctx.drawImage(red, Infinity, 0, 100, Infinity, Infinity, 0, Infinity, 50);
+ctx.drawImage(red, Infinity, 0, 100, Infinity, Infinity, 0, Infinity, Infinity);
+ctx.drawImage(red, Infinity, 0, 100, Infinity, Infinity, 0, 100, Infinity);
+ctx.drawImage(red, Infinity, 0, 100, Infinity, 0, Infinity, 100, 50);
+ctx.drawImage(red, Infinity, 0, 100, Infinity, 0, Infinity, Infinity, 50);
+ctx.drawImage(red, Infinity, 0, 100, Infinity, 0, Infinity, Infinity, Infinity);
+ctx.drawImage(red, Infinity, 0, 100, Infinity, 0, Infinity, 100, Infinity);
+ctx.drawImage(red, Infinity, 0, 100, Infinity, 0, 0, Infinity, 50);
+ctx.drawImage(red, Infinity, 0, 100, Infinity, 0, 0, Infinity, Infinity);
+ctx.drawImage(red, Infinity, 0, 100, Infinity, 0, 0, 100, Infinity);
+ctx.drawImage(red, Infinity, 0, 100, 50, Infinity, 0, 100, 50);
+ctx.drawImage(red, Infinity, 0, 100, 50, Infinity, Infinity, 100, 50);
+ctx.drawImage(red, Infinity, 0, 100, 50, Infinity, Infinity, Infinity, 50);
+ctx.drawImage(red, Infinity, 0, 100, 50, Infinity, Infinity, Infinity, Infinity);
+ctx.drawImage(red, Infinity, 0, 100, 50, Infinity, Infinity, 100, Infinity);
+ctx.drawImage(red, Infinity, 0, 100, 50, Infinity, 0, Infinity, 50);
+ctx.drawImage(red, Infinity, 0, 100, 50, Infinity, 0, Infinity, Infinity);
+ctx.drawImage(red, Infinity, 0, 100, 50, Infinity, 0, 100, Infinity);
+ctx.drawImage(red, Infinity, 0, 100, 50, 0, Infinity, 100, 50);
+ctx.drawImage(red, Infinity, 0, 100, 50, 0, Infinity, Infinity, 50);
+ctx.drawImage(red, Infinity, 0, 100, 50, 0, Infinity, Infinity, Infinity);
+ctx.drawImage(red, Infinity, 0, 100, 50, 0, Infinity, 100, Infinity);
+ctx.drawImage(red, Infinity, 0, 100, 50, 0, 0, Infinity, 50);
+ctx.drawImage(red, Infinity, 0, 100, 50, 0, 0, Infinity, Infinity);
+ctx.drawImage(red, Infinity, 0, 100, 50, 0, 0, 100, Infinity);
+ctx.drawImage(red, 0, Infinity, Infinity, 50, 0, 0, 100, 50);
+ctx.drawImage(red, 0, Infinity, Infinity, Infinity, 0, 0, 100, 50);
+ctx.drawImage(red, 0, Infinity, Infinity, Infinity, Infinity, 0, 100, 50);
+ctx.drawImage(red, 0, Infinity, Infinity, Infinity, Infinity, Infinity, 100, 50);
+ctx.drawImage(red, 0, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity, 50);
+ctx.drawImage(red, 0, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity);
+ctx.drawImage(red, 0, Infinity, Infinity, Infinity, Infinity, Infinity, 100, Infinity);
+ctx.drawImage(red, 0, Infinity, Infinity, Infinity, Infinity, 0, Infinity, 50);
+ctx.drawImage(red, 0, Infinity, Infinity, Infinity, Infinity, 0, Infinity, Infinity);
+ctx.drawImage(red, 0, Infinity, Infinity, Infinity, Infinity, 0, 100, Infinity);
+ctx.drawImage(red, 0, Infinity, Infinity, Infinity, 0, Infinity, 100, 50);
+ctx.drawImage(red, 0, Infinity, Infinity, Infinity, 0, Infinity, Infinity, 50);
+ctx.drawImage(red, 0, Infinity, Infinity, Infinity, 0, Infinity, Infinity, Infinity);
+ctx.drawImage(red, 0, Infinity, Infinity, Infinity, 0, Infinity, 100, Infinity);
+ctx.drawImage(red, 0, Infinity, Infinity, Infinity, 0, 0, Infinity, 50);
+ctx.drawImage(red, 0, Infinity, Infinity, Infinity, 0, 0, Infinity, Infinity);
+ctx.drawImage(red, 0, Infinity, Infinity, Infinity, 0, 0, 100, Infinity);
+ctx.drawImage(red, 0, Infinity, Infinity, 50, Infinity, 0, 100, 50);
+ctx.drawImage(red, 0, Infinity, Infinity, 50, Infinity, Infinity, 100, 50);
+ctx.drawImage(red, 0, Infinity, Infinity, 50, Infinity, Infinity, Infinity, 50);
+ctx.drawImage(red, 0, Infinity, Infinity, 50, Infinity, Infinity, Infinity, Infinity);
+ctx.drawImage(red, 0, Infinity, Infinity, 50, Infinity, Infinity, 100, Infinity);
+ctx.drawImage(red, 0, Infinity, Infinity, 50, Infinity, 0, Infinity, 50);
+ctx.drawImage(red, 0, Infinity, Infinity, 50, Infinity, 0, Infinity, Infinity);
+ctx.drawImage(red, 0, Infinity, Infinity, 50, Infinity, 0, 100, Infinity);
+ctx.drawImage(red, 0, Infinity, Infinity, 50, 0, Infinity, 100, 50);
+ctx.drawImage(red, 0, Infinity, Infinity, 50, 0, Infinity, Infinity, 50);
+ctx.drawImage(red, 0, Infinity, Infinity, 50, 0, Infinity, Infinity, Infinity);
+ctx.drawImage(red, 0, Infinity, Infinity, 50, 0, Infinity, 100, Infinity);
+ctx.drawImage(red, 0, Infinity, Infinity, 50, 0, 0, Infinity, 50);
+ctx.drawImage(red, 0, Infinity, Infinity, 50, 0, 0, Infinity, Infinity);
+ctx.drawImage(red, 0, Infinity, Infinity, 50, 0, 0, 100, Infinity);
+ctx.drawImage(red, 0, Infinity, 100, Infinity, 0, 0, 100, 50);
+ctx.drawImage(red, 0, Infinity, 100, Infinity, Infinity, 0, 100, 50);
+ctx.drawImage(red, 0, Infinity, 100, Infinity, Infinity, Infinity, 100, 50);
+ctx.drawImage(red, 0, Infinity, 100, Infinity, Infinity, Infinity, Infinity, 50);
+ctx.drawImage(red, 0, Infinity, 100, Infinity, Infinity, Infinity, Infinity, Infinity);
+ctx.drawImage(red, 0, Infinity, 100, Infinity, Infinity, Infinity, 100, Infinity);
+ctx.drawImage(red, 0, Infinity, 100, Infinity, Infinity, 0, Infinity, 50);
+ctx.drawImage(red, 0, Infinity, 100, Infinity, Infinity, 0, Infinity, Infinity);
+ctx.drawImage(red, 0, Infinity, 100, Infinity, Infinity, 0, 100, Infinity);
+ctx.drawImage(red, 0, Infinity, 100, Infinity, 0, Infinity, 100, 50);
+ctx.drawImage(red, 0, Infinity, 100, Infinity, 0, Infinity, Infinity, 50);
+ctx.drawImage(red, 0, Infinity, 100, Infinity, 0, Infinity, Infinity, Infinity);
+ctx.drawImage(red, 0, Infinity, 100, Infinity, 0, Infinity, 100, Infinity);
+ctx.drawImage(red, 0, Infinity, 100, Infinity, 0, 0, Infinity, 50);
+ctx.drawImage(red, 0, Infinity, 100, Infinity, 0, 0, Infinity, Infinity);
+ctx.drawImage(red, 0, Infinity, 100, Infinity, 0, 0, 100, Infinity);
+ctx.drawImage(red, 0, Infinity, 100, 50, Infinity, 0, 100, 50);
+ctx.drawImage(red, 0, Infinity, 100, 50, Infinity, Infinity, 100, 50);
+ctx.drawImage(red, 0, Infinity, 100, 50, Infinity, Infinity, Infinity, 50);
+ctx.drawImage(red, 0, Infinity, 100, 50, Infinity, Infinity, Infinity, Infinity);
+ctx.drawImage(red, 0, Infinity, 100, 50, Infinity, Infinity, 100, Infinity);
+ctx.drawImage(red, 0, Infinity, 100, 50, Infinity, 0, Infinity, 50);
+ctx.drawImage(red, 0, Infinity, 100, 50, Infinity, 0, Infinity, Infinity);
+ctx.drawImage(red, 0, Infinity, 100, 50, Infinity, 0, 100, Infinity);
+ctx.drawImage(red, 0, Infinity, 100, 50, 0, Infinity, 100, 50);
+ctx.drawImage(red, 0, Infinity, 100, 50, 0, Infinity, Infinity, 50);
+ctx.drawImage(red, 0, Infinity, 100, 50, 0, Infinity, Infinity, Infinity);
+ctx.drawImage(red, 0, Infinity, 100, 50, 0, Infinity, 100, Infinity);
+ctx.drawImage(red, 0, Infinity, 100, 50, 0, 0, Infinity, 50);
+ctx.drawImage(red, 0, Infinity, 100, 50, 0, 0, Infinity, Infinity);
+ctx.drawImage(red, 0, Infinity, 100, 50, 0, 0, 100, Infinity);
+ctx.drawImage(red, 0, 0, Infinity, Infinity, 0, 0, 100, 50);
+ctx.drawImage(red, 0, 0, Infinity, Infinity, Infinity, 0, 100, 50);
+ctx.drawImage(red, 0, 0, Infinity, Infinity, Infinity, Infinity, 100, 50);
+ctx.drawImage(red, 0, 0, Infinity, Infinity, Infinity, Infinity, Infinity, 50);
+ctx.drawImage(red, 0, 0, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity);
+ctx.drawImage(red, 0, 0, Infinity, Infinity, Infinity, Infinity, 100, Infinity);
+ctx.drawImage(red, 0, 0, Infinity, Infinity, Infinity, 0, Infinity, 50);
+ctx.drawImage(red, 0, 0, Infinity, Infinity, Infinity, 0, Infinity, Infinity);
+ctx.drawImage(red, 0, 0, Infinity, Infinity, Infinity, 0, 100, Infinity);
+ctx.drawImage(red, 0, 0, Infinity, Infinity, 0, Infinity, 100, 50);
+ctx.drawImage(red, 0, 0, Infinity, Infinity, 0, Infinity, Infinity, 50);
+ctx.drawImage(red, 0, 0, Infinity, Infinity, 0, Infinity, Infinity, Infinity);
+ctx.drawImage(red, 0, 0, Infinity, Infinity, 0, Infinity, 100, Infinity);
+ctx.drawImage(red, 0, 0, Infinity, Infinity, 0, 0, Infinity, 50);
+ctx.drawImage(red, 0, 0, Infinity, Infinity, 0, 0, Infinity, Infinity);
+ctx.drawImage(red, 0, 0, Infinity, Infinity, 0, 0, 100, Infinity);
+ctx.drawImage(red, 0, 0, Infinity, 50, Infinity, 0, 100, 50);
+ctx.drawImage(red, 0, 0, Infinity, 50, Infinity, Infinity, 100, 50);
+ctx.drawImage(red, 0, 0, Infinity, 50, Infinity, Infinity, Infinity, 50);
+ctx.drawImage(red, 0, 0, Infinity, 50, Infinity, Infinity, Infinity, Infinity);
+ctx.drawImage(red, 0, 0, Infinity, 50, Infinity, Infinity, 100, Infinity);
+ctx.drawImage(red, 0, 0, Infinity, 50, Infinity, 0, Infinity, 50);
+ctx.drawImage(red, 0, 0, Infinity, 50, Infinity, 0, Infinity, Infinity);
+ctx.drawImage(red, 0, 0, Infinity, 50, Infinity, 0, 100, Infinity);
+ctx.drawImage(red, 0, 0, Infinity, 50, 0, Infinity, 100, 50);
+ctx.drawImage(red, 0, 0, Infinity, 50, 0, Infinity, Infinity, 50);
+ctx.drawImage(red, 0, 0, Infinity, 50, 0, Infinity, Infinity, Infinity);
+ctx.drawImage(red, 0, 0, Infinity, 50, 0, Infinity, 100, Infinity);
+ctx.drawImage(red, 0, 0, Infinity, 50, 0, 0, Infinity, 50);
+ctx.drawImage(red, 0, 0, Infinity, 50, 0, 0, Infinity, Infinity);
+ctx.drawImage(red, 0, 0, Infinity, 50, 0, 0, 100, Infinity);
+ctx.drawImage(red, 0, 0, 100, Infinity, Infinity, 0, 100, 50);
+ctx.drawImage(red, 0, 0, 100, Infinity, Infinity, Infinity, 100, 50);
+ctx.drawImage(red, 0, 0, 100, Infinity, Infinity, Infinity, Infinity, 50);
+ctx.drawImage(red, 0, 0, 100, Infinity, Infinity, Infinity, Infinity, Infinity);
+ctx.drawImage(red, 0, 0, 100, Infinity, Infinity, Infinity, 100, Infinity);
+ctx.drawImage(red, 0, 0, 100, Infinity, Infinity, 0, Infinity, 50);
+ctx.drawImage(red, 0, 0, 100, Infinity, Infinity, 0, Infinity, Infinity);
+ctx.drawImage(red, 0, 0, 100, Infinity, Infinity, 0, 100, Infinity);
+ctx.drawImage(red, 0, 0, 100, Infinity, 0, Infinity, 100, 50);
+ctx.drawImage(red, 0, 0, 100, Infinity, 0, Infinity, Infinity, 50);
+ctx.drawImage(red, 0, 0, 100, Infinity, 0, Infinity, Infinity, Infinity);
+ctx.drawImage(red, 0, 0, 100, Infinity, 0, Infinity, 100, Infinity);
+ctx.drawImage(red, 0, 0, 100, Infinity, 0, 0, Infinity, 50);
+ctx.drawImage(red, 0, 0, 100, Infinity, 0, 0, Infinity, Infinity);
+ctx.drawImage(red, 0, 0, 100, Infinity, 0, 0, 100, Infinity);
+ctx.drawImage(red, 0, 0, 100, 50, Infinity, Infinity, 100, 50);
+ctx.drawImage(red, 0, 0, 100, 50, Infinity, Infinity, Infinity, 50);
+ctx.drawImage(red, 0, 0, 100, 50, Infinity, Infinity, Infinity, Infinity);
+ctx.drawImage(red, 0, 0, 100, 50, Infinity, Infinity, 100, Infinity);
+ctx.drawImage(red, 0, 0, 100, 50, Infinity, 0, Infinity, 50);
+ctx.drawImage(red, 0, 0, 100, 50, Infinity, 0, Infinity, Infinity);
+ctx.drawImage(red, 0, 0, 100, 50, Infinity, 0, 100, Infinity);
+ctx.drawImage(red, 0, 0, 100, 50, 0, Infinity, Infinity, 50);
+ctx.drawImage(red, 0, 0, 100, 50, 0, Infinity, Infinity, Infinity);
+ctx.drawImage(red, 0, 0, 100, 50, 0, Infinity, 100, Infinity);
+ctx.drawImage(red, 0, 0, 100, 50, 0, 0, Infinity, Infinity);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, 'should not throw exception');
+
+
+}
+</script>
+<img src="image_red.png" id="red_10.png" class="resource">
+
+<!-- [[[ test_2d.drawImage.nowrap.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.nowrap</p>
+<!-- Testing: Stretched images do not get pixels wrapping around the edges -->
+<canvas id="c120" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_drawImage_nowrap() {
+
+var canvas = document.getElementById('c120');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.drawImage(document.getElementById('redtransparent_1.png'), -1950, 0, 2000, 50);
+isPixel(ctx, 45,25, 0,255,0,255, 2);
+isPixel(ctx, 50,25, 0,255,0,255, 2);
+isPixel(ctx, 55,25, 0,255,0,255, 2);
+
+
+}
+</script>
+<img src="image_redtransparent.png" id="redtransparent_1.png" class="resource">
+
+<!-- [[[ test_2d.drawImage.null.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.null</p>
+<canvas id="c121" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_drawImage_null() {
+
+var canvas = document.getElementById('c121');
+var ctx = canvas.getContext('2d');
+
+var _thrown = undefined; try {
+ ctx.drawImage(null, 0, 0);
+} catch (e) { _thrown = e };
+
+ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
+
+}
+</script>
+
+<!-- [[[ test_2d.drawImage.path.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.path</p>
+<canvas id="c123" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_drawImage_path() {
+
+var canvas = document.getElementById('c123');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.rect(0, 0, 100, 50);
+ctx.drawImage(document.getElementById('red_12.png'), 0, 0);
+ctx.fill();
+isPixel(ctx, 50,25, 0,255,0,255, 2);
+
+
+}
+</script>
+<img src="image_red.png" id="red_12.png" class="resource">
+
+<!-- [[[ test_2d.drawImage.self.1.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.self.1 - bug 433235</p>
+<canvas id="c124" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_drawImage_self_1() {
+
+var canvas = document.getElementById('c124');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 50, 50);
+ctx.fillStyle = '#f00';
+ctx.fillRect(50, 0, 50, 50);
+ctx.drawImage(canvas, 50, 0);
+
+isPixel(ctx, 0,0, 0,255,0,255, 2);
+isPixel(ctx, 99,0, 0,255,0,255, 2);
+isPixel(ctx, 0,49, 0,255,0,255, 2);
+isPixel(ctx, 99,49, 0,255,0,255, 2);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.drawImage.self.2.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.self.2 - bug 433235</p>
+<canvas id="c125" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_drawImage_self_2() {
+
+var canvas = document.getElementById('c125');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 1, 100, 49);
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 1);
+ctx.drawImage(canvas, 0, 1);
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 2);
+
+isPixel(ctx, 0,0, 0,255,0,255, 2);
+isPixel(ctx, 99,0, 0,255,0,255, 2);
+isPixel(ctx, 0,49, 0,255,0,255, 2);
+isPixel(ctx, 99,49, 0,255,0,255, 2);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.drawImage.transform.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.transform</p>
+<canvas id="c126" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_drawImage_transform() {
+
+var canvas = document.getElementById('c126');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.translate(100, 0);
+ctx.drawImage(document.getElementById('red_13.png'), 0, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 2);
+
+
+}
+</script>
+<img src="image_red.png" id="red_13.png" class="resource">
+
+<!-- [[[ test_2d.drawImage.wrongtype.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.wrongtype</p>
+<canvas id="c127" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_drawImage_wrongtype() {
+
+var canvas = document.getElementById('c127');
+var ctx = canvas.getContext('2d');
+
+var _thrown = undefined; try {
+ ctx.drawImage(undefined, 0, 0);
+} catch (e) { _thrown = e };
+ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
+
+var _thrown = undefined; try {
+ ctx.drawImage(0, 0, 0);
+} catch (e) { _thrown = e };
+ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
+
+var _thrown = undefined; try {
+ ctx.drawImage("", 0, 0);
+} catch (e) { _thrown = e };
+ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
+
+var _thrown = undefined; try {
+ ctx.drawImage(document.createElement('p'), 0, 0);
+} catch (e) { _thrown = e };
+ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
+
+}
+</script>
+
+<!-- [[[ test_2d.drawImage.zerosource.html ]]] -->
+
+<p>Canvas test: 2d.drawImage.zerosource</p>
+<!-- Testing: drawImage with zero-sized source rectangle does nothing -->
+<canvas id="c128" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_drawImage_zerosource() {
+
+var canvas = document.getElementById('c128');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.drawImage(document.getElementById('red_14.png'), 10, 10, 0, 1, 0, 0, 100, 50);
+ctx.drawImage(document.getElementById('red_14.png'), 10, 10, 1, 0, 0, 0, 100, 50);
+ctx.drawImage(document.getElementById('red_14.png'), 10, 10, 0, 0, 0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 2);
+
+
+}
+</script>
+<img src="image_red.png" id="red_14.png" class="resource">
+
+<!-- [[[ test_2d.fillRect.basic.html ]]] -->
+
+<p>Canvas test: 2d.fillRect.basic</p>
+<canvas id="c129" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillRect_basic() {
+
+var canvas = document.getElementById('c129');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillRect.clip.html ]]] -->
+
+<p>Canvas test: 2d.fillRect.clip</p>
+<canvas id="c130" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillRect_clip() {
+
+var canvas = document.getElementById('c130');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.beginPath();
+ctx.rect(0, 0, 16, 16);
+ctx.clip();
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 16, 16);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillRect.negative.html ]]] -->
+
+<p>Canvas test: 2d.fillRect.negative</p>
+<canvas id="c131" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillRect_negative() {
+
+var canvas = document.getElementById('c131');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 50, 25);
+ctx.fillRect(100, 0, -50, 25);
+ctx.fillRect(0, 50, 50, -25);
+ctx.fillRect(100, 50, -50, -25);
+isPixel(ctx, 25,12, 0,255,0,255, 0);
+isPixel(ctx, 75,12, 0,255,0,255, 0);
+isPixel(ctx, 25,37, 0,255,0,255, 0);
+isPixel(ctx, 75,37, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillRect.nonfinite.html ]]] -->
+
+<p>Canvas test: 2d.fillRect.nonfinite</p>
+<!-- Testing: fillRect() with Infinity/NaN is ignored -->
+<canvas id="c132" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillRect_nonfinite() {
+
+var canvas = document.getElementById('c132');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(Infinity, 0, 100, 50);
+ctx.fillRect(-Infinity, 0, 100, 50);
+ctx.fillRect(NaN, 0, 100, 50);
+ctx.fillRect(0, Infinity, 100, 50);
+ctx.fillRect(0, -Infinity, 100, 50);
+ctx.fillRect(0, NaN, 100, 50);
+ctx.fillRect(0, 0, Infinity, 50);
+ctx.fillRect(0, 0, -Infinity, 50);
+ctx.fillRect(0, 0, NaN, 50);
+ctx.fillRect(0, 0, 100, Infinity);
+ctx.fillRect(0, 0, 100, -Infinity);
+ctx.fillRect(0, 0, 100, NaN);
+ctx.fillRect(Infinity, Infinity, 100, 50);
+ctx.fillRect(Infinity, Infinity, Infinity, 50);
+ctx.fillRect(Infinity, Infinity, Infinity, Infinity);
+ctx.fillRect(Infinity, Infinity, 100, Infinity);
+ctx.fillRect(Infinity, 0, Infinity, 50);
+ctx.fillRect(Infinity, 0, Infinity, Infinity);
+ctx.fillRect(Infinity, 0, 100, Infinity);
+ctx.fillRect(0, Infinity, Infinity, 50);
+ctx.fillRect(0, Infinity, Infinity, Infinity);
+ctx.fillRect(0, Infinity, 100, Infinity);
+ctx.fillRect(0, 0, Infinity, Infinity);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillRect.path.html ]]] -->
+
+<p>Canvas test: 2d.fillRect.path</p>
+<canvas id="c133" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillRect_path() {
+
+var canvas = document.getElementById('c133');
+var ctx = canvas.getContext('2d');
+
+ctx.beginPath();
+ctx.rect(0, 0, 100, 50);
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 16, 16);
+ctx.fillStyle = '#0f0';
+ctx.fill();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillRect.shadow.html ]]] -->
+
+<p>Canvas test: 2d.fillRect.shadow</p>
+<canvas id="c134" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillRect_shadow() {
+
+var canvas = document.getElementById('c134');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.fillStyle = '#f00';
+ctx.shadowBlur = 0;
+ctx.shadowOffsetX = 0;
+ctx.shadowOffsetY = 50;
+
+// Shadows are optional, so just test that if they apply to fill() then they apply to fillRect() too
+ctx.beginPath();
+ctx.rect(0, -50, 100, 50);
+ctx.shadowColor = '#f00';
+ctx.fill();
+
+ctx.shadowColor = '#0f0';
+ctx.fillRect(0, -50, 100, 50);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillRect.transform.html ]]] -->
+
+<p>Canvas test: 2d.fillRect.transform</p>
+<canvas id="c135" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillRect_transform() {
+
+var canvas = document.getElementById('c135');
+var ctx = canvas.getContext('2d');
+
+ctx.scale(10, 10);
+ctx.translate(0, 5);
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, -5, 10, 5);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillRect.zero.html ]]] -->
+
+<p>Canvas test: 2d.fillRect.zero</p>
+<canvas id="c136" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillRect_zero() {
+
+var canvas = document.getElementById('c136');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 0);
+ctx.fillRect(0, 0, 0, 50);
+ctx.fillRect(0, 0, 0, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.default.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.default</p>
+<canvas id="c137" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_fillStyle_default() {
+
+var canvas = document.getElementById('c137');
+var ctx = canvas.getContext('2d');
+
+ok(ctx.fillStyle == '#000000', "ctx.fillStyle == '#000000'");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.get.semitransparent.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.get.semitransparent</p>
+<canvas id="c138" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_fillStyle_get_semitransparent() {
+
+var canvas = document.getElementById('c138');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = 'rgba(255,255,255,0.45)';
+ok(/^rgba\(255, 255, 255, 0\.4\d+\)$/.test(ctx.fillStyle), "ctx.fillStyle =~ /^rgba\\(255, 255, 255, 0\\.4\\d+\\)$/");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.get.solid.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.get.solid</p>
+<canvas id="c139" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_fillStyle_get_solid() {
+
+var canvas = document.getElementById('c139');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#fa0';
+ok(ctx.fillStyle === '#ffaa00', "ctx.fillStyle === '#ffaa00'");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.get.transparent.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.get.transparent</p>
+<canvas id="c140" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_fillStyle_get_transparent() {
+
+var canvas = document.getElementById('c140');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = 'rgba(0,0,0,0)';
+is(ctx.fillStyle, 'rgba(0, 0, 0, 0)', "ctx.fillStyle should be what we set it to");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.invalidstring.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.invalidstring</p>
+<canvas id="c141" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_invalidstring() {
+
+var canvas = document.getElementById('c141');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#0f0';
+ctx.fillStyle = 'invalid';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.invalidtype.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.invalidtype</p>
+<canvas id="c142" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_invalidtype() {
+
+var canvas = document.getElementById('c142');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#0f0';
+ctx.fillStyle = null;
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.current.basic.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.current.basic</p>
+<!-- Testing: currentColor is computed from the canvas element -->
+<canvas id="c143" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_fillStyle_parse_current_basic() {
+
+var canvas = document.getElementById('c143');
+var ctx = canvas.getContext('2d');
+
+canvas.setAttribute('style', 'color: #0f0');
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'currentColor';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.current.changed.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.current.changed</p>
+<!-- Testing: currentColor is computed when the attribute is set, not when it is painted -->
+<canvas id="c144" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_fillStyle_parse_current_changed() {
+
+var canvas = document.getElementById('c144');
+var ctx = canvas.getContext('2d');
+
+canvas.setAttribute('style', 'color: #0f0');
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'currentColor';
+canvas.setAttribute('style', 'color: #f00');
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.current.removed.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.current.removed</p>
+<!-- Testing: currentColor is solid black when the canvas element is not in a document -->
+<canvas id="c145" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_fillStyle_parse_current_removed() {
+
+var canvas = document.getElementById('c145');
+var ctx = canvas.getContext('2d');
+
+// Try not to let it undetectably incorrectly pick up opaque-black
+// from other parts of the document:
+document.body.parentNode.setAttribute('style', 'color: #f00');
+document.body.setAttribute('style', 'color: #f00');
+canvas.setAttribute('style', 'color: #f00');
+
+var canvas2 = document.createElement('canvas');
+var ctx2 = canvas2.getContext('2d');
+ctx2.fillStyle = '#f00';
+ctx2.fillStyle = 'currentColor';
+ctx2.fillRect(0, 0, 100, 50);
+ctx.drawImage(canvas2, 0, 0);
+
+document.body.parentNode.removeAttribute('style');
+document.body.removeAttribute('style');
+
+isPixel(ctx, 50,25, 0,0,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.hex3.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.hex3</p>
+<canvas id="c146" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_hex3() {
+
+var canvas = document.getElementById('c146');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.hex6.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.hex6</p>
+<canvas id="c147" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_hex6() {
+
+var canvas = document.getElementById('c147');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = '#00fF00';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.hsl-1.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.hsl-1</p>
+<canvas id="c148" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_hsl_1() {
+
+var canvas = document.getElementById('c148');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'hsl(120, 100%, 50%)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.hsl-2.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.hsl-2</p>
+<canvas id="c149" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_hsl_2() {
+
+var canvas = document.getElementById('c149');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'hsl( -240 , 100% , 50% )';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.hsl-3.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.hsl-3</p>
+<canvas id="c150" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_hsl_3() {
+
+var canvas = document.getElementById('c150');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'hsl(360120, 100%, 50%)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.hsl-4.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.hsl-4</p>
+<canvas id="c151" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_hsl_4() {
+
+var canvas = document.getElementById('c151');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'hsl(-360240, 100%, 50%)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.hsl-5.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.hsl-5</p>
+<canvas id="c152" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_hsl_5() {
+
+var canvas = document.getElementById('c152');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'hsl(120.0, 100.0%, 50.0%)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.hsl-clamp-1.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.hsl-clamp-1</p>
+<canvas id="c153" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_hsl_clamp_1() {
+
+var canvas = document.getElementById('c153');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'hsl(120, 200%, 50%)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.hsl-clamp-2.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.hsl-clamp-2</p>
+<canvas id="c154" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_hsl_clamp_2() {
+
+var canvas = document.getElementById('c154');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'hsl(120, -200%, 49.9%)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 127,127,127,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.hsl-clamp-3.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.hsl-clamp-3</p>
+<canvas id="c155" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_hsl_clamp_3() {
+
+var canvas = document.getElementById('c155');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'hsl(120, 100%, 200%)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 255,255,255,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.hsl-clamp-4.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.hsl-clamp-4</p>
+<canvas id="c156" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_hsl_clamp_4() {
+
+var canvas = document.getElementById('c156');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'hsl(120, 100%, -200%)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,0,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.hsla-1.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.hsla-1</p>
+<canvas id="c157" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_hsla_1() {
+
+var canvas = document.getElementById('c157');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'hsla(120, 100%, 50%, 0.499)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,127, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.hsla-2.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.hsla-2</p>
+<canvas id="c158" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_hsla_2() {
+
+var canvas = document.getElementById('c158');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'hsla( 120.0 , 100.0% , 50.0% , 1 )';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.hsla-clamp-1.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.hsla-clamp-1</p>
+<canvas id="c159" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_hsla_clamp_1() {
+
+var canvas = document.getElementById('c159');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'hsla(120, 200%, 50%, 1)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.hsla-clamp-2.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.hsla-clamp-2</p>
+<canvas id="c160" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_hsla_clamp_2() {
+
+var canvas = document.getElementById('c160');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'hsla(120, -200%, 49.9%, 1)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 127,127,127,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.hsla-clamp-3.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.hsla-clamp-3</p>
+<canvas id="c161" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_hsla_clamp_3() {
+
+var canvas = document.getElementById('c161');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'hsla(120, 100%, 200%, 1)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 255,255,255,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.hsla-clamp-4.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.hsla-clamp-4</p>
+<canvas id="c162" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_hsla_clamp_4() {
+
+var canvas = document.getElementById('c162');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'hsla(120, 100%, -200%, 1)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,0,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.hsla-clamp-5.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.hsla-clamp-5</p>
+<canvas id="c163" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_hsla_clamp_5() {
+
+var canvas = document.getElementById('c163');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'hsla(120, 100%, 50%, 2)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.hsla-clamp-6.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.hsla-clamp-6</p>
+<canvas id="c164" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_hsla_clamp_6() {
+
+var canvas = document.getElementById('c164');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'hsla(120, 100%, 0%, -2)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,0,0,0, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.html4.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.html4</p>
+<canvas id="c165" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_html4() {
+
+var canvas = document.getElementById('c165');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'limE';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.invalid.hex3.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.invalid.hex3</p>
+<canvas id="c166" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_invalid_hex3() {
+
+var canvas = document.getElementById('c166');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+try { ctx.fillStyle = '#g00'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.invalid.hex6.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.invalid.hex6</p>
+<canvas id="c167" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_invalid_hex6() {
+
+var canvas = document.getElementById('c167');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+try { ctx.fillStyle = '#fg0000'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.invalid.hsl-1.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.invalid.hsl-1</p>
+<canvas id="c168" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_invalid_hsl_1() {
+
+var canvas = document.getElementById('c168');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+try { ctx.fillStyle = 'hsl(0%, 100%, 50%)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.invalid.hsl-2.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.invalid.hsl-2</p>
+<canvas id="c169" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_invalid_hsl_2() {
+
+var canvas = document.getElementById('c169');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+try { ctx.fillStyle = 'hsl(z, 100%, 50%)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.invalid.hsl-3.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.invalid.hsl-3</p>
+<canvas id="c170" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_invalid_hsl_3() {
+
+var canvas = document.getElementById('c170');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+try { ctx.fillStyle = 'hsl(0, 0, 50%)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.invalid.hsl-4.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.invalid.hsl-4</p>
+<canvas id="c171" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_invalid_hsl_4() {
+
+var canvas = document.getElementById('c171');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+try { ctx.fillStyle = 'hsl(0, 100%, 0)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.invalid.hsl-5.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.invalid.hsl-5</p>
+<canvas id="c172" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_invalid_hsl_5() {
+
+var canvas = document.getElementById('c172');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+try { ctx.fillStyle = 'hsl(0, 100%, 100%,)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.invalid.hsla-1.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.invalid.hsla-1</p>
+<canvas id="c173" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_invalid_hsla_1() {
+
+var canvas = document.getElementById('c173');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+try { ctx.fillStyle = 'hsla(0%, 100%, 50%, 1)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.invalid.hsla-2.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.invalid.hsla-2</p>
+<canvas id="c174" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_invalid_hsla_2() {
+
+var canvas = document.getElementById('c174');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+try { ctx.fillStyle = 'hsla(0, 0, 50%, 1)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.invalid.name-1.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.invalid.name-1</p>
+<canvas id="c174a" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_invalid_name_1() {
+
+var canvas = document.getElementById('c174a');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+try { ctx.fillStyle = 'darkbrown'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.invalid.name-2.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.invalid.name-2</p>
+<canvas id="c174b" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_invalid_name_2() {
+
+var canvas = document.getElementById('c174b');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+try { ctx.fillStyle = 'firebrick1'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.invalid.name-3.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.invalid.name-3</p>
+<canvas id="c174c" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_invalid_name_3() {
+
+var canvas = document.getElementById('c174c');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+try { ctx.fillStyle = 'red blue'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.invalid.rgb-1.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.invalid.rgb-1</p>
+<canvas id="c175" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_invalid_rgb_1() {
+
+var canvas = document.getElementById('c175');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+try { ctx.fillStyle = 'rgb(255.0, 0%, 0)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.invalid.rgb-2.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.invalid.rgb-2</p>
+<canvas id="c176" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_invalid_rgb_2() {
+
+var canvas = document.getElementById('c176');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+try { ctx.fillStyle = 'rgb(255%, 0.0, 0)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.invalid.rgb-3.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.invalid.rgb-3</p>
+<canvas id="c177" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_invalid_rgb_3() {
+
+var canvas = document.getElementById('c177');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+try { ctx.fillStyle = 'rgb(255.0, 0, 0,)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.invalid.rgb-4.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.invalid.rgb-4</p>
+<canvas id="c178" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_invalid_rgb_4() {
+
+var canvas = document.getElementById('c178');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+try { ctx.fillStyle = 'rgb(100%, 0, 0)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.invalid.rgb-5.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.invalid.rgb-5</p>
+<canvas id="c179" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_invalid_rgb_5() {
+
+var canvas = document.getElementById('c179');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+try { ctx.fillStyle = 'rgb(255, 0 0)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.invalid.rgb-6.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.invalid.rgb-6</p>
+<canvas id="c180" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_invalid_rgb_6() {
+
+var canvas = document.getElementById('c180');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+try { ctx.fillStyle = 'rgb(255, - 1, 0)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.invalid.rgb-7.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.invalid.rgb-7</p>
+<canvas id="c181" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_invalid_rgb_7() {
+
+var canvas = document.getElementById('c181');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+try { ctx.fillStyle = 'rgb(255, 0, 0, 1,)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.invalid.rgba-1.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.invalid.rgba-1</p>
+<canvas id="c182" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_invalid_rgba_1() {
+
+var canvas = document.getElementById('c182');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+try { ctx.fillStyle = 'rgba(255, 0, 0,)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.invalid.rgba-2.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.invalid.rgba-2</p>
+<canvas id="c183" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_invalid_rgba_2() {
+
+var canvas = document.getElementById('c183');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+try { ctx.fillStyle = 'rgba(255.0, 0, 0, 1,)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.invalid.rgba-3.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.invalid.rgba-3</p>
+<canvas id="c184" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_invalid_rgba_3() {
+
+var canvas = document.getElementById('c184');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+try { ctx.fillStyle = 'rgba(100%, 0, 0, 1)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.invalid.rgba-4.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.invalid.rgba-4</p>
+<canvas id="c185" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_invalid_rgba_4() {
+
+var canvas = document.getElementById('c185');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+try { ctx.fillStyle = 'rgba(255, 0, 0, 100.%)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.invalid.rgba-5.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.invalid.rgba-5</p>
+<canvas id="c186" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_invalid_rgba_5() {
+
+var canvas = document.getElementById('c186');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+try { ctx.fillStyle = 'rgba(255, 0, 0, 1. 0)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.rgb-clamp-1.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.rgb-clamp-1</p>
+<canvas id="c187" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_rgb_clamp_1() {
+
+var canvas = document.getElementById('c187');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'rgb(-1000, 1000, -1000)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.rgb-clamp-2.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.rgb-clamp-2</p>
+<canvas id="c188" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_rgb_clamp_2() {
+
+var canvas = document.getElementById('c188');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'rgb(-200%, 200%, -200%)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.rgb-clamp-3.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.rgb-clamp-3</p>
+<canvas id="c189" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_rgb_clamp_3() {
+
+var canvas = document.getElementById('c189');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'rgb(-2147483649, 4294967298, -18446744073709551619)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.rgb-clamp-4.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.rgb-clamp-4</p>
+<canvas id="c190" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_rgb_clamp_4() {
+
+var canvas = document.getElementById('c190');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'rgb(-1000000000000000000000000000000000000000, 1000000000000000000000000000000000000000, -1000000000000000000000000000000000000000)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.rgb-clamp-5.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.rgb-clamp-5</p>
+<canvas id="c191" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_rgb_clamp_5() {
+
+var canvas = document.getElementById('c191');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'rgb(-10000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000, 10000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000, -10000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.rgb-num.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.rgb-num</p>
+<canvas id="c192" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_rgb_num() {
+
+var canvas = document.getElementById('c192');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'rgb(0,255,0)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.rgb-percent.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.rgb-percent</p>
+<canvas id="c193" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_rgb_percent() {
+
+var canvas = document.getElementById('c193');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'rgb(0% ,100% ,0%)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.rgba-clamp-1.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.rgba-clamp-1</p>
+<canvas id="c194" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_rgba_clamp_1() {
+
+var canvas = document.getElementById('c194');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'rgba(0, 255, 0, -2)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,0,0,0, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.rgba-clamp-2.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.rgba-clamp-2</p>
+<canvas id="c195" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_rgba_clamp_2() {
+
+var canvas = document.getElementById('c195');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'rgba(0, 255, 0, 2)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.rgba-num-1.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.rgba-num-1</p>
+<canvas id="c196" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_rgba_num_1() {
+
+var canvas = document.getElementById('c196');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'rgba( 0 , 255 , 0 , .499 )';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,127, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.rgba-num-2.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.rgba-num-2</p>
+<canvas id="c197" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_rgba_num_2() {
+
+var canvas = document.getElementById('c197');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'rgba( 0 , 255 , 0 , 0.499 )';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,127, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.rgba-percent.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.rgba-percent</p>
+<canvas id="c198" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_rgba_percent() {
+
+var canvas = document.getElementById('c198');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'rgba(0%,100%,0%,0.499)';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,127, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.rgba-solid-1.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.rgba-solid-1</p>
+<canvas id="c199" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_rgba_solid_1() {
+
+var canvas = document.getElementById('c199');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'rgba( 0 , 255 , 0 , 1 )';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.rgba-solid-2.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.rgba-solid-2</p>
+<canvas id="c200" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_rgba_solid_2() {
+
+var canvas = document.getElementById('c200');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'rgba( 0 , 255 , 0 , 1.0 )';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.svg-1.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.svg-1</p>
+<canvas id="c201" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_svg_1() {
+
+var canvas = document.getElementById('c201');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'gray';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 128,128,128,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.svg-2.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.svg-2</p>
+<canvas id="c202" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_svg_2() {
+
+var canvas = document.getElementById('c202');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'grey';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 128,128,128,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.system.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.system</p>
+<canvas id="c203" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_fillStyle_parse_system() {
+
+var canvas = document.getElementById('c203');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'ThreeDDarkShadow';
+ok(/^#(?!(FF0000|ff0000|f00)$)/.test(ctx.fillStyle), "ctx.fillStyle =~ /^#(?!(FF0000|ff0000|f00)$)/"); // test that it's not red
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.transparent-1.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.transparent-1</p>
+<canvas id="c204" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_transparent_1() {
+
+var canvas = document.getElementById('c204');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'transparent';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,0,0,0, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.fillStyle.parse.transparent-2.html ]]] -->
+
+<p>Canvas test: 2d.fillStyle.parse.transparent-2</p>
+<canvas id="c205" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_fillStyle_parse_transparent_2() {
+
+var canvas = document.getElementById('c205');
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#f00';
+ctx.fillStyle = 'TrAnSpArEnT';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,0,0,0, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.getcontext.exists.html ]]] -->
+
+<p>Canvas test: 2d.getcontext.exists</p>
+<!-- Testing: The 2D context is implemented -->
+<canvas id="c206" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_getcontext_exists() {
+
+var canvas = document.getElementById('c206');
+var ctx = canvas.getContext('2d');
+
+ok(canvas.getContext('2d') !== null, "canvas.getContext('2d') !== null");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.getcontext.shared.html ]]] -->
+
+<p>Canvas test: 2d.getcontext.shared</p>
+<!-- Testing: getContext('2d') returns objects which share canvas state -->
+<canvas id="c207" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_getcontext_shared() {
+
+var canvas = document.getElementById('c207');
+var ctx = canvas.getContext('2d');
+
+var ctx2 = canvas.getContext('2d');
+ctx.fillStyle = '#f00';
+ctx2.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.getcontext.unique.html ]]] -->
+
+<p>Canvas test: 2d.getcontext.unique</p>
+<!-- Testing: getContext('2d') returns the same object -->
+<canvas id="c208" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_getcontext_unique() {
+
+var canvas = document.getElementById('c208');
+var ctx = canvas.getContext('2d');
+
+ok(canvas.getContext('2d') === canvas.getContext('2d'), "canvas.getContext('2d') === canvas.getContext('2d')");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.empty.html ]]] -->
+
+<p>Canvas test: 2d.gradient.empty</p>
+<canvas id="c209" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_gradient_empty() {
+
+var canvas = document.getElementById('c209');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+var g = ctx.createLinearGradient(0, 0, 0, 50);
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 2);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.interpolate.alpha.html ]]] -->
+
+<p>Canvas test: 2d.gradient.interpolate.alpha</p>
+<canvas id="c210" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_gradient_interpolate_alpha() {
+
+var canvas = document.getElementById('c210');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#ff0';
+ctx.fillRect(0, 0, 100, 50);
+var g = ctx.createLinearGradient(0, 0, 100, 0);
+g.addColorStop(0, 'rgba(0,0,255, 0)');
+g.addColorStop(1, 'rgba(0,0,255, 1)');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 25,25, 191,191,63,255, 3);
+isPixel(ctx, 50,25, 127,127,127,255, 3);
+isPixel(ctx, 75,25, 63,63,191,255, 3);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.interpolate.colour.html ]]] -->
+
+<p>Canvas test: 2d.gradient.interpolate.colour</p>
+<canvas id="c211" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_gradient_interpolate_colour() {
+
+var canvas = document.getElementById('c211');
+var ctx = canvas.getContext('2d');
+
+var g = ctx.createLinearGradient(0, 0, 100, 0);
+g.addColorStop(0, '#ff0');
+g.addColorStop(1, '#00f');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 25,25, 191,191,63,255, 3);
+isPixel(ctx, 50,25, 127,127,127,255, 3);
+isPixel(ctx, 75,25, 63,63,191,255, 3);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.interpolate.colouralpha.html ]]] -->
+
+<p>Canvas test: 2d.gradient.interpolate.colouralpha</p>
+<canvas id="c212" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_gradient_interpolate_colouralpha() {
+
+var canvas = document.getElementById('c212');
+var ctx = canvas.getContext('2d');
+
+var g = ctx.createLinearGradient(0, 0, 100, 0);
+g.addColorStop(0, 'rgba(255,255,0, 0)');
+g.addColorStop(1, 'rgba(0,0,255, 1)');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+// Following tests fail on Windows hardware (datacenter and local laptops), see bug 1657707
+if (!IsWindows()) isPixel(ctx, 25,25, 191,191,63,63, 3);
+if (!IsWindows()) isPixel(ctx, 50,25, 127,127,127,127, 3);
+if (!IsWindows()) isPixel(ctx, 75,25, 63,63,191,191, 3);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.interpolate.multiple.html ]]] -->
+
+<p>Canvas test: 2d.gradient.interpolate.multiple</p>
+<canvas id="c213" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_gradient_interpolate_multiple() {
+
+var canvas = document.getElementById('c213');
+var ctx = canvas.getContext('2d');
+
+canvas.width = 200;
+var g = ctx.createLinearGradient(0, 0, 200, 0);
+g.addColorStop(0, '#ff0');
+g.addColorStop(0.5, '#0ff');
+g.addColorStop(1, '#f0f');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 200, 50);
+isPixel(ctx, 50,25, 127,255,127,255, 3);
+isPixel(ctx, 100,25, 0,255,255,255, 3);
+isPixel(ctx, 150,25, 127,127,255,255, 3);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.interpolate.outside.html ]]] -->
+
+<p>Canvas test: 2d.gradient.interpolate.outside</p>
+<canvas id="c214" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_gradient_interpolate_outside() {
+
+var canvas = document.getElementById('c214');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+var g = ctx.createLinearGradient(25, 0, 75, 0);
+g.addColorStop(0.4, '#0f0');
+g.addColorStop(0.6, '#0f0');
+
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 20,25, 0,255,0,255, 2);
+isPixel(ctx, 50,25, 0,255,0,255, 2);
+isPixel(ctx, 80,25, 0,255,0,255, 2);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.interpolate.overlap.html ]]] -->
+
+<p>Canvas test: 2d.gradient.interpolate.overlap</p>
+<canvas id="c215" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_gradient_interpolate_overlap() {
+
+var canvas = document.getElementById('c215');
+var ctx = canvas.getContext('2d');
+
+if (!IsD2DEnabled()) {
+ // On D2D the different nature of how gradients
+ // are drawn makes it so we cannot guarantee these stops are completely
+ // hard.
+
+ // On OS X 10.5 quartz is confused by the overlapping stops: Bug #715235
+ canvas.width = 200;
+ var g = ctx.createLinearGradient(0, 0, 200, 0);
+ g.addColorStop(0, '#f00');
+ g.addColorStop(0, '#ff0');
+ g.addColorStop(0.25, '#00f');
+ g.addColorStop(0.25, '#0f0');
+ g.addColorStop(0.25, '#0f0');
+ g.addColorStop(0.25, '#0f0');
+ g.addColorStop(0.25, '#ff0');
+ g.addColorStop(0.5, '#00f');
+ g.addColorStop(0.5, '#0f0');
+ g.addColorStop(0.75, '#00f');
+ g.addColorStop(0.75, '#f00');
+ g.addColorStop(0.75, '#ff0');
+ g.addColorStop(0.5, '#0f0');
+ g.addColorStop(0.5, '#0f0');
+ g.addColorStop(0.5, '#ff0');
+ g.addColorStop(1, '#00f');
+ ctx.fillStyle = g;
+ ctx.fillRect(0, 0, 200, 50);
+ isPixel(ctx, 49,25, 0,0,255,255, 16);
+ isPixel(ctx, 51,25, 255,255,0,255, 16);
+ isPixel(ctx, 99,25, 0,0,255,255, 16);
+ isPixel(ctx, 101,25, 255,255,0,255, 16);
+ isPixel(ctx, 149,25, 0,0,255,255, 16);
+ isPixel(ctx, 151,25, 255,255,0,255, 16);
+}
+}
+</script>
+
+<!-- [[[ test_2d.gradient.interpolate.overlap2.html ]]] -->
+
+<p>Canvas test: 2d.gradient.interpolate.overlap2</p>
+<canvas id="c216" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_gradient_interpolate_overlap2() {
+
+var canvas = document.getElementById('c216');
+var ctx = canvas.getContext('2d');
+
+var g = ctx.createLinearGradient(0, 0, 100, 0);
+var ps = [ 0, 1/10, 1/4, 1/3, 1/2, 3/4, 1 ];
+for (var p = 0; p < ps.length; ++p)
+{
+ g.addColorStop(ps[p], '#0f0');
+ for (var i = 0; i < 15; ++i)
+ g.addColorStop(ps[p], '#f00');
+ g.addColorStop(ps[p], '#0f0');
+}
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1,25, 0,255,0,255, 0);
+isPixel(ctx, 30,25, 0,255,0,255, 0);
+isPixel(ctx, 40,25, 0,255,0,255, 0);
+isPixel(ctx, 60,25, 0,255,0,255, 0);
+isPixel(ctx, 80,25, 0,255,0,255, 0);
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.interpolate.solid.html ]]] -->
+
+<p>Canvas test: 2d.gradient.interpolate.solid</p>
+<canvas id="c217" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_gradient_interpolate_solid() {
+
+var canvas = document.getElementById('c217');
+var ctx = canvas.getContext('2d');
+
+var g = ctx.createLinearGradient(0, 0, 100, 0);
+g.addColorStop(0, '#0f0');
+g.addColorStop(1, '#0f0');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.interpolate.vertical.html ]]] -->
+
+<p>Canvas test: 2d.gradient.interpolate.vertical</p>
+<canvas id="c218" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_gradient_interpolate_vertical() {
+
+var canvas = document.getElementById('c218');
+var ctx = canvas.getContext('2d');
+
+var g = ctx.createLinearGradient(0, 0, 0, 50);
+g.addColorStop(0, '#ff0');
+g.addColorStop(1, '#00f');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,12, 191,191,63,255, 10);
+isPixel(ctx, 50,25, 127,127,127,255, 5);
+isPixel(ctx, 50,37, 63,63,191,255, 10);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.interpolate.zerosize.html ]]] -->
+
+<p>Canvas test: 2d.gradient.interpolate.zerosize</p>
+<canvas id="c219" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_gradient_interpolate_zerosize() {
+
+var canvas = document.getElementById('c219');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+var g = ctx.createLinearGradient(50, 25, 50, 25); // zero-length line (undefined direction)
+g.addColorStop(0, '#f00');
+g.addColorStop(1, '#f00');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 40,20, 0,255,0,255, 2);
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.linear.nonfinite.html ]]] -->
+
+<p>Canvas test: 2d.gradient.linear.nonfinite</p>
+<!-- Testing: createLinearGradient() throws NOT_SUPPORTED_ERR if arguments are not finite -->
+<canvas id="c220" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+// eslint-disable-next-line complexity
+function test_2d_gradient_linear_nonfinite() {
+
+var canvas = document.getElementById('c220');
+var ctx = canvas.getContext('2d');
+
+var _thrown = undefined; try {
+ ctx.createLinearGradient(Infinity, 0, 1, 0);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createLinearGradient(-Infinity, 0, 1, 0);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createLinearGradient(NaN, 0, 1, 0);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createLinearGradient(0, Infinity, 1, 0);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createLinearGradient(0, -Infinity, 1, 0);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createLinearGradient(0, NaN, 1, 0);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createLinearGradient(0, 0, Infinity, 0);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createLinearGradient(0, 0, -Infinity, 0);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createLinearGradient(0, 0, NaN, 0);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createLinearGradient(0, 0, 1, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createLinearGradient(0, 0, 1, -Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createLinearGradient(0, 0, 1, NaN);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createLinearGradient(Infinity, Infinity, 1, 0);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createLinearGradient(Infinity, Infinity, Infinity, 0);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createLinearGradient(Infinity, Infinity, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createLinearGradient(Infinity, Infinity, 1, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createLinearGradient(Infinity, 0, Infinity, 0);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createLinearGradient(Infinity, 0, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createLinearGradient(Infinity, 0, 1, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createLinearGradient(0, Infinity, Infinity, 0);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createLinearGradient(0, Infinity, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createLinearGradient(0, Infinity, 1, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createLinearGradient(0, 0, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.linear.transform.1.html ]]] -->
+
+<p>Canvas test: 2d.gradient.linear.transform.1</p>
+<!-- Testing: Linear gradient coordinates are relative to the coordinate space at the time of filling -->
+<canvas id="c221" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_gradient_linear_transform_1() {
+
+var canvas = document.getElementById('c221');
+var ctx = canvas.getContext('2d');
+
+var g = ctx.createLinearGradient(0, 0, 200, 0);
+g.addColorStop(0, '#f00');
+g.addColorStop(0.25, '#0f0');
+g.addColorStop(0.75, '#0f0');
+g.addColorStop(1, '#f00');
+ctx.fillStyle = g;
+ctx.translate(-50, 0);
+ctx.fillRect(50, 0, 100, 50);
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.linear.transform.2.html ]]] -->
+
+<p>Canvas test: 2d.gradient.linear.transform.2</p>
+<!-- Testing: Linear gradient coordinates are relative to the coordinate space at the time of filling -->
+<canvas id="c222" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_gradient_linear_transform_2() {
+
+var canvas = document.getElementById('c222');
+var ctx = canvas.getContext('2d');
+
+ctx.translate(100, 0);
+var g = ctx.createLinearGradient(0, 0, 200, 0);
+g.addColorStop(0, '#f00');
+g.addColorStop(0.25, '#0f0');
+g.addColorStop(0.75, '#0f0');
+g.addColorStop(1, '#f00');
+ctx.fillStyle = g;
+ctx.translate(-150, 0);
+ctx.fillRect(50, 0, 100, 50);
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.linear.transform.3.html ]]] -->
+
+<p>Canvas test: 2d.gradient.linear.transform.3</p>
+<!-- Testing: Linear gradient transforms do not experience broken caching effects -->
+<canvas id="c223" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_gradient_linear_transform_3() {
+
+var canvas = document.getElementById('c223');
+var ctx = canvas.getContext('2d');
+
+var g = ctx.createLinearGradient(0, 0, 200, 0);
+g.addColorStop(0, '#f00');
+g.addColorStop(0.25, '#0f0');
+g.addColorStop(0.75, '#0f0');
+g.addColorStop(1, '#f00');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+ctx.translate(-50, 0);
+ctx.fillRect(50, 0, 100, 50);
+
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+}
+</script>
+
+<!-- [[[ test_2d.gradient.object.compare.html ]]] -->
+
+<p>Canvas test: 2d.gradient.object.compare</p>
+<canvas id="c224" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_gradient_object_compare() {
+
+var canvas = document.getElementById('c224');
+var ctx = canvas.getContext('2d');
+
+var g1 = ctx.createLinearGradient(0, 0, 100, 0);
+var g2 = ctx.createLinearGradient(0, 0, 100, 0);
+ok(g1 !== g2, "g1 !== g2");
+ctx.fillStyle = g1;
+ok(ctx.fillStyle === g1, "ctx.fillStyle === g1");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.object.crosscanvas.html ]]] -->
+
+<p>Canvas test: 2d.gradient.object.crosscanvas</p>
+<canvas id="c225" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_gradient_object_crosscanvas() {
+
+var canvas = document.getElementById('c225');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+var g = document.createElement('canvas').getContext('2d').createLinearGradient(0, 0, 100, 0);
+g.addColorStop(0, '#0f0');
+g.addColorStop(1, '#0f0');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 2);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.object.invalidcolour.html ]]] -->
+
+<p>Canvas test: 2d.gradient.object.invalidcolour</p>
+<canvas id="c226" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_gradient_object_invalidcolour() {
+
+var canvas = document.getElementById('c226');
+var ctx = canvas.getContext('2d');
+
+var g = ctx.createLinearGradient(0, 0, 100, 0);
+var _thrown = undefined; try {
+ g.addColorStop(0, "");
+} catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "SyntaxError" && _thrown.code == DOMException.SYNTAX_ERR, "should throw SyntaxError");
+var _thrown = undefined; try {
+ g.addColorStop(0, 'undefined');
+} catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "SyntaxError" && _thrown.code == DOMException.SYNTAX_ERR, "should throw SyntaxError");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.object.invalidoffset.html ]]] -->
+
+<p>Canvas test: 2d.gradient.object.invalidoffset</p>
+<canvas id="c227" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_gradient_object_invalidoffset() {
+
+var canvas = document.getElementById('c227');
+var ctx = canvas.getContext('2d');
+
+var g = ctx.createLinearGradient(0, 0, 100, 0);
+var _thrown = undefined; try {
+ g.addColorStop(-1, '#000');
+} catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
+var _thrown = undefined; try {
+ g.addColorStop(2, '#000');
+} catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
+var _thrown = undefined; try {
+ g.addColorStop(Infinity, '#000');
+} catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
+var _thrown = undefined; try {
+ g.addColorStop(-Infinity, '#000');
+} catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
+var _thrown = undefined; try {
+ g.addColorStop(NaN, '#000');
+} catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.object.return.html ]]] -->
+
+<p>Canvas test: 2d.gradient.object.return</p>
+<!-- Testing: createLinearGradient() and createRadialGradient() returns objects implementing CanvasGradient -->
+<canvas id="c228" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_gradient_object_return() {
+
+var canvas = document.getElementById('c228');
+var ctx = canvas.getContext('2d');
+
+window.CanvasGradient.prototype.thisImplementsCanvasGradient = true;
+
+var g1 = ctx.createLinearGradient(0, 0, 100, 0);
+ok(g1.addColorStop !== undefined, "g1.addColorStop !== undefined");
+ok(g1.thisImplementsCanvasGradient === true, "g1.thisImplementsCanvasGradient === true");
+
+var g2 = ctx.createRadialGradient(0, 0, 10, 0, 0, 20);
+ok(g2.addColorStop !== undefined, "g2.addColorStop !== undefined");
+ok(g2.thisImplementsCanvasGradient === true, "g2.thisImplementsCanvasGradient === true");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.object.type.html ]]] -->
+
+<p>Canvas test: 2d.gradient.object.type</p>
+<!-- Testing: window.CanvasGradient exists and has the right properties -->
+<canvas id="c229" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_gradient_object_type() {
+
+var canvas = document.getElementById('c229');
+var ctx = canvas.getContext('2d');
+
+ok(window.CanvasGradient !== undefined, "window.CanvasGradient !== undefined");
+ok(window.CanvasGradient.prototype.addColorStop !== undefined, "window.CanvasGradient.prototype.addColorStop !== undefined");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.object.update.html ]]] -->
+
+<p>Canvas test: 2d.gradient.object.update</p>
+<canvas id="c230" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_gradient_object_update() {
+
+var canvas = document.getElementById('c230');
+var ctx = canvas.getContext('2d');
+
+var g = ctx.createLinearGradient(-100, 0, 200, 0);
+g.addColorStop(0, '#f00');
+g.addColorStop(1, '#f00');
+ctx.fillStyle = g;
+g.addColorStop(0.1, '#0f0');
+g.addColorStop(0.9, '#0f0');
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 2);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.radial.cone.behind.html ]]] -->
+
+<p>Canvas test: 2d.gradient.radial.cone.behind</p>
+<canvas id="c231" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_gradient_radial_cone_behind() {
+
+var canvas = document.getElementById('c231');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+var g = ctx.createRadialGradient(120, 25, 10, 211, 25, 100);
+g.addColorStop(0, '#f00');
+g.addColorStop(1, '#f00');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 50,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,25, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 50,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.radial.cone.beside.html ]]] -->
+
+<p>Canvas test: 2d.gradient.radial.cone.beside</p>
+<canvas id="c232" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_gradient_radial_cone_beside() {
+
+var canvas = document.getElementById('c232');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+var g = ctx.createRadialGradient(0, 100, 40, 100, 100, 50);
+g.addColorStop(0, '#f00');
+g.addColorStop(1, '#f00');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 50,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,25, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 50,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.radial.cone.bottom.html ]]] -->
+
+<p>Canvas test: 2d.gradient.radial.cone.bottom</p>
+<canvas id="c233" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_gradient_radial_cone_bottom() {
+
+var canvas = document.getElementById('c233');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+var g = ctx.createRadialGradient(210, 25, 100, 230, 25, 101);
+g.addColorStop(0, '#0f0');
+g.addColorStop(1, '#f00');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 50,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,25, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 50,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.radial.cone.cylinder.html ]]] -->
+
+<p>Canvas test: 2d.gradient.radial.cone.cylinder</p>
+<canvas id="c234" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_gradient_radial_cone_cylinder() {
+
+var canvas = document.getElementById('c234');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+var g = ctx.createRadialGradient(210, 25, 100, 230, 25, 100);
+g.addColorStop(0, '#0f0');
+g.addColorStop(1, '#f00');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1, 1, 0, 255, 0, 255, 0);
+isPixel(ctx, 50, 1, 0, 255, 0, 255, 0);
+isPixel(ctx, 98, 1, 0, 255, 0, 255, 0);
+isPixel(ctx, 1, 25, 0, 255, 0, 255, 0);
+isPixel(ctx, 50, 25, 0, 255, 0, 255, 0);
+isPixel(ctx, 98, 25, 0, 255, 0, 255, 0);
+isPixel(ctx, 1, 48, 0, 255, 0, 255, 0);
+isPixel(ctx, 50, 48, 0, 255, 0, 255, 0);
+isPixel(ctx, 98, 48, 0, 255, 0, 255, 0);
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.radial.cone.front.html ]]] -->
+
+<p>Canvas test: 2d.gradient.radial.cone.front</p>
+<canvas id="c235" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_gradient_radial_cone_front() {
+
+var canvas = document.getElementById('c235');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+var g = ctx.createRadialGradient(311, 25, 10, 210, 25, 100);
+g.addColorStop(0, '#f00');
+g.addColorStop(1, '#0f0');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 50,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,25, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 50,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.radial.cone.shape1.html ]]] -->
+
+<p>Canvas test: 2d.gradient.radial.cone.shape1</p>
+<canvas id="c236" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_gradient_radial_cone_shape1() {
+
+var canvas = document.getElementById('c236');
+var ctx = canvas.getContext('2d');
+
+var tol = 1; // tolerance to avoid antialiasing artifacts
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.fillStyle = '#f00';
+ctx.beginPath();
+ctx.moveTo(30+tol, 40);
+ctx.lineTo(110, -20+tol);
+ctx.lineTo(110, 100-tol);
+ctx.fill();
+
+var g = ctx.createRadialGradient(30+10*5/2, 40, 10*3/2, 30+10*15/4, 40, 10*9/4);
+g.addColorStop(0, '#0f0');
+g.addColorStop(1, '#0f0');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 50,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,25, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 50,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.radial.cone.shape2.html ]]] -->
+
+<p>Canvas test: 2d.gradient.radial.cone.shape2</p>
+<canvas id="c237" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_gradient_radial_cone_shape2() {
+
+var canvas = document.getElementById('c237');
+var ctx = canvas.getContext('2d');
+
+var tol = 1; // tolerance to avoid antialiasing artifacts
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+var g = ctx.createRadialGradient(30+10*5/2, 40, 10*3/2, 30+10*15/4, 40, 10*9/4);
+g.addColorStop(0, '#f00');
+g.addColorStop(1, '#f00');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.fillStyle = '#0f0';
+ctx.beginPath();
+ctx.moveTo(30-tol, 40);
+ctx.lineTo(110, -20-tol);
+ctx.lineTo(110, 100+tol);
+ctx.fill();
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 50,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,25, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 50,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.radial.cone.top.html ]]] -->
+
+<p>Canvas test: 2d.gradient.radial.cone.top</p>
+<canvas id="c238" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_gradient_radial_cone_top() {
+
+var canvas = document.getElementById('c238');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+var g = ctx.createRadialGradient(230, 25, 100, 100, 25, 101);
+g.addColorStop(0, '#f00');
+g.addColorStop(1, '#0f0');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1, 1, 0, 255, 0, 255, 0);
+isPixel(ctx, 50, 1, 0, 255, 0, 255, 0);
+isPixel(ctx, 98, 1, 0, 255, 0, 255, 0);
+isPixel(ctx, 1, 25, 0, 255, 0, 255, 0);
+isPixel(ctx, 50, 25, 0, 255, 0, 255, 0);
+isPixel(ctx, 98, 25, 0, 255, 0, 255, 0);
+isPixel(ctx, 1, 48, 0, 255, 0, 255, 0);
+isPixel(ctx, 50, 48, 0, 255, 0, 255, 0);
+isPixel(ctx, 98, 48, 0, 255, 0, 255, 0);
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.radial.equal.html ]]] -->
+
+<p>Canvas test: 2d.gradient.radial.equal</p>
+<canvas id="c239" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_gradient_radial_equal() {
+
+var canvas = document.getElementById('c239');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+var g = ctx.createRadialGradient(50, 25, 20, 50, 25, 20);
+g.addColorStop(0, '#f00');
+g.addColorStop(1, '#f00');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 50,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,25, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 50,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.radial.inside1.html ]]] -->
+
+<p>Canvas test: 2d.gradient.radial.inside1</p>
+<canvas id="c240" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_gradient_radial_inside1() {
+
+var canvas = document.getElementById('c240');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+var g = ctx.createRadialGradient(50, 25, 100, 50, 25, 200);
+g.addColorStop(0, '#0f0');
+g.addColorStop(1, '#f00');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 50,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,25, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 50,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.radial.inside2.html ]]] -->
+
+<p>Canvas test: 2d.gradient.radial.inside2</p>
+<canvas id="c241" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_gradient_radial_inside2() {
+
+var canvas = document.getElementById('c241');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+var g = ctx.createRadialGradient(50, 25, 200, 50, 25, 100);
+g.addColorStop(0, '#f00');
+g.addColorStop(1, '#0f0');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 50,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,25, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 50,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.radial.inside3.html ]]] -->
+
+<p>Canvas test: 2d.gradient.radial.inside3</p>
+<canvas id="c242" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_gradient_radial_inside3() {
+
+var canvas = document.getElementById('c242');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+var g = ctx.createRadialGradient(50, 25, 200, 50, 25, 100);
+g.addColorStop(0, '#f00');
+g.addColorStop(0.993, '#f00');
+g.addColorStop(1, '#0f0');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 50,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,25, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 50,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.radial.negative.html ]]] -->
+
+<p>Canvas test: 2d.gradient.radial.negative</p>
+<!-- Testing: createRadialGradient() throws INDEX_SIZE_ERR if either radius is negative -->
+<canvas id="c243" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_gradient_radial_negative() {
+
+var canvas = document.getElementById('c243');
+var ctx = canvas.getContext('2d');
+
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, -0.1, 0, 0, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, 1, 0, 0, -0.1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, -0.1, 0, 0, -0.1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.radial.nonfinite.html ]]] -->
+
+<p>Canvas test: 2d.gradient.radial.nonfinite</p>
+<!-- Testing: createRadialGradient() throws NOT_SUPPORTED_ERR if arguments are not finite -->
+<canvas id="c244" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+// eslint-disable-next-line complexity
+function test_2d_gradient_radial_nonfinite() {
+
+var canvas = document.getElementById('c244');
+var ctx = canvas.getContext('2d');
+
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, 0, 1, 0, 0, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(-Infinity, 0, 1, 0, 0, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(NaN, 0, 1, 0, 0, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, Infinity, 1, 0, 0, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, -Infinity, 1, 0, 0, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, NaN, 1, 0, 0, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, Infinity, 0, 0, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, -Infinity, 0, 0, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, NaN, 0, 0, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, 1, Infinity, 0, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, 1, -Infinity, 0, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, 1, NaN, 0, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, 1, 0, Infinity, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, 1, 0, -Infinity, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, 1, 0, NaN, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, 1, 0, 0, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, 1, 0, 0, -Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, 1, 0, 0, NaN);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, Infinity, 1, 0, 0, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, Infinity, Infinity, 0, 0, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, Infinity, Infinity, Infinity, 0, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, Infinity, Infinity, Infinity, Infinity, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, Infinity, Infinity, Infinity, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, Infinity, Infinity, Infinity, 0, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, Infinity, Infinity, 0, Infinity, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, Infinity, Infinity, 0, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, Infinity, Infinity, 0, 0, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, Infinity, 1, Infinity, 0, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, Infinity, 1, Infinity, Infinity, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, Infinity, 1, Infinity, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, Infinity, 1, Infinity, 0, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, Infinity, 1, 0, Infinity, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, Infinity, 1, 0, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, Infinity, 1, 0, 0, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, 0, Infinity, 0, 0, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, 0, Infinity, Infinity, 0, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, 0, Infinity, Infinity, Infinity, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, 0, Infinity, Infinity, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, 0, Infinity, Infinity, 0, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, 0, Infinity, 0, Infinity, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, 0, Infinity, 0, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, 0, Infinity, 0, 0, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, 0, 1, Infinity, 0, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, 0, 1, Infinity, Infinity, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, 0, 1, Infinity, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, 0, 1, Infinity, 0, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, 0, 1, 0, Infinity, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, 0, 1, 0, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(Infinity, 0, 1, 0, 0, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, Infinity, Infinity, 0, 0, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, Infinity, Infinity, Infinity, 0, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, Infinity, Infinity, Infinity, Infinity, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, Infinity, Infinity, Infinity, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, Infinity, Infinity, Infinity, 0, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, Infinity, Infinity, 0, Infinity, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, Infinity, Infinity, 0, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, Infinity, Infinity, 0, 0, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, Infinity, 1, Infinity, 0, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, Infinity, 1, Infinity, Infinity, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, Infinity, 1, Infinity, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, Infinity, 1, Infinity, 0, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, Infinity, 1, 0, Infinity, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, Infinity, 1, 0, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, Infinity, 1, 0, 0, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, Infinity, Infinity, 0, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, Infinity, Infinity, Infinity, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, Infinity, Infinity, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, Infinity, Infinity, 0, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, Infinity, 0, Infinity, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, Infinity, 0, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, Infinity, 0, 0, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, 1, Infinity, Infinity, 1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, 1, Infinity, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, 1, Infinity, 0, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, 1, 0, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.radial.outside1.html ]]] -->
+
+<p>Canvas test: 2d.gradient.radial.outside1</p>
+<canvas id="c245" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_gradient_radial_outside1() {
+
+var canvas = document.getElementById('c245');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+var g = ctx.createRadialGradient(200, 25, 10, 200, 25, 20);
+g.addColorStop(0, '#f00');
+g.addColorStop(1, '#0f0');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 50,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,25, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 50,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.radial.outside2.html ]]] -->
+
+<p>Canvas test: 2d.gradient.radial.outside2</p>
+<canvas id="c246" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_gradient_radial_outside2() {
+
+var canvas = document.getElementById('c246');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+var g = ctx.createRadialGradient(200, 25, 20, 200, 25, 10);
+g.addColorStop(0, '#0f0');
+g.addColorStop(1, '#f00');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 50,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,25, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 50,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.radial.outside3.html ]]] -->
+
+<p>Canvas test: 2d.gradient.radial.outside3</p>
+<canvas id="c247" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_gradient_radial_outside3() {
+
+var canvas = document.getElementById('c247');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+var g = ctx.createRadialGradient(200, 25, 20, 200, 25, 10);
+g.addColorStop(0, '#0f0');
+g.addColorStop(0.001, '#f00');
+g.addColorStop(1, '#f00');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 50,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,25, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 50,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.radial.touch1.html ]]] -->
+
+<p>Canvas test: 2d.gradient.radial.touch1</p>
+<canvas id="c248" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_gradient_radial_touch1() {
+
+var canvas = document.getElementById('c248');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+var g = ctx.createRadialGradient(150, 25, 50, 200, 25, 100);
+g.addColorStop(0, '#f00');
+g.addColorStop(1, '#f00');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 50,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,25, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 50,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.radial.touch2.html ]]] -->
+
+<p>Canvas test: 2d.gradient.radial.touch2</p>
+<canvas id="c249" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_gradient_radial_touch2() {
+
+var canvas = document.getElementById('c249');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+var g = ctx.createRadialGradient(-80, 25, 70, 0, 25, 150);
+g.addColorStop(0, '#f00');
+g.addColorStop(0.01, '#0f0');
+g.addColorStop(0.99, '#0f0');
+g.addColorStop(1, '#f00');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 50,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,25, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 50,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.radial.touch3.html ]]] -->
+
+<p>Canvas test: 2d.gradient.radial.touch3</p>
+<canvas id="c250" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_gradient_radial_touch3() {
+
+var canvas = document.getElementById('c250');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+var g = ctx.createRadialGradient(120, -15, 25, 140, -30, 50);
+g.addColorStop(0, '#f00');
+g.addColorStop(1, '#f00');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 50,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,25, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 50,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.radial.transform.1.html ]]] -->
+
+<p>Canvas test: 2d.gradient.radial.transform.1</p>
+<!-- Testing: Radial gradient coordinates are relative to the coordinate space at the time of filling -->
+<canvas id="c251" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_gradient_radial_transform_1() {
+
+var canvas = document.getElementById('c251');
+var ctx = canvas.getContext('2d');
+
+var g = ctx.createRadialGradient(0, 0, 0, 0, 0, 11.2);
+g.addColorStop(0, '#0f0');
+g.addColorStop(0.5, '#0f0');
+g.addColorStop(0.51, '#f00');
+g.addColorStop(1, '#f00');
+ctx.fillStyle = g;
+ctx.translate(50, 25);
+ctx.scale(10, 10);
+ctx.fillRect(-5, -2.5, 10, 5);
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.radial.transform.2.html ]]] -->
+
+<p>Canvas test: 2d.gradient.radial.transform.2</p>
+<!-- Testing: Radial gradient coordinates are relative to the coordinate space at the time of filling -->
+<canvas id="c252" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_gradient_radial_transform_2() {
+
+var canvas = document.getElementById('c252');
+var ctx = canvas.getContext('2d');
+
+ctx.translate(100, 0);
+var g = ctx.createRadialGradient(0, 0, 0, 0, 0, 11.2);
+g.addColorStop(0, '#0f0');
+g.addColorStop(0.5, '#0f0');
+g.addColorStop(0.51, '#f00');
+g.addColorStop(1, '#f00');
+ctx.fillStyle = g;
+ctx.translate(-50, 25);
+ctx.scale(10, 10);
+ctx.fillRect(-5, -2.5, 10, 5);
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.gradient.radial.transform.3.html ]]] -->
+
+<p>Canvas test: 2d.gradient.radial.transform.3</p>
+<!-- Testing: Radial gradient transforms do not experience broken caching effects -->
+<canvas id="c253" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_gradient_radial_transform_3() {
+
+var canvas = document.getElementById('c253');
+var ctx = canvas.getContext('2d');
+
+var g = ctx.createRadialGradient(0, 0, 0, 0, 0, 11.2);
+g.addColorStop(0, '#0f0');
+g.addColorStop(0.5, '#0f0');
+g.addColorStop(0.51, '#f00');
+g.addColorStop(1, '#f00');
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+ctx.translate(50, 25);
+ctx.scale(10, 10);
+ctx.fillRect(-5, -2.5, 10, 5);
+
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.create.basic.html ]]] -->
+
+<p>Canvas test: 2d.imageData.create.basic - bug 433004</p>
+<!-- Testing: createImageData() exists and returns something -->
+<canvas id="c254" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_create_basic() {
+
+var canvas = document.getElementById('c254');
+var ctx = canvas.getContext('2d');
+
+ok(ctx.createImageData(1, 1) !== null, "ctx.createImageData(1, 1) !== null");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.create1.basic.html ]]] -->
+
+<p>Canvas test: 2d.imageData.create1.basic - bug 630040</p>
+<!-- Testing: createImageData(imgdata) exists and returns something -->
+<canvas id="c254a" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_create1_basic() {
+
+var canvas = document.getElementById('c254a');
+var ctx = canvas.getContext('2d');
+
+ok(ctx.createImageData(ctx.createImageData(1, 1)) != null, "ctx.createImageData(ctx.createImageData(1, 1)) != null");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.create.initial.html ]]] -->
+
+<p>Canvas test: 2d.imageData.create.initial - bug 433004</p>
+<!-- Testing: createImageData() returns transparent black data of the right size -->
+<canvas id="c255" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_create_initial() {
+
+var canvas = document.getElementById('c255');
+var ctx = canvas.getContext('2d');
+
+var imgdata = ctx.createImageData(10, 20);
+ok(imgdata.data.length == imgdata.width*imgdata.height*4, "imgdata.data.length == imgdata.width*imgdata.height*4");
+ok(imgdata.width < imgdata.height, "imgdata.width < imgdata.height");
+ok(imgdata.width > 0, "imgdata.width > 0");
+var isTransparentBlack = true;
+for (var i = 0; i < imgdata.data.length; ++i)
+ if (imgdata.data[i] !== 0)
+ isTransparentBlack = false;
+ok(isTransparentBlack, "isTransparentBlack");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.create1.initial.html ]]] -->
+
+<p>Canvas test: 2d.imageData.create1.initial - bug 630040</p>
+<!-- Testing: createImageData(imgdata) returns transparent black data of the right size -->
+<canvas id="c255a" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_create1_initial() {
+
+var canvas = document.getElementById('c255a');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+var imgdata1 = ctx.getImageData(0, 0, 10, 20);
+var imgdata2 = ctx.createImageData(imgdata1);
+ok(imgdata2.data.length == imgdata1.data.length, "imgdata2.data.length == imgdata1.data.length");
+ok(imgdata2.width == imgdata1.width, "imgdata2.width == imgdata1.width");
+ok(imgdata2.height == imgdata1.height, "imgdata2.height == imgdata1.height");
+var isTransparentBlack = true;
+for (var i = 0; i < imgdata2.data.length; ++i)
+ if (imgdata2.data[i] !== 0)
+ isTransparentBlack = false;
+ok(isTransparentBlack, "isTransparentBlack");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.create.large.html ]]] -->
+
+<p>Canvas test: 2d.imageData.create.large - bug 433004</p>
+<!-- Testing: createImageData() works for sizes much larger than the canvas -->
+<canvas id="c256" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_create_large() {
+
+var canvas = document.getElementById('c256');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+
+var imgdata = ctx.createImageData(1000, 2000);
+ok(imgdata.data.length == imgdata.width*imgdata.height*4, "imgdata.data.length == imgdata.width*imgdata.height*4");
+ok(imgdata.width < imgdata.height, "imgdata.width < imgdata.height");
+ok(imgdata.width > 0, "imgdata.width > 0");
+var isTransparentBlack = true;
+for (var i = 0; i < imgdata.data.length; i += 7813) // check ~1024 points (assuming normal scaling)
+ if (imgdata.data[i] !== 0)
+ isTransparentBlack = false;
+ok(isTransparentBlack, "isTransparentBlack");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.create.negative.html ]]] -->
+
+<p>Canvas test: 2d.imageData.create.negative - bug 433004</p>
+<!-- Testing: createImageData() takes the absolute magnitude of the size arguments -->
+<canvas id="c257" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_create_negative() {
+
+var canvas = document.getElementById('c257');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+var imgdata1 = ctx.createImageData(10, 20);
+var imgdata2 = ctx.createImageData(-10, 20);
+var imgdata3 = ctx.createImageData(10, -20);
+var imgdata4 = ctx.createImageData(-10, -20);
+ok(imgdata1.data.length == imgdata2.data.length, "imgdata1.data.length == imgdata2.data.length");
+ok(imgdata2.data.length == imgdata3.data.length, "imgdata2.data.length == imgdata3.data.length");
+ok(imgdata3.data.length == imgdata4.data.length, "imgdata3.data.length == imgdata4.data.length");
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.create.nonfinite.html ]]] -->
+
+<p>Canvas test: 2d.imageData.create.nonfinite - bug 433004</p>
+<!-- Testing: createImageData() throws NOT_SUPPORTED_ERR if arguments are not finite -->
+<canvas id="c258" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_create_nonfinite() {
+
+var canvas = document.getElementById('c258');
+var ctx = canvas.getContext('2d');
+
+var _thrown = undefined; try {
+ ctx.createImageData(Infinity, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createImageData(-Infinity, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createImageData(NaN, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createImageData(10, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createImageData(10, -Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createImageData(10, NaN);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createImageData(Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createImageData({valueOf:() => Infinity}, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createImageData({valueOf:() => -Infinity}, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createImageData({valueOf:() => NaN}, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createImageData(10, {valueOf:() => Infinity});
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createImageData(10, {valueOf:() => -Infinity});
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createImageData(10, {valueOf:() => NaN});
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.createImageData({valueOf:() => Infinity}, {valueOf:() => Infinity});
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.create.round.html ]]] -->
+
+<p>Canvas test: 2d.imageData.create.round - bug 433004</p>
+<!-- Testing: createImageData(w, h) is rounded the same as getImageData(0, 0, w, h) -->
+<canvas id="c259" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_create_round() {
+
+var canvas = document.getElementById('c259');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+
+var imgdata1 = ctx.createImageData(10.01, 10.99);
+var imgdata2 = ctx.getImageData(0, 0, 10.01, 10.99);
+is(imgdata1.width, imgdata2.width, "imgdata1.width == imgdata2.width");
+is(imgdata1.height, imgdata2.height, "imgdata1.height == imgdata2.height");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.create.tiny.html ]]] -->
+
+<p>Canvas test: 2d.imageData.create.tiny - bug 433004</p>
+<!-- Testing: createImageData() works for sizes smaller than one pixel -->
+<canvas id="c260" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_create_tiny() {
+
+var canvas = document.getElementById('c260');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+ var imgdata = ctx.createImageData(0.0001, 0.0001);
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(_thrown_outer, ctx.canvas.id + ' should throw exception');
+}
+</script>
+
+<!-- [[[ test_2d.imageData.create.type.html ]]] -->
+
+<p>Canvas test: 2d.imageData.create.type - bug 433004</p>
+<!-- Testing: createImageData() returns an ImageData object containing a Uint8ClampedArray object -->
+<canvas id="c261" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_create_type() {
+
+var canvas = document.getElementById('c261');
+var ctx = canvas.getContext('2d');
+
+ok(window.ImageData !== undefined, "window.ImageData !== undefined");
+ok(window.Uint8ClampedArray !== undefined, "window.Uint8ClampedArray !== undefined");
+window.ImageData.prototype.thisImplementsImageData = true;
+window.Uint8ClampedArray.prototype.thisImplementsUint8ClampedArray = true;
+var imgdata = ctx.createImageData(1, 1);
+ok(imgdata.thisImplementsImageData, "imgdata.thisImplementsImageData");
+ok(imgdata.data.thisImplementsUint8ClampedArray, "imgdata.data.thisImplementsUint8ClampedArray");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.create1.type.html ]]] -->
+
+<p>Canvas test: 2d.imageData.create1.type - bug 630040</p>
+<!-- Testing: createImageData(imgdata) returns an ImageData object containing a Uint8ClampedArray object -->
+<canvas id="c261a" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_create1_type() {
+
+var canvas = document.getElementById('c261a');
+var ctx = canvas.getContext('2d');
+
+ok(window.ImageData !== undefined, "window.ImageData !== undefined");
+ok(window.Uint8ClampedArray !== undefined, "window.Uint8ClampedArray !== undefined");
+window.ImageData.prototype.thisImplementsImageData = true;
+window.Uint8ClampedArray.prototype.thisImplementsUint8ClampedArray = true;
+var imgdata = ctx.createImageData(ctx.createImageData(1, 1));
+ok(imgdata.thisImplementsImageData, "imgdata.thisImplementsImageData");
+ok(imgdata.data.thisImplementsUint8ClampedArray, "imgdata.data.thisImplementsUint8ClampedArray");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.create.zero.html ]]] -->
+
+<p>Canvas test: 2d.imageData.create.zero - bug 433004</p>
+<!-- Testing: createImageData() throws INDEX_SIZE_ERR if size is zero -->
+<canvas id="c262" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_create_zero() {
+
+var canvas = document.getElementById('c262');
+var ctx = canvas.getContext('2d');
+
+var _thrown = undefined; try {
+ ctx.createImageData(10, 0);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
+var _thrown = undefined; try {
+ ctx.createImageData(0, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
+var _thrown = undefined; try {
+ ctx.createImageData(0, 0);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.create1.zero.html ]]] -->
+
+<p>Canvas test: 2d.imageData.create1.zero - bug 630040</p>
+<!-- Testing: createImageData(null) throws TypeError -->
+<canvas id="c262a" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_create1_zero() {
+
+var canvas = document.getElementById('c262a');
+var ctx = canvas.getContext('2d');
+
+var _thrown = undefined; try {
+ ctx.createImageData(null);
+} catch (e) { _thrown = e };
+ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.get.basic.html ]]] -->
+
+<p>Canvas test: 2d.imageData.get.basic</p>
+<!-- Testing: getImageData() exists and returns something -->
+<canvas id="c263" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_get_basic() {
+
+var canvas = document.getElementById('c263');
+var ctx = canvas.getContext('2d');
+
+ok(ctx.getImageData(0, 0, 100, 50) !== null, "ctx.getImageData(0, 0, 100, 50) !== null");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.get.clamp.html ]]] -->
+
+<p>Canvas test: 2d.imageData.get.clamp</p>
+<!-- Testing: getImageData() clamps colours to the range [0, 255] -->
+<canvas id="c264" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_get_clamp() {
+
+var canvas = document.getElementById('c264');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = 'rgb(-100, -200, -300)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = 'rgb(256, 300, 400)';
+ctx.fillRect(20, 10, 60, 10);
+var imgdata1 = ctx.getImageData(10, 5, 1, 1);
+ok(imgdata1.data[0] === 0, "imgdata1.data[\""+(0)+"\"] === 0");
+ok(imgdata1.data[1] === 0, "imgdata1.data[\""+(1)+"\"] === 0");
+ok(imgdata1.data[2] === 0, "imgdata1.data[\""+(2)+"\"] === 0");
+var imgdata2 = ctx.getImageData(30, 15, 1, 1);
+ok(imgdata2.data[0] === 255, "imgdata2.data[\""+(0)+"\"] === 255");
+ok(imgdata2.data[1] === 255, "imgdata2.data[\""+(1)+"\"] === 255");
+ok(imgdata2.data[2] === 255, "imgdata2.data[\""+(2)+"\"] === 255");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.get.nonfinite.html ]]] -->
+
+<p>Canvas test: 2d.imageData.get.nonfinite</p>
+<!-- Testing: getImageData() throws NOT_SUPPORTED_ERR if arguments are not finite -->
+<canvas id="c265" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+// eslint-disable-next-line complexity
+function test_2d_imageData_get_nonfinite() {
+
+var canvas = document.getElementById('c265');
+var ctx = canvas.getContext('2d');
+
+var _thrown = undefined; try {
+ ctx.getImageData(Infinity, 10, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(-Infinity, 10, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(NaN, 10, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(10, Infinity, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(10, -Infinity, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(10, NaN, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(10, 10, Infinity, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(10, 10, -Infinity, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(10, 10, NaN, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(10, 10, 10, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(10, 10, 10, -Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(10, 10, 10, NaN);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(Infinity, Infinity, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(Infinity, Infinity, Infinity, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(Infinity, Infinity, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(Infinity, Infinity, 10, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(Infinity, 10, Infinity, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(Infinity, 10, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(Infinity, 10, 10, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(10, Infinity, Infinity, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(10, Infinity, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(10, Infinity, 10, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(10, 10, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData({valueOf:() => Infinity}, 10, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData({valueOf:() => -Infinity}, 10, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData({valueOf:() => NaN}, 10, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(10, {valueOf:() => Infinity}, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(10, {valueOf:() => -Infinity}, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(10, {valueOf:() => NaN}, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(10, 10, {valueOf:() => Infinity}, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(10, 10, {valueOf:() => -Infinity}, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(10, 10, {valueOf:() => NaN}, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(10, 10, 10, {valueOf:() => Infinity});
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(10, 10, 10, {valueOf:() => -Infinity});
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(10, 10, 10, {valueOf:() => NaN});
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData({valueOf:() => Infinity}, {valueOf:() => Infinity}, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData({valueOf:() => Infinity}, {valueOf:() => Infinity}, {valueOf:() => Infinity}, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData({valueOf:() => Infinity}, {valueOf:() => Infinity}, {valueOf:() => Infinity}, {valueOf:() => Infinity});
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData({valueOf:() => Infinity}, {valueOf:() => Infinity}, 10, {valueOf:() => Infinity});
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData({valueOf:() => Infinity}, 10, {valueOf:() => Infinity}, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData({valueOf:() => Infinity}, 10, {valueOf:() => Infinity}, {valueOf:() => Infinity});
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData({valueOf:() => Infinity}, 10, 10, {valueOf:() => Infinity});
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(10, {valueOf:() => Infinity}, {valueOf:() => Infinity}, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(10, {valueOf:() => Infinity}, {valueOf:() => Infinity}, {valueOf:() => Infinity});
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(10, {valueOf:() => Infinity}, 10, {valueOf:() => Infinity});
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.getImageData(10, 10, {valueOf:() => Infinity}, {valueOf:() => Infinity});
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.get.nonpremul.html ]]] -->
+
+<p>Canvas test: 2d.imageData.get.nonpremul</p>
+<!-- Testing: getImageData() returns non-premultiplied colours -->
+<canvas id="c266" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_get_nonpremul() {
+
+var canvas = document.getElementById('c266');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = 'rgba(255, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+var imgdata = ctx.getImageData(10, 10, 10, 10);
+ok(imgdata.data[0] > 200, "imgdata.data[\""+(0)+"\"] > 200");
+ok(imgdata.data[1] > 200, "imgdata.data[\""+(1)+"\"] > 200");
+ok(imgdata.data[2] > 200, "imgdata.data[\""+(2)+"\"] > 200");
+ok(imgdata.data[3] > 100, "imgdata.data[\""+(3)+"\"] > 100");
+ok(imgdata.data[3] < 200, "imgdata.data[\""+(3)+"\"] < 200");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.get.order.alpha.html ]]] -->
+
+<p>Canvas test: 2d.imageData.get.order.alpha</p>
+<!-- Testing: getImageData() returns A in the fourth component -->
+<canvas id="c267" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_get_order_alpha() {
+
+var canvas = document.getElementById('c267');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = 'rgba(0, 0, 0, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+var imgdata = ctx.getImageData(0, 0, 10, 10);
+ok(imgdata.data[3] < 200, "imgdata.data[\""+(3)+"\"] < 200");
+ok(imgdata.data[3] > 100, "imgdata.data[\""+(3)+"\"] > 100");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.get.order.cols.html ]]] -->
+
+<p>Canvas test: 2d.imageData.get.order.cols</p>
+<!-- Testing: getImageData() returns leftmost columns first -->
+<canvas id="c268" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_get_order_cols() {
+
+var canvas = document.getElementById('c268');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#fff';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#000';
+ctx.fillRect(0, 0, 2, 50);
+var imgdata = ctx.getImageData(0, 0, 10, 10);
+ok(imgdata.data[0] === 0, "imgdata.data[\""+(0)+"\"] === 0");
+ok(imgdata.data[Math.round(imgdata.width/2*4)] === 255, "imgdata.data[Math.round(imgdata.width/2*4)] === 255");
+ok(imgdata.data[Math.round((imgdata.height/2)*imgdata.width*4)] === 0, "imgdata.data[Math.round((imgdata.height/2)*imgdata.width*4)] === 0");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.get.order.rgb.html ]]] -->
+
+<p>Canvas test: 2d.imageData.get.order.rgb</p>
+<!-- Testing: getImageData() returns R then G then B -->
+<canvas id="c269" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_get_order_rgb() {
+
+var canvas = document.getElementById('c269');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#48c';
+ctx.fillRect(0, 0, 100, 50);
+var imgdata = ctx.getImageData(0, 0, 10, 10);
+ok(imgdata.data[0] === 0x44, "imgdata.data[\""+(0)+"\"] === 0x44");
+ok(imgdata.data[1] === 0x88, "imgdata.data[\""+(1)+"\"] === 0x88");
+ok(imgdata.data[2] === 0xCC, "imgdata.data[\""+(2)+"\"] === 0xCC");
+ok(imgdata.data[3] === 255, "imgdata.data[\""+(3)+"\"] === 255");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.get.order.rows.html ]]] -->
+
+<p>Canvas test: 2d.imageData.get.order.rows</p>
+<!-- Testing: getImageData() returns topmost rows first -->
+<canvas id="c270" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_get_order_rows() {
+
+var canvas = document.getElementById('c270');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#fff';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#000';
+ctx.fillRect(0, 0, 100, 2);
+var imgdata = ctx.getImageData(0, 0, 10, 10);
+ok(imgdata.data[0] === 0, "imgdata.data[\""+(0)+"\"] === 0");
+ok(imgdata.data[Math.floor(imgdata.width/2*4)] === 0, "imgdata.data[Math.floor(imgdata.width/2*4)] === 0");
+ok(imgdata.data[(imgdata.height/2)*imgdata.width*4] === 255, "imgdata.data[(imgdata.height/2)*imgdata.width*4] === 255");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.get.range.html ]]] -->
+
+<p>Canvas test: 2d.imageData.get.range</p>
+<!-- Testing: getImageData() returns values in the range [0, 255] -->
+<canvas id="c271" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_get_range() {
+
+var canvas = document.getElementById('c271');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#000';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#fff';
+ctx.fillRect(20, 10, 60, 10);
+var imgdata1 = ctx.getImageData(10, 5, 1, 1);
+ok(imgdata1.data[0] === 0, "imgdata1.data[\""+(0)+"\"] === 0");
+var imgdata2 = ctx.getImageData(30, 15, 1, 1);
+ok(imgdata2.data[0] === 255, "imgdata2.data[\""+(0)+"\"] === 255");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.get.source.negative.html ]]] -->
+
+<p>Canvas test: 2d.imageData.get.source.negative</p>
+<!-- Testing: getImageData() works with negative width and height -->
+<canvas id="c272" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_get_source_negative() {
+
+var canvas = document.getElementById('c272');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#000';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#fff';
+ctx.fillRect(20, 10, 60, 10);
+
+var imgdata1 = ctx.getImageData(85, 25, -10, -10);
+ok(imgdata1.data[0] === 255, "imgdata1.data[\""+(0)+"\"] === 255");
+ok(imgdata1.data[1] === 255, "imgdata1.data[\""+(1)+"\"] === 255");
+ok(imgdata1.data[2] === 255, "imgdata1.data[\""+(2)+"\"] === 255");
+ok(imgdata1.data[3] === 255, "imgdata1.data[\""+(3)+"\"] === 255");
+ok(imgdata1.data[imgdata1.data.length-4+0] === 0, "imgdata1.data[imgdata1.data.length-4+0] === 0");
+ok(imgdata1.data[imgdata1.data.length-4+1] === 0, "imgdata1.data[imgdata1.data.length-4+1] === 0");
+ok(imgdata1.data[imgdata1.data.length-4+2] === 0, "imgdata1.data[imgdata1.data.length-4+2] === 0");
+ok(imgdata1.data[imgdata1.data.length-4+3] === 255, "imgdata1.data[imgdata1.data.length-4+3] === 255");
+
+var imgdata2 = ctx.getImageData(0, 0, -1, -1);
+ok(imgdata2.data[0] === 0, "imgdata2.data[\""+(0)+"\"] === 0");
+ok(imgdata2.data[1] === 0, "imgdata2.data[\""+(1)+"\"] === 0");
+ok(imgdata2.data[2] === 0, "imgdata2.data[\""+(2)+"\"] === 0");
+ok(imgdata2.data[3] === 0, "imgdata2.data[\""+(3)+"\"] === 0");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.get.source.outside.html ]]] -->
+
+<p>Canvas test: 2d.imageData.get.source.outside</p>
+<!-- Testing: getImageData() returns transparent black outside the canvas -->
+<canvas id="c273" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_get_source_outside() {
+
+var canvas = document.getElementById('c273');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.fillStyle = '#08f';
+ctx.fillRect(0, 0, 100, 50);
+
+var imgdata1 = ctx.getImageData(-10, 5, 1, 1);
+ok(imgdata1.data[0] === 0, "imgdata1.data[\""+(0)+"\"] === 0");
+ok(imgdata1.data[1] === 0, "imgdata1.data[\""+(1)+"\"] === 0");
+ok(imgdata1.data[2] === 0, "imgdata1.data[\""+(2)+"\"] === 0");
+ok(imgdata1.data[3] === 0, "imgdata1.data[\""+(3)+"\"] === 0");
+
+var imgdata2 = ctx.getImageData(10, -5, 1, 1);
+ok(imgdata2.data[0] === 0, "imgdata2.data[\""+(0)+"\"] === 0");
+ok(imgdata2.data[1] === 0, "imgdata2.data[\""+(1)+"\"] === 0");
+ok(imgdata2.data[2] === 0, "imgdata2.data[\""+(2)+"\"] === 0");
+ok(imgdata2.data[3] === 0, "imgdata2.data[\""+(3)+"\"] === 0");
+
+var imgdata3 = ctx.getImageData(200, 5, 1, 1);
+ok(imgdata3.data[0] === 0, "imgdata3.data[\""+(0)+"\"] === 0");
+ok(imgdata3.data[1] === 0, "imgdata3.data[\""+(1)+"\"] === 0");
+ok(imgdata3.data[2] === 0, "imgdata3.data[\""+(2)+"\"] === 0");
+ok(imgdata3.data[3] === 0, "imgdata3.data[\""+(3)+"\"] === 0");
+
+var imgdata4 = ctx.getImageData(10, 60, 1, 1);
+ok(imgdata4.data[0] === 0, "imgdata4.data[\""+(0)+"\"] === 0");
+ok(imgdata4.data[1] === 0, "imgdata4.data[\""+(1)+"\"] === 0");
+ok(imgdata4.data[2] === 0, "imgdata4.data[\""+(2)+"\"] === 0");
+ok(imgdata4.data[3] === 0, "imgdata4.data[\""+(3)+"\"] === 0");
+
+var imgdata5 = ctx.getImageData(100, 10, 1, 1);
+ok(imgdata5.data[0] === 0, "imgdata5.data[\""+(0)+"\"] === 0");
+ok(imgdata5.data[1] === 0, "imgdata5.data[\""+(1)+"\"] === 0");
+ok(imgdata5.data[2] === 0, "imgdata5.data[\""+(2)+"\"] === 0");
+ok(imgdata5.data[3] === 0, "imgdata5.data[\""+(3)+"\"] === 0");
+
+var imgdata6 = ctx.getImageData(0, 10, 1, 1);
+ok(imgdata6.data[0] === 0, "imgdata6.data[\""+(0)+"\"] === 0");
+ok(imgdata6.data[1] === 136, "imgdata6.data[\""+(1)+"\"] === 136");
+ok(imgdata6.data[2] === 255, "imgdata6.data[\""+(2)+"\"] === 255");
+ok(imgdata6.data[3] === 255, "imgdata6.data[\""+(3)+"\"] === 255");
+
+var imgdata7 = ctx.getImageData(-10, 10, 20, 20);
+ok(imgdata7.data[ 0*4+0] === 0, "imgdata7.data[ 0*4+0] === 0");
+ok(imgdata7.data[ 0*4+1] === 0, "imgdata7.data[ 0*4+1] === 0");
+ok(imgdata7.data[ 0*4+2] === 0, "imgdata7.data[ 0*4+2] === 0");
+ok(imgdata7.data[ 0*4+3] === 0, "imgdata7.data[ 0*4+3] === 0");
+ok(imgdata7.data[ 9*4+0] === 0, "imgdata7.data[ 9*4+0] === 0");
+ok(imgdata7.data[ 9*4+1] === 0, "imgdata7.data[ 9*4+1] === 0");
+ok(imgdata7.data[ 9*4+2] === 0, "imgdata7.data[ 9*4+2] === 0");
+ok(imgdata7.data[ 9*4+3] === 0, "imgdata7.data[ 9*4+3] === 0");
+ok(imgdata7.data[10*4+0] === 0, "imgdata7.data[10*4+0] === 0");
+ok(imgdata7.data[10*4+1] === 136, "imgdata7.data[10*4+1] === 136");
+ok(imgdata7.data[10*4+2] === 255, "imgdata7.data[10*4+2] === 255");
+ok(imgdata7.data[10*4+3] === 255, "imgdata7.data[10*4+3] === 255");
+ok(imgdata7.data[19*4+0] === 0, "imgdata7.data[19*4+0] === 0");
+ok(imgdata7.data[19*4+1] === 136, "imgdata7.data[19*4+1] === 136");
+ok(imgdata7.data[19*4+2] === 255, "imgdata7.data[19*4+2] === 255");
+ok(imgdata7.data[19*4+3] === 255, "imgdata7.data[19*4+3] === 255");
+ok(imgdata7.data[20*4+0] === 0, "imgdata7.data[20*4+0] === 0");
+ok(imgdata7.data[20*4+1] === 0, "imgdata7.data[20*4+1] === 0");
+ok(imgdata7.data[20*4+2] === 0, "imgdata7.data[20*4+2] === 0");
+ok(imgdata7.data[20*4+3] === 0, "imgdata7.data[20*4+3] === 0");
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.get.source.size.html ]]] -->
+
+<p>Canvas test: 2d.imageData.get.source.size</p>
+<!-- Testing: getImageData() returns bigger ImageData for bigger source rectangle -->
+<canvas id="c274" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_get_source_size() {
+
+var canvas = document.getElementById('c274');
+var ctx = canvas.getContext('2d');
+
+var imgdata1 = ctx.getImageData(0, 0, 10, 10);
+var imgdata2 = ctx.getImageData(0, 0, 20, 20);
+ok(imgdata2.width > imgdata1.width, "imgdata2.width > imgdata1.width");
+ok(imgdata2.height > imgdata1.height, "imgdata2.height > imgdata1.height");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.get.tiny.html ]]] -->
+
+<p>Canvas test: 2d.imageData.get.tiny</p>
+<canvas id="c275" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_get_tiny() {
+
+var canvas = document.getElementById('c275');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+ var imgdata = ctx.getImageData(0, 0, 0.0001, 0.0001);
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(_thrown_outer, ctx.canvas.id + ' should throw');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.get.type.html ]]] -->
+
+<p>Canvas test: 2d.imageData.get.type</p>
+<!-- Testing: getImageData() returns an ImageData object containing a Uint8ClampedArray object -->
+<canvas id="c276" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_get_type() {
+
+var canvas = document.getElementById('c276');
+var ctx = canvas.getContext('2d');
+
+ok(window.ImageData !== undefined, "window.ImageData !== undefined");
+ok(window.Uint8ClampedArray !== undefined, "window.Uint8ClampedArray !== undefined");
+window.ImageData.prototype.thisImplementsImageData = true;
+window.Uint8ClampedArray.prototype.thisImplementsUint8ClampedArray = true;
+var imgdata = ctx.getImageData(0, 0, 1, 1);
+ok(imgdata.thisImplementsImageData, "imgdata.thisImplementsImageData");
+ok(imgdata.data.thisImplementsUint8ClampedArray, "imgdata.data.thisImplementsUint8ClampedArray");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.get.unaffected.html ]]] -->
+
+<p>Canvas test: 2d.imageData.get.unaffected</p>
+<!-- Testing: getImageData() is not affected by context state -->
+<canvas id="c277" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_imageData_get_unaffected() {
+
+var canvas = document.getElementById('c277');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 50, 50)
+ctx.fillStyle = '#f00';
+ctx.fillRect(50, 0, 50, 50)
+ctx.save();
+ctx.translate(50, 0);
+ctx.globalAlpha = 0.1;
+ctx.globalCompositeOperation = 'destination-atop';
+ctx.shadowColor = '#f00';
+ctx.rect(0, 0, 5, 5);
+ctx.clip();
+var imgdata = ctx.getImageData(0, 0, 50, 50);
+ctx.restore();
+ctx.putImageData(imgdata, 50, 0);
+isPixel(ctx, 25,25, 0,255,0,255, 2);
+isPixel(ctx, 75,25, 0,255,0,255, 2);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.get.zero.html ]]] -->
+
+<p>Canvas test: 2d.imageData.get.zero</p>
+<!-- Testing: getImageData() throws INDEX_SIZE_ERR if size is zero -->
+<canvas id="c278" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_get_zero() {
+
+var canvas = document.getElementById('c278');
+var ctx = canvas.getContext('2d');
+
+var _thrown = undefined; try {
+ ctx.getImageData(1, 1, 10, 0);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
+var _thrown = undefined; try {
+ ctx.getImageData(1, 1, 0, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
+var _thrown = undefined; try {
+ ctx.getImageData(1, 1, 0, 0);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.object.clamp.html ]]] -->
+
+<p>Canvas test: 2d.imageData.object.clamp</p>
+<!-- Testing: ImageData.data clamps numbers to [0, 255] -->
+<canvas id="c279" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_object_clamp() {
+
+var canvas = document.getElementById('c279');
+var ctx = canvas.getContext('2d');
+
+var imgdata = ctx.getImageData(0, 0, 10, 10);
+
+imgdata.data[0] = 100;
+imgdata.data[0] = 300;
+ok(imgdata.data[0] === 255, "imgdata.data[\""+(0)+"\"] === 255");
+imgdata.data[0] = 100;
+imgdata.data[0] = -100;
+ok(imgdata.data[0] === 0, "imgdata.data[\""+(0)+"\"] === 0");
+
+imgdata.data[0] = 100;
+imgdata.data[0] = 200+Math.pow(2, 32);
+ok(imgdata.data[0] === 255, "imgdata.data[\""+(0)+"\"] === 255");
+imgdata.data[0] = 100;
+imgdata.data[0] = -200-Math.pow(2, 32);
+ok(imgdata.data[0] === 0, "imgdata.data[\""+(0)+"\"] === 0");
+
+imgdata.data[0] = 100;
+imgdata.data[0] = Math.pow(10, 39);
+ok(imgdata.data[0] === 255, "imgdata.data[\""+(0)+"\"] === 255");
+imgdata.data[0] = 100;
+imgdata.data[0] = -Math.pow(10, 39);
+ok(imgdata.data[0] === 0, "imgdata.data[\""+(0)+"\"] === 0");
+
+imgdata.data[0] = 100;
+imgdata.data[0] = -Infinity;
+ok(imgdata.data[0] === 0, "imgdata.data[\""+(0)+"\"] === 0");
+imgdata.data[0] = 100;
+imgdata.data[0] = Infinity;
+ok(imgdata.data[0] === 255, "imgdata.data[\""+(0)+"\"] === 255");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.object.ctor.html ]]] -->
+
+<p>Canvas test: 2d.imageData.object.ctor</p>
+<!-- Testing: ImageData does not have a usable constructor -->
+<canvas id="c280" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_object_ctor() {
+
+var canvas = document.getElementById('c280');
+var ctx = canvas.getContext('2d');
+
+ok(window.ImageData !== undefined, "window.ImageData !== undefined");
+
+var _thrown_outer = false;
+try {
+
+new window.ImageData(1,1);
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.object.nan.html ]]] -->
+
+<p>Canvas test: 2d.imageData.object.nan</p>
+<!-- Testing: ImageData.data converts NaN to 0 -->
+<canvas id="c281" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_object_nan() {
+
+var canvas = document.getElementById('c281');
+var ctx = canvas.getContext('2d');
+
+var imgdata = ctx.getImageData(0, 0, 10, 10);
+imgdata.data[0] = 100;
+imgdata.data[0] = NaN;
+ok(imgdata.data[0] === 0, "imgdata.data[\""+(0)+"\"] === 0");
+imgdata.data[0] = 100;
+imgdata.data[0] = "cheese";
+ok(imgdata.data[0] === 0, "imgdata.data[\""+(0)+"\"] === 0");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.object.properties.html ]]] -->
+
+<p>Canvas test: 2d.imageData.object.properties</p>
+<!-- Testing: ImageData objects have the right properties -->
+<canvas id="c282" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_object_properties() {
+
+var canvas = document.getElementById('c282');
+var ctx = canvas.getContext('2d');
+
+var imgdata = ctx.getImageData(0, 0, 10, 10);
+ok(typeof(imgdata.width) == 'number', "typeof(imgdata.width) == 'number'");
+ok(typeof(imgdata.height) == 'number', "typeof(imgdata.height) == 'number'");
+ok(typeof(imgdata.data) == 'object', "typeof(imgdata.data) == 'object'");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.object.readonly.html ]]] -->
+
+<p>Canvas test: 2d.imageData.object.readonly</p>
+<!-- Testing: ImageData objects properties are read-only -->
+<canvas id="c283" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_object_readonly() {
+
+var canvas = document.getElementById('c283');
+var ctx = canvas.getContext('2d');
+
+var imgdata = ctx.getImageData(0, 0, 10, 10);
+var w = imgdata.width;
+var h = imgdata.height;
+var d = imgdata.data;
+imgdata.width = 123;
+imgdata.height = 123;
+imgdata.data = [100,100,100,100];
+ok(imgdata.width === w, "imgdata.width === w");
+ok(imgdata.height === h, "imgdata.height === h");
+ok(imgdata.data === d, "imgdata.data === d");
+ok(imgdata.data[0] === 0, "imgdata.data[\""+(0)+"\"] === 0");
+ok(imgdata.data[1] === 0, "imgdata.data[\""+(1)+"\"] === 0");
+ok(imgdata.data[2] === 0, "imgdata.data[\""+(2)+"\"] === 0");
+ok(imgdata.data[3] === 0, "imgdata.data[\""+(3)+"\"] === 0");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.object.round.html ]]] -->
+
+<p>Canvas test: 2d.imageData.object.round</p>
+<!-- Testing: ImageData.data rounds numbers with convertToIntegerTiesToEven -->
+<canvas id="c284" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_object_round() {
+
+var canvas = document.getElementById('c284');
+var ctx = canvas.getContext('2d');
+
+var imgdata = ctx.getImageData(0, 0, 10, 10);
+imgdata.data[0] = 0.499;
+ok(imgdata.data[0] === 0, "imgdata.data[\""+(0)+"\"] === 0");
+imgdata.data[0] = 0.5;
+ok(imgdata.data[0] === 0, "imgdata.data[\""+(0)+"\"] === 0");
+imgdata.data[0] = 0.501;
+ok(imgdata.data[0] === 1, "imgdata.data[\""+(0)+"\"] === 1");
+imgdata.data[0] = 1.499;
+ok(imgdata.data[0] === 1, "imgdata.data[\""+(0)+"\"] === 1");
+imgdata.data[0] = 1.5;
+ok(imgdata.data[0] === 2, "imgdata.data[\""+(0)+"\"] === 2");
+imgdata.data[0] = 1.501;
+ok(imgdata.data[0] === 2, "imgdata.data[\""+(0)+"\"] === 2");
+imgdata.data[0] = 2.5;
+ok(imgdata.data[0] === 2, "imgdata.data[\""+(0)+"\"] === 2");
+imgdata.data[0] = 3.5;
+ok(imgdata.data[0] === 4, "imgdata.data[\""+(0)+"\"] === 4");
+imgdata.data[0] = 252.5;
+ok(imgdata.data[0] === 252, "imgdata.data[\""+(0)+"\"] === 252");
+imgdata.data[0] = 253.5;
+ok(imgdata.data[0] === 254, "imgdata.data[\""+(0)+"\"] === 254");
+imgdata.data[0] = 254.5;
+ok(imgdata.data[0] === 254, "imgdata.data[\""+(0)+"\"] === 254");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.object.set.html ]]] -->
+
+<p>Canvas test: 2d.imageData.object.set</p>
+<!-- Testing: ImageData.data can be modified -->
+<canvas id="c285" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_object_set() {
+
+var canvas = document.getElementById('c285');
+var ctx = canvas.getContext('2d');
+
+var imgdata = ctx.getImageData(0, 0, 10, 10);
+imgdata.data[0] = 100;
+ok(imgdata.data[0] === 100, "imgdata.data[\""+(0)+"\"] === 100");
+imgdata.data[0] = 200;
+ok(imgdata.data[0] === 200, "imgdata.data[\""+(0)+"\"] === 200");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.object.string.html ]]] -->
+
+<p>Canvas test: 2d.imageData.object.string</p>
+<!-- Testing: ImageData.data converts strings to numbers with ToNumber -->
+<canvas id="c286" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_object_string() {
+
+var canvas = document.getElementById('c286');
+var ctx = canvas.getContext('2d');
+
+var imgdata = ctx.getImageData(0, 0, 10, 10);
+imgdata.data[0] = 100;
+imgdata.data[0] = "110";
+ok(imgdata.data[0] === 110, "imgdata.data[\""+(0)+"\"] === 110");
+imgdata.data[0] = 100;
+imgdata.data[0] = "0x78";
+ok(imgdata.data[0] === 120, "imgdata.data[\""+(0)+"\"] === 120");
+imgdata.data[0] = 100;
+imgdata.data[0] = " +130e0 ";
+ok(imgdata.data[0] === 130, "imgdata.data[\""+(0)+"\"] === 130");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.object.undefined.html ]]] -->
+
+<p>Canvas test: 2d.imageData.object.undefined</p>
+<!-- Testing: ImageData.data converts undefined to 0 -->
+<canvas id="c287" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_object_undefined() {
+
+var canvas = document.getElementById('c287');
+var ctx = canvas.getContext('2d');
+
+var imgdata = ctx.getImageData(0, 0, 10, 10);
+imgdata.data[0] = 100;
+imgdata.data[0] = undefined;
+ok(imgdata.data[0] === 0, "imgdata.data[\""+(0)+"\"] === 0");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.put.alpha.html ]]] -->
+
+<p>Canvas test: 2d.imageData.put.alpha</p>
+<!-- Testing: putImageData() puts non-solid image data correctly -->
+<canvas id="c288" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_imageData_put_alpha() {
+
+var canvas = document.getElementById('c288');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = 'rgba(0, 255, 0, 0.25)';
+ctx.fillRect(0, 0, 100, 50)
+var imgdata = ctx.getImageData(0, 0, 100, 50);
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50)
+ctx.putImageData(imgdata, 0, 0);
+isPixel(ctx, 50,25, 0,255,0,64, 2);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.put.basic.html ]]] -->
+
+<p>Canvas test: 2d.imageData.put.basic</p>
+<!-- Testing: putImageData() puts image data from getImageData() onto the canvas -->
+<canvas id="c289" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_imageData_put_basic() {
+
+var canvas = document.getElementById('c289');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50)
+var imgdata = ctx.getImageData(0, 0, 100, 50);
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50)
+ctx.putImageData(imgdata, 0, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 2);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.put.clip.html ]]] -->
+
+<p>Canvas test: 2d.imageData.put.clip - bug 433397</p>
+<!-- Testing: putImageData() is not affected by clipping regions -->
+<canvas id="c290" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_imageData_put_clip() {
+
+var canvas = document.getElementById('c290');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50)
+var imgdata = ctx.getImageData(0, 0, 100, 50);
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50)
+ctx.beginPath();
+ctx.rect(0, 0, 50, 50);
+ctx.clip();
+ctx.putImageData(imgdata, 0, 0);
+isPixel(ctx, 25,25, 0,255,0,255, 2);
+isPixel(ctx, 75,25, 0,255,0,255, 2);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.put.created.html ]]] -->
+
+<p>Canvas test: 2d.imageData.put.created - bug 433004</p>
+<!-- Testing: putImageData() puts image data from createImageData() onto the canvas -->
+<canvas id="c291" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+// eslint-disable-next-line complexity
+function test_2d_imageData_put_created() {
+
+var canvas = document.getElementById('c291');
+var ctx = canvas.getContext('2d');
+
+var imgdata = ctx.createImageData(100, 50);
+for (var i = 0; i < imgdata.data.length; i += 4) {
+ imgdata.data[i] = 0;
+ imgdata.data[i+1] = 255;
+ imgdata.data[i+2] = 0;
+ imgdata.data[i+3] = 255;
+}
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50)
+ctx.putImageData(imgdata, 0, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 2);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.put.cross.html ]]] -->
+
+<p>Canvas test: 2d.imageData.put.cross</p>
+<!-- Testing: putImageData() accepts image data got from a different canvas -->
+<canvas id="c292" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_imageData_put_cross() {
+
+var canvas = document.getElementById('c292');
+var ctx = canvas.getContext('2d');
+
+var canvas2 = document.createElement('canvas');
+var ctx2 = canvas2.getContext('2d');
+ctx2.fillStyle = '#0f0';
+ctx2.fillRect(0, 0, 100, 50)
+var imgdata = ctx2.getImageData(0, 0, 100, 50);
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50)
+ctx.putImageData(imgdata, 0, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 2);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.put.dirty.negative.html ]]] -->
+
+<p>Canvas test: 2d.imageData.put.dirty.negative</p>
+<!-- Testing: putImageData() handles negative-sized dirty rectangles correctly -->
+<canvas id="c293" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_imageData_put_dirty_negative() {
+
+var canvas = document.getElementById('c293');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50)
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 20, 20)
+
+var imgdata = ctx.getImageData(0, 0, 100, 50);
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50)
+ctx.fillStyle = '#f00';
+ctx.fillRect(40, 20, 20, 20)
+ctx.putImageData(imgdata, 40, 20, 20, 20, -20, -20);
+
+isPixel(ctx, 50,25, 0,255,0,255, 2);
+isPixel(ctx, 35,25, 0,255,0,255, 2);
+isPixel(ctx, 65,25, 0,255,0,255, 2);
+isPixel(ctx, 50,15, 0,255,0,255, 2);
+isPixel(ctx, 50,45, 0,255,0,255, 2);
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.put.dirty.outside.html ]]] -->
+
+<p>Canvas test: 2d.imageData.put.dirty.outside</p>
+<!-- Testing: putImageData() handles dirty rectangles outside the canvas correctly -->
+<canvas id="c294" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_imageData_put_dirty_outside() {
+
+var canvas = document.getElementById('c294');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50)
+
+var imgdata = ctx.getImageData(0, 0, 100, 50);
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50)
+
+ctx.putImageData(imgdata, 100, 20, 20, 20, -20, -20);
+ctx.putImageData(imgdata, 200, 200, 0, 0, 100, 50);
+ctx.putImageData(imgdata, 40, 20, -30, -20, 30, 20);
+ctx.putImageData(imgdata, -30, 20, 0, 0, 30, 20);
+
+isPixel(ctx, 50,25, 0,255,0,255, 2);
+isPixel(ctx, 98,15, 0,255,0,255, 2);
+isPixel(ctx, 98,25, 0,255,0,255, 2);
+isPixel(ctx, 98,45, 0,255,0,255, 2);
+isPixel(ctx, 1,5, 0,255,0,255, 2);
+isPixel(ctx, 1,25, 0,255,0,255, 2);
+isPixel(ctx, 1,45, 0,255,0,255, 2);
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.put.dirty.rect1.html ]]] -->
+
+<p>Canvas test: 2d.imageData.put.dirty.rect1</p>
+<!-- Testing: putImageData() only modifies areas inside the dirty rectangle, using width and height -->
+<canvas id="c295" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_imageData_put_dirty_rect1() {
+
+var canvas = document.getElementById('c295');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50)
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 20, 20)
+
+var imgdata = ctx.getImageData(0, 0, 100, 50);
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50)
+ctx.fillStyle = '#f00';
+ctx.fillRect(40, 20, 20, 20)
+ctx.putImageData(imgdata, 40, 20, 0, 0, 20, 20);
+
+isPixel(ctx, 50,25, 0,255,0,255, 2);
+isPixel(ctx, 35,25, 0,255,0,255, 2);
+isPixel(ctx, 65,25, 0,255,0,255, 2);
+isPixel(ctx, 50,15, 0,255,0,255, 2);
+isPixel(ctx, 50,45, 0,255,0,255, 2);
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.put.dirty.rect2.html ]]] -->
+
+<p>Canvas test: 2d.imageData.put.dirty.rect2</p>
+<!-- Testing: putImageData() only modifies areas inside the dirty rectangle, using x and y -->
+<canvas id="c296" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_imageData_put_dirty_rect2() {
+
+var canvas = document.getElementById('c296');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50)
+ctx.fillStyle = '#0f0';
+ctx.fillRect(60, 30, 20, 20)
+
+var imgdata = ctx.getImageData(0, 0, 100, 50);
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50)
+ctx.fillStyle = '#f00';
+ctx.fillRect(40, 20, 20, 20)
+ctx.putImageData(imgdata, -20, -10, 60, 30, 20, 20);
+
+isPixel(ctx, 50,25, 0,255,0,255, 2);
+isPixel(ctx, 35,25, 0,255,0,255, 2);
+isPixel(ctx, 65,25, 0,255,0,255, 2);
+isPixel(ctx, 50,15, 0,255,0,255, 2);
+isPixel(ctx, 50,45, 0,255,0,255, 2);
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.put.dirty.zero.html ]]] -->
+
+<p>Canvas test: 2d.imageData.put.dirty.zero</p>
+<!-- Testing: putImageData() with zero-sized dirty rectangle puts nothing -->
+<canvas id="c297" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_imageData_put_dirty_zero() {
+
+var canvas = document.getElementById('c297');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50)
+var imgdata = ctx.getImageData(0, 0, 100, 50);
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50)
+ctx.putImageData(imgdata, 0, 0, 0, 0, 0, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 2);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.put.modified.html ]]] -->
+
+<p>Canvas test: 2d.imageData.put.modified</p>
+<!-- Testing: putImageData() puts modified image data correctly -->
+<canvas id="c298" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_imageData_put_modified() {
+
+var canvas = document.getElementById('c298');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50)
+ctx.fillStyle = '#f00';
+ctx.fillRect(45, 20, 10, 10)
+var imgdata = ctx.getImageData(45, 20, 10, 10);
+for (var i = 0, len = imgdata.width*imgdata.height*4; i < len; i += 4)
+{
+ imgdata.data[i] = 0;
+ imgdata.data[i+1] = 255;
+}
+ctx.putImageData(imgdata, 45, 20);
+isPixel(ctx, 50,25, 0,255,0,255, 2);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.put.nonfinite.html ]]] -->
+
+<p>Canvas test: 2d.imageData.put.nonfinite</p>
+<!-- Testing: putImageData() throws NOT_SUPPORTED_ERR if arguments are not finite -->
+<canvas id="c299" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+// eslint-disable-next-line complexity
+function test_2d_imageData_put_nonfinite() {
+
+var canvas = document.getElementById('c299');
+var ctx = canvas.getContext('2d');
+
+var imgdata = ctx.getImageData(0, 0, 10, 10);
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, -Infinity, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, NaN, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, -Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, NaN);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, 10, 10, 10, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, -Infinity, 10, 10, 10, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, NaN, 10, 10, 10, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, Infinity, 10, 10, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, -Infinity, 10, 10, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, NaN, 10, 10, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, 10, Infinity, 10, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, 10, -Infinity, 10, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, 10, NaN, 10, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, 10, 10, Infinity, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, 10, 10, -Infinity, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, 10, 10, NaN, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, 10, 10, 10, Infinity, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, 10, 10, 10, -Infinity, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, 10, 10, 10, NaN, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, 10, 10, 10, 10, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, 10, 10, 10, 10, -Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, 10, 10, 10, 10, NaN);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, Infinity, 10, 10, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, Infinity, Infinity, 10, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, Infinity, Infinity, Infinity, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, Infinity, Infinity, Infinity, Infinity, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, Infinity, Infinity, Infinity, 10, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, Infinity, Infinity, 10, Infinity, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, Infinity, Infinity, 10, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, Infinity, Infinity, 10, 10, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, Infinity, 10, Infinity, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, Infinity, 10, Infinity, Infinity, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, Infinity, 10, Infinity, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, Infinity, 10, Infinity, 10, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, Infinity, 10, 10, Infinity, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, Infinity, 10, 10, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, Infinity, 10, 10, 10, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, 10, Infinity, 10, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, 10, Infinity, Infinity, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, 10, Infinity, Infinity, Infinity, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, 10, Infinity, Infinity, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, 10, Infinity, Infinity, 10, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, 10, Infinity, 10, Infinity, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, 10, Infinity, 10, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, 10, Infinity, 10, 10, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, 10, 10, Infinity, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, 10, 10, Infinity, Infinity, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, 10, 10, Infinity, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, 10, 10, Infinity, 10, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, 10, 10, 10, Infinity, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, 10, 10, 10, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, Infinity, 10, 10, 10, 10, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, Infinity, Infinity, 10, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, Infinity, Infinity, Infinity, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, Infinity, Infinity, Infinity, Infinity, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, Infinity, Infinity, Infinity, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, Infinity, Infinity, Infinity, 10, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, Infinity, Infinity, 10, Infinity, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, Infinity, Infinity, 10, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, Infinity, Infinity, 10, 10, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, Infinity, 10, Infinity, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, Infinity, 10, Infinity, Infinity, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, Infinity, 10, Infinity, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, Infinity, 10, Infinity, 10, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, Infinity, 10, 10, Infinity, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, Infinity, 10, 10, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, Infinity, 10, 10, 10, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, 10, Infinity, Infinity, 10, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, 10, Infinity, Infinity, Infinity, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, 10, Infinity, Infinity, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, 10, Infinity, Infinity, 10, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, 10, Infinity, 10, Infinity, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, 10, Infinity, 10, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, 10, Infinity, 10, 10, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, 10, 10, Infinity, Infinity, 10);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, 10, 10, Infinity, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, 10, 10, Infinity, 10, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 10, 10, 10, 10, Infinity, Infinity);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.put.null.html ]]] -->
+
+<p>Canvas test: 2d.imageData.put.null - bug 421715</p>
+<!-- Testing: putImageData() with null imagedata throws TYPE_MISMATCH_ERR -->
+<canvas id="c300" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_put_null() {
+
+var canvas = document.getElementById('c300');
+var ctx = canvas.getContext('2d');
+
+var _thrown = undefined; try {
+ ctx.putImageData(null, 0, 0);
+} catch (e) { _thrown = e };
+ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.put.path.html ]]] -->
+
+<p>Canvas test: 2d.imageData.put.path</p>
+<!-- Testing: putImageData() does not affect the current path -->
+<canvas id="c301" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_imageData_put_path() {
+
+var canvas = document.getElementById('c301');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50)
+ctx.rect(0, 0, 100, 50);
+var imgdata = ctx.getImageData(0, 0, 100, 50);
+ctx.putImageData(imgdata, 0, 0);
+ctx.fillStyle = '#0f0';
+ctx.fill();
+isPixel(ctx, 50,25, 0,255,0,255, 2);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.put.unaffected.html ]]] -->
+
+<p>Canvas test: 2d.imageData.put.unaffected</p>
+<!-- Testing: putImageData() is not affected by context state -->
+<canvas id="c302" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_imageData_put_unaffected() {
+
+var canvas = document.getElementById('c302');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50)
+var imgdata = ctx.getImageData(0, 0, 100, 50);
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50)
+ctx.globalAlpha = 0.1;
+ctx.globalCompositeOperation = 'destination-atop';
+ctx.shadowColor = '#f00';
+ctx.translate(100, 50);
+ctx.scale(0.1, 0.1);
+ctx.putImageData(imgdata, 0, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 2);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.put.unchanged.html ]]] -->
+
+<p>Canvas test: 2d.imageData.put.unchanged</p>
+<!-- Testing: putImageData(getImageData(...), ...) has no effect -->
+<canvas id="c303" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_put_unchanged() {
+
+var canvas = document.getElementById('c303');
+var ctx = canvas.getContext('2d');
+
+var i = 0;
+for (var y = 0; y < 16; ++y) {
+ for (var x = 0; x < 16; ++x, ++i) {
+ ctx.fillStyle = 'rgba(' + i + ',' + (Math.floor(i*1.5) % 256) + ',' + (Math.floor(i*23.3) % 256) + ',' + (i/256) + ')';
+ ctx.fillRect(x, y, 1, 1);
+ }
+}
+var imgdata1 = ctx.getImageData(0.1, 0.2, 15.8, 15.9);
+var olddata = [];
+for (var i = 0; i < imgdata1.data.length; ++i)
+ olddata[i] = imgdata1.data[i];
+
+ctx.putImageData(imgdata1, 0.1, 0.2);
+
+var imgdata2 = ctx.getImageData(0.1, 0.2, 15.8, 15.9);
+for (var i = 0; i < imgdata2.data.length; ++i) {
+ ok(olddata[i] === imgdata2.data[i], "olddata[\""+(i)+"\"] === imgdata2.data[\""+(i)+"\"]");
+}
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imageData.put.wrongtype.html ]]] -->
+
+<p>Canvas test: 2d.imageData.put.wrongtype</p>
+<!-- Testing: putImageData() does not accept non-ImageData objects -->
+<canvas id="c304" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_imageData_put_wrongtype() {
+
+var canvas = document.getElementById('c304');
+var ctx = canvas.getContext('2d');
+
+var imgdata = { width: 1, height: 1, data: [255, 0, 0, 255] };
+var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 0, 0);
+} catch (e) { _thrown = e };
+ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
+
+var _thrown = undefined; try {
+ ctx.putImageData("cheese", 0, 0);
+} catch (e) { _thrown = e };
+ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
+
+var _thrown = undefined; try {
+ ctx.putImageData(42, 0, 0);
+} catch (e) { _thrown = e };
+ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
+}
+</script>
+
+<!-- [[[ test_2d.line.cap.butt.html ]]] -->
+
+<p>Canvas test: 2d.line.cap.butt</p>
+<!-- Testing: lineCap 'butt' is rendered correctly -->
+<canvas id="c305" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_line_cap_butt() {
+
+var canvas = document.getElementById('c305');
+var ctx = canvas.getContext('2d');
+
+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);
+
+isPixel(ctx, 25,14, 0,255,0,255, 0);
+isPixel(ctx, 25,15, 0,255,0,255, 0);
+isPixel(ctx, 25,16, 0,255,0,255, 0);
+isPixel(ctx, 25,34, 0,255,0,255, 0);
+isPixel(ctx, 25,35, 0,255,0,255, 0);
+isPixel(ctx, 25,36, 0,255,0,255, 0);
+
+isPixel(ctx, 75,14, 0,255,0,255, 0);
+isPixel(ctx, 75,15, 0,255,0,255, 0);
+isPixel(ctx, 75,16, 0,255,0,255, 0);
+isPixel(ctx, 75,34, 0,255,0,255, 0);
+isPixel(ctx, 75,35, 0,255,0,255, 0);
+isPixel(ctx, 75,36, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.line.cap.closed.html ]]] -->
+
+<p>Canvas test: 2d.line.cap.closed</p>
+<!-- Testing: Line caps are not drawn at the corners of an unclosed rectangle -->
+<canvas id="c306" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_line_cap_closed() {
+
+var canvas = document.getElementById('c306');
+var ctx = canvas.getContext('2d');
+
+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();
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 48,1, 0,255,0,255, 0);
+isPixel(ctx, 48,48, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.line.cap.invalid.html ]]] -->
+
+<p>Canvas test: 2d.line.cap.invalid - bug 401788</p>
+<!-- Testing: Setting lineCap to invalid values is ignored -->
+<canvas id="c307" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_line_cap_invalid() {
+
+var canvas = document.getElementById('c307');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.lineCap = 'butt'
+ok(ctx.lineCap === 'butt', "ctx.lineCap === 'butt'");
+
+ctx.lineCap = 'butt';
+ctx.lineCap = 'invalid';
+ok(ctx.lineCap === 'butt', "ctx.lineCap === 'butt'");
+
+ctx.lineCap = 'butt';
+ctx.lineCap = 'ROUND';
+ok(ctx.lineCap === 'butt', "ctx.lineCap === 'butt'");
+
+ctx.lineCap = 'butt';
+ctx.lineCap = 'round\0';
+ok(ctx.lineCap === 'butt', "ctx.lineCap === 'butt'");
+
+ctx.lineCap = 'butt';
+ctx.lineCap = 'round ';
+ok(ctx.lineCap === 'butt', "ctx.lineCap === 'butt'");
+
+ctx.lineCap = 'butt';
+ctx.lineCap = "";
+ok(ctx.lineCap === 'butt', "ctx.lineCap === 'butt'");
+
+ctx.lineCap = 'butt';
+ctx.lineCap = 'bevel';
+ok(ctx.lineCap === 'butt', "ctx.lineCap === 'butt'");
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.line.cap.open.html ]]] -->
+
+<p>Canvas test: 2d.line.cap.open</p>
+<!-- Testing: Line caps are drawn at the corners of an unclosed rectangle -->
+<canvas id="c308" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_line_cap_open() {
+
+var canvas = document.getElementById('c308');
+var ctx = canvas.getContext('2d');
+
+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();
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 48,1, 0,255,0,255, 0);
+isPixel(ctx, 48,48, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.line.cap.round.html ]]] -->
+
+<p>Canvas test: 2d.line.cap.round</p>
+<!-- Testing: lineCap 'round' is rendered correctly -->
+<canvas id="c309" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_line_cap_round() {
+
+var canvas = document.getElementById('c309');
+var ctx = canvas.getContext('2d');
+
+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();
+
+isPixel(ctx, 17,6, 0,255,0,255, 0);
+isPixel(ctx, 25,6, 0,255,0,255, 0);
+isPixel(ctx, 32,6, 0,255,0,255, 0);
+isPixel(ctx, 17,43, 0,255,0,255, 0);
+isPixel(ctx, 25,43, 0,255,0,255, 0);
+isPixel(ctx, 32,43, 0,255,0,255, 0);
+
+isPixel(ctx, 67,6, 0,255,0,255, 0);
+isPixel(ctx, 75,6, 0,255,0,255, 0);
+isPixel(ctx, 82,6, 0,255,0,255, 0);
+isPixel(ctx, 67,43, 0,255,0,255, 0);
+isPixel(ctx, 75,43, 0,255,0,255, 0);
+isPixel(ctx, 82,43, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.line.cap.square.html ]]] -->
+
+<p>Canvas test: 2d.line.cap.square</p>
+<!-- Testing: lineCap 'square' is rendered correctly -->
+<canvas id="c310" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_line_cap_square() {
+
+var canvas = document.getElementById('c310');
+var ctx = canvas.getContext('2d');
+
+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);
+
+isPixel(ctx, 25,4, 0,255,0,255, 0);
+isPixel(ctx, 25,5, 0,255,0,255, 0);
+isPixel(ctx, 25,6, 0,255,0,255, 0);
+isPixel(ctx, 25,44, 0,255,0,255, 0);
+isPixel(ctx, 25,45, 0,255,0,255, 0);
+isPixel(ctx, 25,46, 0,255,0,255, 0);
+
+isPixel(ctx, 75,4, 0,255,0,255, 0);
+isPixel(ctx, 75,5, 0,255,0,255, 0);
+isPixel(ctx, 75,6, 0,255,0,255, 0);
+isPixel(ctx, 75,44, 0,255,0,255, 0);
+isPixel(ctx, 75,45, 0,255,0,255, 0);
+isPixel(ctx, 75,46, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.line.cross.html ]]] -->
+
+<p>Canvas test: 2d.line.cross</p>
+<canvas id="c311" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_line_cross() {
+
+var canvas = document.getElementById('c311');
+var ctx = canvas.getContext('2d');
+
+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();
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 48,1, 0,255,0,255, 0);
+isPixel(ctx, 48,48, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.line.defaults.html ]]] -->
+
+<p>Canvas test: 2d.line.defaults</p>
+<canvas id="c312" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_line_defaults() {
+
+var canvas = document.getElementById('c312');
+var ctx = canvas.getContext('2d');
+
+ok(ctx.lineWidth === 1, "ctx.lineWidth === 1");
+ok(ctx.lineCap === 'butt', "ctx.lineCap === 'butt'");
+ok(ctx.lineJoin === 'miter', "ctx.lineJoin === 'miter'");
+ok(ctx.miterLimit === 10, "ctx.miterLimit === 10");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.line.join.bevel.html ]]] -->
+
+<p>Canvas test: 2d.line.join.bevel</p>
+<!-- Testing: lineJoin 'bevel' is rendered correctly -->
+<canvas id="c313" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_line_join_bevel() {
+
+var canvas = document.getElementById('c313');
+var ctx = canvas.getContext('2d');
+
+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();
+
+isPixel(ctx, 34,16, 0,255,0,255, 0);
+isPixel(ctx, 34,15, 0,255,0,255, 0);
+isPixel(ctx, 35,15, 0,255,0,255, 0);
+isPixel(ctx, 36,15, 0,255,0,255, 0);
+isPixel(ctx, 36,14, 0,255,0,255, 0);
+
+isPixel(ctx, 84,16, 0,255,0,255, 0);
+isPixel(ctx, 84,15, 0,255,0,255, 0);
+isPixel(ctx, 85,15, 0,255,0,255, 0);
+isPixel(ctx, 86,15, 0,255,0,255, 0);
+isPixel(ctx, 86,14, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.line.join.closed.html ]]] -->
+
+<p>Canvas test: 2d.line.join.closed</p>
+<!-- Testing: Line joins are drawn at the corner of a closed rectangle -->
+<canvas id="c314" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_line_join_closed() {
+
+var canvas = document.getElementById('c314');
+var ctx = canvas.getContext('2d');
+
+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();
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 48,1, 0,255,0,255, 0);
+isPixel(ctx, 48,48, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.line.join.invalid.html ]]] -->
+
+<p>Canvas test: 2d.line.join.invalid - bug 401788</p>
+<!-- Testing: Setting lineJoin to invalid values is ignored -->
+<canvas id="c315" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_line_join_invalid() {
+
+var canvas = document.getElementById('c315');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.lineJoin = 'bevel'
+ok(ctx.lineJoin === 'bevel', "ctx.lineJoin === 'bevel'");
+
+ctx.lineJoin = 'bevel';
+ctx.lineJoin = 'invalid';
+ok(ctx.lineJoin === 'bevel', "ctx.lineJoin === 'bevel'");
+
+ctx.lineJoin = 'bevel';
+ctx.lineJoin = 'ROUND';
+ok(ctx.lineJoin === 'bevel', "ctx.lineJoin === 'bevel'");
+
+ctx.lineJoin = 'bevel';
+ctx.lineJoin = 'round\0';
+ok(ctx.lineJoin === 'bevel', "ctx.lineJoin === 'bevel'");
+
+ctx.lineJoin = 'bevel';
+ctx.lineJoin = 'round ';
+ok(ctx.lineJoin === 'bevel', "ctx.lineJoin === 'bevel'");
+
+ctx.lineJoin = 'bevel';
+ctx.lineJoin = "";
+ok(ctx.lineJoin === 'bevel', "ctx.lineJoin === 'bevel'");
+
+ctx.lineJoin = 'bevel';
+ctx.lineJoin = 'butt';
+ok(ctx.lineJoin === 'bevel', "ctx.lineJoin === 'bevel'");
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.line.join.miter.html ]]] -->
+
+<p>Canvas test: 2d.line.join.miter</p>
+<!-- Testing: lineJoin 'miter' is rendered correctly -->
+<canvas id="c316" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_line_join_miter() {
+
+var canvas = document.getElementById('c316');
+var ctx = canvas.getContext('2d');
+
+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);
+
+isPixel(ctx, 38,12, 0,255,0,255, 0);
+isPixel(ctx, 39,11, 0,255,0,255, 0);
+isPixel(ctx, 40,10, 0,255,0,255, 0);
+isPixel(ctx, 41,9, 0,255,0,255, 0);
+isPixel(ctx, 42,8, 0,255,0,255, 0);
+
+isPixel(ctx, 88,12, 0,255,0,255, 0);
+isPixel(ctx, 89,11, 0,255,0,255, 0);
+isPixel(ctx, 90,10, 0,255,0,255, 0);
+isPixel(ctx, 91,9, 0,255,0,255, 0);
+isPixel(ctx, 92,8, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.line.join.open.html ]]] -->
+
+<p>Canvas test: 2d.line.join.open</p>
+<!-- Testing: Line joins are not drawn at the corner of an unclosed rectangle -->
+<canvas id="c317" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_line_join_open() {
+
+var canvas = document.getElementById('c317');
+var ctx = canvas.getContext('2d');
+
+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();
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 48,1, 0,255,0,255, 0);
+isPixel(ctx, 48,48, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.line.join.parallel.html ]]] -->
+
+<p>Canvas test: 2d.line.join.parallel</p>
+<!-- Testing: Line joins are drawn at 180-degree joins -->
+<canvas id="c318" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_line_join_parallel() {
+
+var canvas = document.getElementById('c318');
+var ctx = canvas.getContext('2d');
+
+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();
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 48,1, 0,255,0,255, 0);
+isPixel(ctx, 48,48, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.line.join.round.html ]]] -->
+
+<p>Canvas test: 2d.line.join.round</p>
+<!-- Testing: lineJoin 'round' is rendered correctly -->
+<canvas id="c319" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_line_join_round() {
+
+var canvas = document.getElementById('c319');
+var ctx = canvas.getContext('2d');
+
+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();
+
+isPixel(ctx, 36,14, 0,255,0,255, 0);
+isPixel(ctx, 36,13, 0,255,0,255, 0);
+isPixel(ctx, 37,13, 0,255,0,255, 0);
+isPixel(ctx, 38,13, 0,255,0,255, 0);
+isPixel(ctx, 38,12, 0,255,0,255, 0);
+
+isPixel(ctx, 86,14, 0,255,0,255, 0);
+isPixel(ctx, 86,13, 0,255,0,255, 0);
+isPixel(ctx, 87,13, 0,255,0,255, 0);
+isPixel(ctx, 88,13, 0,255,0,255, 0);
+isPixel(ctx, 88,12, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.line.miter.acute.html ]]] -->
+
+<p>Canvas test: 2d.line.miter.acute</p>
+<!-- Testing: Miter joins are drawn correctly with acute angles -->
+<canvas id="c320" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_line_miter_acute() {
+
+var canvas = document.getElementById('c320');
+var ctx = canvas.getContext('2d');
+
+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();
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 48,1, 0,255,0,255, 0);
+isPixel(ctx, 48,48, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.line.miter.exceeded.html ]]] -->
+
+<p>Canvas test: 2d.line.miter.exceeded</p>
+<!-- Testing: Miter joins are not drawn when the miter limit is exceeded -->
+<canvas id="c321" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_line_miter_exceeded() {
+
+var canvas = document.getElementById('c321');
+var ctx = canvas.getContext('2d');
+
+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();
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 48,1, 0,255,0,255, 0);
+isPixel(ctx, 48,48, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.line.miter.invalid.html ]]] -->
+
+<p>Canvas test: 2d.line.miter.invalid</p>
+<!-- Testing: Setting miterLimit to invalid values is ignored -->
+<canvas id="c322" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_line_miter_invalid() {
+
+var canvas = document.getElementById('c322');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.miterLimit = 1.5;
+ok(ctx.miterLimit === 1.5, "ctx.miterLimit === 1.5");
+
+ctx.miterLimit = 1.5;
+ctx.miterLimit = 0;
+ok(ctx.miterLimit === 1.5, "ctx.miterLimit === 1.5");
+
+ctx.miterLimit = 1.5;
+ctx.miterLimit = -1;
+ok(ctx.miterLimit === 1.5, "ctx.miterLimit === 1.5");
+
+ctx.miterLimit = 1.5;
+ctx.miterLimit = Infinity;
+ok(ctx.miterLimit === 1.5, "ctx.miterLimit === 1.5");
+
+ctx.miterLimit = 1.5;
+ctx.miterLimit = -Infinity;
+ok(ctx.miterLimit === 1.5, "ctx.miterLimit === 1.5");
+
+ctx.miterLimit = 1.5;
+ctx.miterLimit = NaN;
+ok(ctx.miterLimit === 1.5, "ctx.miterLimit === 1.5");
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.line.miter.lineedge.html ]]] -->
+
+<p>Canvas test: 2d.line.miter.lineedge - bug 401791</p>
+<!-- Testing: Miter joins are not drawn when the miter limit is exceeded at the corners of a zero-height rectangle -->
+<canvas id="c323" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_line_miter_lineedge() {
+
+var canvas = document.getElementById('c323');
+var ctx = canvas.getContext('2d');
+
+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);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 48,1, 0,255,0,255, 0);
+isPixel(ctx, 48,48, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.line.miter.obtuse.html ]]] -->
+
+<p>Canvas test: 2d.line.miter.obtuse</p>
+<!-- Testing: Miter joins are drawn correctly with obtuse angles -->
+<canvas id="c324" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_line_miter_obtuse() {
+
+var canvas = document.getElementById('c324');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+var x=800;
+var y=300;
+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();
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 48,1, 0,255,0,255, 0);
+isPixel(ctx, 48,48, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.line.miter.rightangle.html ]]] -->
+
+<p>Canvas test: 2d.line.miter.rightangle - bug 401791</p>
+<!-- Testing: Miter joins are not drawn when the miter limit is exceeded, on exact right angles -->
+<canvas id="c325" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_line_miter_rightangle() {
+
+var canvas = document.getElementById('c325');
+var ctx = canvas.getContext('2d');
+
+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();
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 48,1, 0,255,0,255, 0);
+isPixel(ctx, 48,48, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.line.miter.within.html ]]] -->
+
+<p>Canvas test: 2d.line.miter.within</p>
+<!-- Testing: Miter joins are drawn when the miter limit is not quite exceeded -->
+<canvas id="c326" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_line_miter_within() {
+
+var canvas = document.getElementById('c326');
+var ctx = canvas.getContext('2d');
+
+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();
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 48,1, 0,255,0,255, 0);
+isPixel(ctx, 48,48, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.line.union.html ]]] -->
+
+<p>Canvas test: 2d.line.union</p>
+<canvas id="c327" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_line_union() {
+
+var canvas = document.getElementById('c327');
+var ctx = canvas.getContext('2d');
+
+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();
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 25,1, 0,255,0,255, 0);
+isPixel(ctx, 48,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 25,1, 0,255,0,255, 0);
+isPixel(ctx, 48,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.line.width.basic.html ]]] -->
+
+<p>Canvas test: 2d.line.width.basic</p>
+<!-- Testing: lineWidth determines the width of line strokes -->
+<canvas id="c328" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_line_width_basic() {
+
+var canvas = document.getElementById('c328');
+var ctx = canvas.getContext('2d');
+
+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);
+
+isPixel(ctx, 14,25, 0,255,0,255, 0);
+isPixel(ctx, 15,25, 0,255,0,255, 0);
+isPixel(ctx, 16,25, 0,255,0,255, 0);
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 34,25, 0,255,0,255, 0);
+isPixel(ctx, 35,25, 0,255,0,255, 0);
+isPixel(ctx, 36,25, 0,255,0,255, 0);
+
+isPixel(ctx, 64,25, 0,255,0,255, 0);
+isPixel(ctx, 65,25, 0,255,0,255, 0);
+isPixel(ctx, 66,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+isPixel(ctx, 84,25, 0,255,0,255, 0);
+isPixel(ctx, 85,25, 0,255,0,255, 0);
+isPixel(ctx, 86,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.line.width.invalid.html ]]] -->
+
+<p>Canvas test: 2d.line.width.invalid</p>
+<!-- Testing: Setting lineWidth to invalid values is ignored -->
+<canvas id="c329" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_line_width_invalid() {
+
+var canvas = document.getElementById('c329');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.lineWidth = 1.5;
+ok(ctx.lineWidth === 1.5, "ctx.lineWidth === 1.5");
+
+ctx.lineWidth = 1.5;
+ctx.lineWidth = 0;
+ok(ctx.lineWidth === 1.5, "ctx.lineWidth === 1.5");
+
+ctx.lineWidth = 1.5;
+ctx.lineWidth = -1;
+ok(ctx.lineWidth === 1.5, "ctx.lineWidth === 1.5");
+
+ctx.lineWidth = 1.5;
+ctx.lineWidth = Infinity;
+ok(ctx.lineWidth === 1.5, "ctx.lineWidth === 1.5");
+
+ctx.lineWidth = 1.5;
+ctx.lineWidth = -Infinity;
+ok(ctx.lineWidth === 1.5, "ctx.lineWidth === 1.5");
+
+ctx.lineWidth = 1.5;
+ctx.lineWidth = NaN;
+ok(ctx.lineWidth === 1.5, "ctx.lineWidth === 1.5");
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.line.width.transformed.html ]]] -->
+
+<p>Canvas test: 2d.line.width.transformed</p>
+<!-- Testing: Line stroke widths are affected by scale transformations -->
+<canvas id="c330" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_line_width_transformed() {
+
+var canvas = document.getElementById('c330');
+var ctx = canvas.getContext('2d');
+
+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);
+
+isPixel(ctx, 14,25, 0,255,0,255, 0);
+isPixel(ctx, 15,25, 0,255,0,255, 0);
+isPixel(ctx, 16,25, 0,255,0,255, 0);
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 34,25, 0,255,0,255, 0);
+isPixel(ctx, 35,25, 0,255,0,255, 0);
+isPixel(ctx, 36,25, 0,255,0,255, 0);
+
+isPixel(ctx, 64,25, 0,255,0,255, 0);
+isPixel(ctx, 65,25, 0,255,0,255, 0);
+isPixel(ctx, 66,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+isPixel(ctx, 84,25, 0,255,0,255, 0);
+isPixel(ctx, 85,25, 0,255,0,255, 0);
+isPixel(ctx, 86,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.missingargs.html ]]] -->
+
+<p>Canvas test: 2d.missingargs</p>
+<!-- Testing: Missing arguments cause NOT_SUPPORTED_ERR -->
+<canvas id="c331" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+// eslint-disable-next-line complexity
+function test_2d_missingargs() {
+
+var canvas = document.getElementById('c331');
+var ctx = canvas.getContext('2d');
+
+var _thrown = undefined; try {
+ ctx.scale();
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.scale(1);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.rotate();
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.translate();
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.translate(0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+if (ctx.transform) { // (avoid spurious failures, since the aim here is not to test that all features are supported)
+ var _thrown = undefined; try {
+ ctx.transform();
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+ var _thrown = undefined; try {
+ ctx.transform(1);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+ var _thrown = undefined; try {
+ ctx.transform(1, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+ var _thrown = undefined; try {
+ ctx.transform(1, 0, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+ var _thrown = undefined; try {
+ ctx.transform(1, 0, 0, 1);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+ var _thrown = undefined; try {
+ ctx.transform(1, 0, 0, 1, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+}
+if (ctx.setTransform) {
+ var _thrown = undefined; try {
+ ctx.setTransform();
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+ var _thrown = undefined; try {
+ ctx.setTransform(1);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+ var _thrown = undefined; try {
+ ctx.setTransform(1, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+ var _thrown = undefined; try {
+ ctx.setTransform(1, 0, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+ var _thrown = undefined; try {
+ ctx.setTransform(1, 0, 0, 1);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+ var _thrown = undefined; try {
+ ctx.setTransform(1, 0, 0, 1, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+}
+var _thrown = undefined; try {
+ ctx.createLinearGradient();
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.createLinearGradient(0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.createLinearGradient(0, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.createLinearGradient(0, 0, 1);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient();
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, 1);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, 1, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.createRadialGradient(0, 0, 1, 0, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.createPattern(canvas);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.clearRect();
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.clearRect(0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.clearRect(0, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.clearRect(0, 0, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.fillRect();
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.fillRect(0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.fillRect(0, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.fillRect(0, 0, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.strokeRect();
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.strokeRect(0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.strokeRect(0, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.strokeRect(0, 0, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.moveTo();
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.moveTo(0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.lineTo();
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.lineTo(0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.quadraticCurveTo();
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.quadraticCurveTo(0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.quadraticCurveTo(0, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.quadraticCurveTo(0, 0, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.bezierCurveTo();
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.bezierCurveTo(0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.bezierCurveTo(0, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.bezierCurveTo(0, 0, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.bezierCurveTo(0, 0, 0, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.bezierCurveTo(0, 0, 0, 0, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.arcTo();
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.arcTo(0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.arcTo(0, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.arcTo(0, 0, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.arcTo(0, 0, 0, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.rect();
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.rect(0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.rect(0, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.rect(0, 0, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.arc();
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.arc(0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.arc(0, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.arc(0, 0, 1);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.arc(0, 0, 1, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.arc(0, 0, 1, 0, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+if (ctx.isPointInPath) {
+ var _thrown = undefined; try {
+ ctx.isPointInPath();
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+ var _thrown = undefined; try {
+ ctx.isPointInPath(0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+}
+var _thrown = undefined; try {
+ ctx.drawImage();
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.drawImage(canvas);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ ctx.drawImage(canvas, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+// TODO: n >= 3 args on drawImage could be either a valid overload,
+// or too few for another overload, or too many for another
+// overload - what should happen?
+if (ctx.createImageData) {
+ var _thrown = undefined; try {
+ ctx.createImageData();
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+ var _thrown = undefined; try {
+ ctx.createImageData(1);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+}
+if (ctx.getImageData) {
+ var _thrown = undefined; try {
+ ctx.getImageData();
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+ var _thrown = undefined; try {
+ ctx.getImageData(0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+ var _thrown = undefined; try {
+ ctx.getImageData(0, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+ var _thrown = undefined; try {
+ ctx.getImageData(0, 0, 1);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+}
+if (ctx.putImageData) {
+ var imgdata = ctx.getImageData(0, 0, 1, 1);
+ var _thrown = undefined; try {
+ ctx.putImageData();
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+ var _thrown = undefined; try {
+ ctx.putImageData(imgdata);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+ var _thrown = undefined; try {
+ ctx.putImageData(imgdata, 0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+}
+var g = ctx.createLinearGradient(0, 0, 0, 0);
+var _thrown = undefined; try {
+ g.addColorStop();
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+var _thrown = undefined; try {
+ g.addColorStop(0);
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arc.angle.1.html ]]] -->
+
+<p>Canvas test: 2d.path.arc.angle.1</p>
+<!-- Testing: arc() draws pi/2 .. -pi anticlockwise correctly -->
+<canvas id="c332" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arc_angle_1() {
+
+var canvas = document.getElementById('c332');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#f00';
+ctx.beginPath();
+ctx.moveTo(100, 0);
+ctx.arc(100, 0, 150, Math.PI/2, -Math.PI, true);
+ctx.fill();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arc.angle.2.html ]]] -->
+
+<p>Canvas test: 2d.path.arc.angle.2</p>
+<!-- Testing: arc() draws -3pi/2 .. -pi anticlockwise correctly -->
+<canvas id="c333" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arc_angle_2() {
+
+var canvas = document.getElementById('c333');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#f00';
+ctx.beginPath();
+ctx.moveTo(100, 0);
+ctx.arc(100, 0, 150, -3*Math.PI/2, -Math.PI, true);
+ctx.fill();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arc.angle.3.html ]]] -->
+
+<p>Canvas test: 2d.path.arc.angle.3</p>
+<!-- Testing: arc() wraps angles mod 2pi when anticlockwise and end > start+2pi -->
+<canvas id="c334" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arc_angle_3() {
+
+var canvas = document.getElementById('c334');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#f00';
+ctx.beginPath();
+ctx.moveTo(100, 0);
+ctx.arc(100, 0, 150, (512+1/2)*Math.PI, (1024-1)*Math.PI, true);
+ctx.fill();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arc.angle.4.html ]]] -->
+
+<p>Canvas test: 2d.path.arc.angle.4</p>
+<!-- Testing: arc() draws a full circle when clockwise and end > start+2pi -->
+<canvas id="c335" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arc_angle_4() {
+
+var canvas = document.getElementById('c335');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#0f0';
+ctx.beginPath();
+ctx.moveTo(50, 25);
+ctx.arc(50, 25, 60, (512+1/2)*Math.PI, (1024-1)*Math.PI, false);
+ctx.fill();
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arc.angle.5.html ]]] -->
+
+<p>Canvas test: 2d.path.arc.angle.5</p>
+<!-- Testing: arc() wraps angles mod 2pi when clockwise and start > end+2pi -->
+<canvas id="c336" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arc_angle_5() {
+
+var canvas = document.getElementById('c336');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#f00';
+ctx.beginPath();
+ctx.moveTo(100, 0);
+ctx.arc(100, 0, 150, (1024-1)*Math.PI, (512+1/2)*Math.PI, false);
+ctx.fill();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arc.angle.6.html ]]] -->
+
+<p>Canvas test: 2d.path.arc.angle.6</p>
+<!-- Testing: arc() draws a full circle when anticlockwise and start > end+2pi -->
+<canvas id="c337" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arc_angle_6() {
+
+var canvas = document.getElementById('c337');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#0f0';
+ctx.beginPath();
+ctx.moveTo(50, 25);
+ctx.arc(50, 25, 60, (1024-1)*Math.PI, (512+1/2)*Math.PI, true);
+ctx.fill();
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arc.empty.html ]]] -->
+
+<p>Canvas test: 2d.path.arc.empty</p>
+<!-- Testing: arc() with an empty path does not draw a straight line to the start point -->
+<canvas id="c338" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arc_empty() {
+
+var canvas = document.getElementById('c338');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 50;
+ctx.strokeStyle = '#f00';
+ctx.beginPath();
+ctx.arc(200, 25, 5, 0, 2*Math.PI, true);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arc.end.html ]]] -->
+
+<p>Canvas test: 2d.path.arc.end</p>
+<!-- Testing: arc() adds the end point of the arc to the subpath -->
+<canvas id="c339" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arc_end() {
+
+var canvas = document.getElementById('c339');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 50;
+ctx.strokeStyle = '#0f0';
+ctx.beginPath();
+ctx.moveTo(-100, 0);
+ctx.arc(-100, 0, 25, -Math.PI/2, Math.PI/2, true);
+ctx.lineTo(100, 25);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arc.negative.html ]]] -->
+
+<p>Canvas test: 2d.path.arc.negative</p>
+<!-- Testing: arc() with negative radius throws INDEX_SIZE_ERR -->
+<canvas id="c340" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_arc_negative() {
+
+var canvas = document.getElementById('c340');
+var ctx = canvas.getContext('2d');
+
+var _thrown = undefined; try {
+ ctx.arc(0, 0, -1, 0, 0, true);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arc.nonempty.html ]]] -->
+
+<p>Canvas test: 2d.path.arc.nonempty</p>
+<!-- Testing: arc() with a non-empty path does draw a straight line to the start point -->
+<canvas id="c341" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arc_nonempty() {
+
+var canvas = document.getElementById('c341');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 50;
+ctx.strokeStyle = '#0f0';
+ctx.beginPath();
+ctx.moveTo(0, 25);
+ctx.arc(200, 25, 5, 0, 2*Math.PI, true);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arc.nonfinite.html ]]] -->
+
+<p>Canvas test: 2d.path.arc.nonfinite</p>
+<!-- Testing: arc() with Infinity/NaN is ignored -->
+<canvas id="c342" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arc_nonfinite() {
+
+var canvas = document.getElementById('c342');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.moveTo(0, 0);
+ctx.lineTo(100, 0);
+ctx.arc(Infinity, 50, 0, 2*Math.PI, true);
+ctx.arc(-Infinity, 50, 0, 2*Math.PI, true);
+ctx.arc(NaN, 50, 0, 2*Math.PI, true);
+ctx.arc(0, Infinity, 0, 2*Math.PI, true);
+ctx.arc(0, -Infinity, 0, 2*Math.PI, true);
+ctx.arc(0, NaN, 0, 2*Math.PI, true);
+ctx.arc(0, 50, Infinity, 2*Math.PI, true);
+ctx.arc(0, 50, -Infinity, 2*Math.PI, true);
+ctx.arc(0, 50, NaN, 2*Math.PI, true);
+ctx.arc(0, 50, 0, Infinity, true);
+ctx.arc(0, 50, 0, -Infinity, true);
+ctx.arc(0, 50, 0, NaN, true);
+ctx.arc(Infinity, Infinity, 0, 2*Math.PI, true);
+ctx.arc(Infinity, Infinity, Infinity, 2*Math.PI, true);
+ctx.arc(Infinity, Infinity, Infinity, Infinity, true);
+ctx.arc(Infinity, Infinity, 0, Infinity, true);
+ctx.arc(Infinity, 50, Infinity, 2*Math.PI, true);
+ctx.arc(Infinity, 50, Infinity, Infinity, true);
+ctx.arc(Infinity, 50, 0, Infinity, true);
+ctx.arc(0, Infinity, Infinity, 2*Math.PI, true);
+ctx.arc(0, Infinity, Infinity, Infinity, true);
+ctx.arc(0, Infinity, 0, Infinity, true);
+ctx.arc(0, 50, Infinity, Infinity, true);
+ctx.lineTo(100, 50);
+ctx.lineTo(0, 50);
+ctx.fillStyle = '#0f0';
+ctx.fill();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 90,45, 0,255,0,255, 0);
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arc.scale.1.html ]]] -->
+
+<p>Canvas test: 2d.path.arc.scale.1</p>
+<!-- Testing: Non-uniformly scaled arcs are the right shape -->
+<canvas id="c343" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arc_scale_1() {
+
+var canvas = document.getElementById('c343');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.scale(2, 0.5);
+ctx.fillStyle = '#0f0';
+ctx.beginPath();
+var hypothenuse = Math.sqrt(50 * 50 + 25 * 25);
+var tolerance = 0.5;
+var radius = hypothenuse + tolerance;
+ctx.arc(25, 50, radius, 0, 2*Math.PI, false);
+ctx.fill();
+ctx.fillStyle = '#f00';
+ctx.beginPath();
+ctx.moveTo(-25, 50);
+ctx.arc(-25, 50, 24, 0, 2*Math.PI, false);
+ctx.moveTo(75, 50);
+ctx.arc(75, 50, 24, 0, 2*Math.PI, false);
+ctx.moveTo(25, -25);
+ctx.arc(25, -25, 24, 0, 2*Math.PI, false);
+ctx.moveTo(25, 125);
+ctx.arc(25, 125, 24, 0, 2*Math.PI, false);
+ctx.fill();
+
+isPixel(ctx, 0,0, 0,255,0,255, 0);
+isPixel(ctx, 50,0, 0,255,0,255, 0);
+isPixel(ctx, 99,0, 0,255,0,255, 0);
+isPixel(ctx, 0,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 99,25, 0,255,0,255, 0);
+isPixel(ctx, 0,49, 0,255,0,255, 0);
+isPixel(ctx, 50,49, 0,255,0,255, 0);
+isPixel(ctx, 99,49, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arc.scale.2.html ]]] -->
+
+<p>Canvas test: 2d.path.arc.scale.2</p>
+<!-- Testing: Highly scaled arcs are the right shape -->
+<canvas id="c344" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arc_scale_2() {
+
+var canvas = document.getElementById('c344');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.scale(100, 100);
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 1.2;
+ctx.beginPath();
+ctx.arc(0, 0, 0.6, 0, Math.PI/2, false);
+ctx.stroke();
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 50,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,25, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 50,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arc.selfintersect.1.html ]]] -->
+
+<p>Canvas test: 2d.path.arc.selfintersect.1</p>
+<!-- Testing: arc() with lineWidth > 2*radius is drawn sensibly -->
+<canvas id="c345" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arc_selfintersect_1() {
+
+var canvas = document.getElementById('c345');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 200;
+ctx.strokeStyle = '#f00';
+ctx.beginPath();
+ctx.arc(100, 50, 25, 0, -Math.PI/2, true);
+ctx.stroke();
+ctx.beginPath();
+ctx.arc(0, 0, 25, 0, -Math.PI/2, true);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arc.selfintersect.2.html ]]] -->
+
+<p>Canvas test: 2d.path.arc.selfintersect.2</p>
+<!-- Testing: arc() with lineWidth > 2*radius is drawn sensibly -->
+<canvas id="c346" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arc_selfintersect_2() {
+
+var canvas = document.getElementById('c346');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 180;
+ctx.strokeStyle = '#0f0';
+ctx.beginPath();
+ctx.arc(-50, 50, 25, 0, -Math.PI/2, true);
+ctx.stroke();
+ctx.beginPath();
+ctx.arc(100, 0, 25, 0, -Math.PI/2, true);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 90,10, 0,255,0,255, 0);
+isPixel(ctx, 97,1, 0,255,0,255, 0);
+isPixel(ctx, 97,2, 0,255,0,255, 0);
+isPixel(ctx, 97,3, 0,255,0,255, 0);
+isPixel(ctx, 2,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arc.shape.1.html ]]] -->
+
+<p>Canvas test: 2d.path.arc.shape.1</p>
+<!-- Testing: arc() from 0 to pi does not draw anything in the wrong half -->
+<canvas id="c347" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arc_shape_1() {
+
+var canvas = document.getElementById('c347');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 50;
+ctx.strokeStyle = '#f00';
+ctx.beginPath();
+ctx.arc(50, 50, 50, 0, Math.PI, false);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 20,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arc.shape.2.html ]]] -->
+
+<p>Canvas test: 2d.path.arc.shape.2</p>
+<!-- Testing: arc() from 0 to pi draws stuff in the right half -->
+<canvas id="c348" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arc_shape_2() {
+
+var canvas = document.getElementById('c348');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 100;
+ctx.strokeStyle = '#0f0';
+ctx.beginPath();
+ctx.arc(50, 50, 50, 0, Math.PI, true);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 20,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arc.shape.3.html ]]] -->
+
+<p>Canvas test: 2d.path.arc.shape.3</p>
+<!-- Testing: arc() from 0 to -pi/2 does not draw anything in the wrong quadrant -->
+<canvas id="c349" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_path_arc_shape_3() {
+
+var canvas = document.getElementById('c349');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 100;
+ctx.strokeStyle = '#f00';
+ctx.beginPath();
+ctx.arc(0, 50, 50, 0, -Math.PI/2, false);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arc.shape.4.html ]]] -->
+
+<p>Canvas test: 2d.path.arc.shape.4</p>
+<!-- Testing: arc() from 0 to -pi/2 draws stuff in the right quadrant -->
+<canvas id="c350" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arc_shape_4() {
+
+var canvas = document.getElementById('c350');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 150;
+ctx.strokeStyle = '#0f0';
+ctx.beginPath();
+ctx.arc(-50, 50, 100, 0, -Math.PI/2, true);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arc.shape.5.html ]]] -->
+
+<p>Canvas test: 2d.path.arc.shape.5</p>
+<!-- Testing: arc() from 0 to 5pi does not draw strange things -->
+<canvas id="c351" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arc_shape_5() {
+
+var canvas = document.getElementById('c351');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 200;
+ctx.strokeStyle = '#f00';
+ctx.beginPath();
+ctx.arc(300, 0, 100, 0, 5*Math.PI, false);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arc.twopie.1.html ]]] -->
+
+<p>Canvas test: 2d.path.arc.twopie.1</p>
+<!-- Testing: arc() draws nothing when end = start + 2pi-e and anticlockwise -->
+<canvas id="c352" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arc_twopie_1() {
+
+var canvas = document.getElementById('c352');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 100;
+ctx.beginPath();
+ctx.arc(50, 25, 50, 0, 2*Math.PI - 1e-4, true);
+ctx.stroke();
+isPixel(ctx, 50,20, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arc.twopie.2.html ]]] -->
+
+<p>Canvas test: 2d.path.arc.twopie.2</p>
+<!-- Testing: arc() draws a full circle when end = start + 2pi-e and clockwise -->
+<canvas id="c353" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arc_twopie_2() {
+
+var canvas = document.getElementById('c353');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 100;
+ctx.beginPath();
+ctx.arc(50, 25, 50, 0, 2*Math.PI - 1e-4, false);
+ctx.stroke();
+isPixel(ctx, 50,20, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arc.twopie.3.html ]]] -->
+
+<p>Canvas test: 2d.path.arc.twopie.3</p>
+<!-- Testing: arc() draws a full circle when end = start + 2pi+e and anticlockwise -->
+<canvas id="c354" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arc_twopie_3() {
+
+var canvas = document.getElementById('c354');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 100;
+ctx.beginPath();
+ctx.arc(50, 25, 50, 0, 2*Math.PI + 1e-4, true);
+ctx.stroke();
+isPixel(ctx, 50,20, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arc.twopie.4.html ]]] -->
+
+<p>Canvas test: 2d.path.arc.twopie.4</p>
+<!-- Testing: arc() draws nothing when end = start + 2pi+e and clockwise -->
+<canvas id="c355" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arc_twopie_4() {
+
+var canvas = document.getElementById('c355');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 100;
+ctx.beginPath();
+ctx.arc(50, 25, 50, 0, 2*Math.PI + 1e-4, false);
+ctx.stroke();
+isPixel(ctx, 50,20, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arc.zero.1.html ]]] -->
+
+<p>Canvas test: 2d.path.arc.zero.1</p>
+<!-- Testing: arc() draws nothing when startAngle = endAngle and anticlockwise -->
+<canvas id="c356" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arc_zero_1() {
+
+var canvas = document.getElementById('c356');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 100;
+ctx.beginPath();
+ctx.arc(50, 25, 50, 0, 0, true);
+ctx.stroke();
+isPixel(ctx, 50,20, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arc.zero.2.html ]]] -->
+
+<p>Canvas test: 2d.path.arc.zero.2</p>
+<!-- Testing: arc() draws nothing when startAngle = endAngle and clockwise -->
+<canvas id="c357" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arc_zero_2() {
+
+var canvas = document.getElementById('c357');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 100;
+ctx.beginPath();
+ctx.arc(50, 25, 50, 0, 0, false);
+ctx.stroke();
+isPixel(ctx, 50,20, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arc.zeroradius.html ]]] -->
+
+<p>Canvas test: 2d.path.arc.zeroradius</p>
+<!-- Testing: arc() with zero radius draws a line to the start point -->
+<canvas id="c358" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_path_arc_zeroradius() {
+
+var canvas = document.getElementById('c358');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00'
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 50;
+ctx.strokeStyle = '#0f0';
+ctx.beginPath();
+ctx.moveTo(0, 25);
+ctx.arc(200, 25, 0, 0, Math.PI, true);
+ctx.stroke();
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+}
+</script>
+
+<!-- [[[ test_2d.path.arcTo.coincide.1.html ]]] -->
+
+<p>Canvas test: 2d.path.arcTo.coincide.1</p>
+<!-- Testing: arcTo() has no effect if P0 = P1 -->
+<canvas id="c359" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_path_arcTo_coincide_1() {
+
+var canvas = document.getElementById('c359');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 50;
+
+ctx.strokeStyle = '#0f0';
+ctx.beginPath();
+ctx.moveTo(0, 25);
+ctx.arcTo(0, 25, 50, 1000, 1);
+ctx.lineTo(100, 25);
+ctx.stroke();
+
+ctx.strokeStyle = '#f00';
+ctx.beginPath();
+ctx.moveTo(50, 25);
+ctx.arcTo(50, 25, 100, 25, 1);
+ctx.stroke();
+
+isPixel(ctx, 50,1, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 50,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arcTo.coincide.2.html ]]] -->
+
+<p>Canvas test: 2d.path.arcTo.coincide.2</p>
+<!-- Testing: arcTo() draws a straight line to P1 if P1 = P2 -->
+<canvas id="c360" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arcTo_coincide_2() {
+
+var canvas = document.getElementById('c360');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 50;
+ctx.strokeStyle = '#0f0';
+ctx.beginPath();
+ctx.moveTo(0, 25);
+ctx.arcTo(100, 25, 100, 25, 1);
+ctx.stroke();
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arcTo.collinear.1.html ]]] -->
+
+<p>Canvas test: 2d.path.arcTo.collinear.1</p>
+<!-- Testing: arcTo() with all points on a line, and P1 between P0/P2, draws a straight line to P1 -->
+<canvas id="c361" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_path_arcTo_collinear_1() {
+
+var canvas = document.getElementById('c361');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 50;
+
+ctx.strokeStyle = '#0f0';
+ctx.beginPath();
+ctx.moveTo(0, 25);
+ctx.arcTo(100, 25, 200, 25, 1);
+ctx.stroke();
+
+ctx.strokeStyle = '#f00';
+ctx.beginPath();
+ctx.moveTo(-100, 25);
+ctx.arcTo(0, 25, 100, 25, 1);
+ctx.stroke();
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arcTo.collinear.2.html ]]] -->
+
+<p>Canvas test: 2d.path.arcTo.collinear.2</p>
+<!-- Testing: arcTo() with all points on a line, and P2 between P0/P1, draws an infinite line along P1..P2 -->
+<canvas id="c362" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_path_arcTo_collinear_2() {
+
+var canvas = document.getElementById('c362');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 50;
+
+ctx.strokeStyle = '#0f0';
+ctx.beginPath();
+ctx.moveTo(1000, 25);
+ctx.arcTo(1100, 25, 1050, 25, 1);
+ctx.stroke();
+
+ctx.strokeStyle = '#f00';
+ctx.beginPath();
+ctx.moveTo(0, 25);
+ctx.arcTo(100, 25, -50, 25, 1);
+ctx.stroke();
+
+todo_isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arcTo.collinear.3.html ]]] -->
+
+<p>Canvas test: 2d.path.arcTo.collinear.3</p>
+<!-- Testing: arcTo() with all points on a line, and P0 between P1/P2, draws an infinite line along P1..P2 -->
+<canvas id="c363" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_path_arcTo_collinear_3() {
+
+var canvas = document.getElementById('c363');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 50;
+
+ctx.strokeStyle = '#0f0';
+ctx.beginPath();
+ctx.moveTo(150, 25);
+ctx.arcTo(200, 25, 100, 25, 1);
+ctx.stroke();
+
+ctx.strokeStyle = '#f00';
+ctx.beginPath();
+ctx.moveTo(0, 25);
+ctx.arcTo(100, 25, 50, 25, 1);
+ctx.stroke();
+
+todo_isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arcTo.emptysubpath.html ]]] -->
+
+<p>Canvas test: 2d.path.arcTo.emptysubpath</p>
+<!-- Testing: arcTo() does nothing if there are no subpaths -->
+<canvas id="c364" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_path_arcTo_emptysubpath() {
+
+var canvas = document.getElementById('c364');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 50;
+ctx.strokeStyle = '#f00';
+ctx.beginPath();
+ctx.arcTo(0, 25, 0, 25, 0.1);
+ctx.arcTo(100, 25, 100, 25, 0.1);
+ctx.stroke();
+todo_isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arcTo.negative.html ]]] -->
+
+<p>Canvas test: 2d.path.arcTo.negative</p>
+<!-- Testing: arcTo() with negative radius throws an exception -->
+<canvas id="c365" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_arcTo_negative() {
+
+var canvas = document.getElementById('c365');
+var ctx = canvas.getContext('2d');
+
+var _thrown = undefined; try {
+ ctx.arcTo(0, 0, 0, 0, -1);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arcTo.nonfinite.html ]]] -->
+
+<p>Canvas test: 2d.path.arcTo.nonfinite</p>
+<!-- Testing: arcTo() with Infinity/NaN is ignored -->
+<canvas id="c366" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arcTo_nonfinite() {
+
+var canvas = document.getElementById('c366');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.moveTo(0, 0);
+ctx.lineTo(100, 0);
+ctx.arcTo(Infinity, 50, 0, 50, 0);
+ctx.arcTo(-Infinity, 50, 0, 50, 0);
+ctx.arcTo(NaN, 50, 0, 50, 0);
+ctx.arcTo(0, Infinity, 0, 50, 0);
+ctx.arcTo(0, -Infinity, 0, 50, 0);
+ctx.arcTo(0, NaN, 0, 50, 0);
+ctx.arcTo(0, 50, Infinity, 50, 0);
+ctx.arcTo(0, 50, -Infinity, 50, 0);
+ctx.arcTo(0, 50, NaN, 50, 0);
+ctx.arcTo(0, 50, 0, Infinity, 0);
+ctx.arcTo(0, 50, 0, -Infinity, 0);
+ctx.arcTo(0, 50, 0, NaN, 0);
+ctx.arcTo(0, 50, 0, 50, Infinity);
+ctx.arcTo(0, 50, 0, 50, -Infinity);
+ctx.arcTo(0, 50, 0, 50, NaN);
+ctx.arcTo(Infinity, Infinity, 0, 50, 0);
+ctx.arcTo(Infinity, Infinity, Infinity, 50, 0);
+ctx.arcTo(Infinity, Infinity, Infinity, Infinity, 0);
+ctx.arcTo(Infinity, Infinity, Infinity, Infinity, Infinity);
+ctx.arcTo(Infinity, Infinity, Infinity, 50, Infinity);
+ctx.arcTo(Infinity, Infinity, 0, Infinity, 0);
+ctx.arcTo(Infinity, Infinity, 0, Infinity, Infinity);
+ctx.arcTo(Infinity, Infinity, 0, 50, Infinity);
+ctx.arcTo(Infinity, 50, Infinity, 50, 0);
+ctx.arcTo(Infinity, 50, Infinity, Infinity, 0);
+ctx.arcTo(Infinity, 50, Infinity, Infinity, Infinity);
+ctx.arcTo(Infinity, 50, Infinity, 50, Infinity);
+ctx.arcTo(Infinity, 50, 0, Infinity, 0);
+ctx.arcTo(Infinity, 50, 0, Infinity, Infinity);
+ctx.arcTo(Infinity, 50, 0, 50, Infinity);
+ctx.arcTo(0, Infinity, Infinity, 50, 0);
+ctx.arcTo(0, Infinity, Infinity, Infinity, 0);
+ctx.arcTo(0, Infinity, Infinity, Infinity, Infinity);
+ctx.arcTo(0, Infinity, Infinity, 50, Infinity);
+ctx.arcTo(0, Infinity, 0, Infinity, 0);
+ctx.arcTo(0, Infinity, 0, Infinity, Infinity);
+ctx.arcTo(0, Infinity, 0, 50, Infinity);
+ctx.arcTo(0, 50, Infinity, Infinity, 0);
+ctx.arcTo(0, 50, Infinity, Infinity, Infinity);
+ctx.arcTo(0, 50, Infinity, 50, Infinity);
+ctx.arcTo(0, 50, 0, Infinity, Infinity);
+ctx.lineTo(100, 50);
+ctx.lineTo(0, 50);
+ctx.fillStyle = '#0f0';
+ctx.fill();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 90,45, 0,255,0,255, 0);
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arcTo.scale.html ]]] -->
+
+<p>Canvas test: 2d.path.arcTo.scale</p>
+<!-- Testing: arcTo scales the curve, not just the control points -->
+<canvas id="c367" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arcTo_scale() {
+
+var canvas = document.getElementById('c367');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.fillStyle = '#0f0';
+ctx.beginPath();
+ctx.moveTo(0, 50);
+ctx.translate(100, 0);
+ctx.scale(0.1, 1);
+ctx.arcTo(50, 50, 50, 0, 50);
+ctx.lineTo(-1000, 0);
+ctx.fill();
+
+isPixel(ctx, 0,0, 0,255,0,255, 0);
+isPixel(ctx, 50,0, 0,255,0,255, 0);
+isPixel(ctx, 99,0, 0,255,0,255, 0);
+isPixel(ctx, 0,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 99,25, 0,255,0,255, 0);
+isPixel(ctx, 0,49, 0,255,0,255, 0);
+isPixel(ctx, 50,49, 0,255,0,255, 0);
+isPixel(ctx, 99,49, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arcTo.shape.curve1.html ]]] -->
+
+<p>Canvas test: 2d.path.arcTo.shape.curve1</p>
+<!-- Testing: arcTo() curves in the right kind of shape -->
+<canvas id="c368" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_path_arcTo_shape_curve1() {
+
+var canvas = document.getElementById('c368');
+var ctx = canvas.getContext('2d');
+
+var tol = 1.5; // tolerance to avoid antialiasing artifacts
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 10;
+ctx.beginPath();
+ctx.moveTo(10, 25);
+ctx.arcTo(75, 25, 75, 60, 20);
+ctx.stroke();
+
+ctx.fillStyle = '#0f0';
+ctx.beginPath();
+ctx.rect(10, 20, 45, 10);
+ctx.moveTo(80, 45);
+ctx.arc(55, 45, 25+tol, 0, -Math.PI/2, true);
+ctx.arc(55, 45, 15-tol, -Math.PI/2, 0, false);
+ctx.fill();
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 55,19, 0,255,0,255, 0);
+isPixel(ctx, 55,20, 0,255,0,255, 0);
+isPixel(ctx, 55,21, 0,255,0,255, 0);
+isPixel(ctx, 64,22, 0,255,0,255, 0);
+isPixel(ctx, 65,21, 0,255,0,255, 0);
+isPixel(ctx, 72,28, 0,255,0,255, 0);
+isPixel(ctx, 73,27, 0,255,0,255, 0);
+isPixel(ctx, 78,36, 0,255,0,255, 0);
+isPixel(ctx, 79,35, 0,255,0,255, IsAzureSkia() ? 1 : 0);
+isPixel(ctx, 80,44, 0,255,0,255, 0);
+isPixel(ctx, 80,45, 0,255,0,255, 0);
+isPixel(ctx, 80,46, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arcTo.shape.curve2.html ]]] -->
+
+<p>Canvas test: 2d.path.arcTo.shape.curve2</p>
+<!-- Testing: arcTo() curves in the right kind of shape -->
+<canvas id="c369" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_path_arcTo_shape_curve2() {
+
+var canvas = document.getElementById('c369');
+var ctx = canvas.getContext('2d');
+
+var tol = 1.5; // tolerance to avoid antialiasing artifacts
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.fillStyle = '#f00';
+ctx.beginPath();
+ctx.rect(10, 20, 45, 10);
+ctx.moveTo(80, 45);
+ctx.arc(55, 45, 25-tol, 0, -Math.PI/2, true);
+ctx.arc(55, 45, 15+tol, -Math.PI/2, 0, false);
+ctx.fill();
+
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 10;
+ctx.beginPath();
+ctx.moveTo(10, 25);
+ctx.arcTo(75, 25, 75, 60, 20);
+ctx.stroke();
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 55,19, 0,255,0,255, 0);
+isPixel(ctx, 55,20, 0,255,0,255, 0);
+isPixel(ctx, 55,21, 0,255,0,255, 0);
+isPixel(ctx, 64,22, 0,255,0,255, IsAzureSkia() ? 1 : 0);
+isPixel(ctx, 65,21, 0,255,0,255, 0);
+isPixel(ctx, 72,28, 0,255,0,255, 0);
+isPixel(ctx, 73,27, 0,255,0,255, IsAzureSkia() ? 1 : 0);
+isPixel(ctx, 78,36, 0,255,0,255, IsAzureSkia() ? 1 : 0);
+isPixel(ctx, 79,35, 0,255,0,255, 0);
+isPixel(ctx, 80,44, 0,255,0,255, 0);
+isPixel(ctx, 80,45, 0,255,0,255, 0);
+isPixel(ctx, 80,46, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arcTo.shape.end.html ]]] -->
+
+<p>Canvas test: 2d.path.arcTo.shape.end</p>
+<!-- Testing: arcTo() does not draw anything from P1 to P2 -->
+<canvas id="c370" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_path_arcTo_shape_end() {
+
+var canvas = document.getElementById('c370');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 50;
+ctx.beginPath();
+ctx.moveTo(-100, -100);
+ctx.arcTo(-100, 25, 200, 25, 10);
+ctx.stroke();
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arcTo.shape.start.html ]]] -->
+
+<p>Canvas test: 2d.path.arcTo.shape.start</p>
+<!-- Testing: arcTo() draws a straight line from P0 to P1 -->
+<canvas id="c371" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_path_arcTo_shape_start() {
+
+var canvas = document.getElementById('c371');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 50;
+ctx.beginPath();
+ctx.moveTo(0, 25);
+ctx.arcTo(200, 25, 200, 50, 10);
+ctx.stroke();
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arcTo.transformation.html ]]] -->
+
+<p>Canvas test: 2d.path.arcTo.transformation</p>
+<!-- Testing: arcTo joins up to the last subpath point correctly -->
+<canvas id="c372" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arcTo_transformation() {
+
+var canvas = document.getElementById('c372');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.fillStyle = '#0f0';
+ctx.beginPath();
+ctx.moveTo(0, 50);
+ctx.translate(100, 0);
+ctx.arcTo(50, 50, 50, 0, 50);
+ctx.lineTo(-100, 0);
+ctx.fill();
+
+isPixel(ctx, 0,0, 0,255,0,255, 0);
+isPixel(ctx, 50,0, 0,255,0,255, 0);
+isPixel(ctx, 99,0, 0,255,0,255, 0);
+isPixel(ctx, 0,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 99,25, 0,255,0,255, 0);
+isPixel(ctx, 0,49, 0,255,0,255, 0);
+isPixel(ctx, 50,49, 0,255,0,255, 0);
+isPixel(ctx, 99,49, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arcTo.zero.1.html ]]] -->
+
+<p>Canvas test: 2d.path.arcTo.zero.1</p>
+<!-- Testing: arcTo() with zero radius draws a straight line from P0 to P1 -->
+<canvas id="c373" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arcTo_zero_1() {
+
+var canvas = document.getElementById('c373');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 50;
+
+ctx.strokeStyle = '#0f0';
+ctx.beginPath();
+ctx.moveTo(0, 25);
+ctx.arcTo(100, 25, 100, 100, 0);
+ctx.stroke();
+
+ctx.strokeStyle = '#f00';
+ctx.beginPath();
+ctx.moveTo(0, -25);
+ctx.arcTo(50, -25, 50, 50, 0);
+ctx.stroke();
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.arcTo.zero.2.html ]]] -->
+
+<p>Canvas test: 2d.path.arcTo.zero.2</p>
+<!-- Testing: arcTo() with zero radius draws a straight line from P0 to P1, even when all points are collinear -->
+<canvas id="c374" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_arcTo_zero_2() {
+
+var canvas = document.getElementById('c374');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 50;
+
+ctx.strokeStyle = '#0f0';
+ctx.beginPath();
+ctx.moveTo(0, 25);
+ctx.arcTo(100, 25, -100, 25, 0);
+ctx.stroke();
+
+ctx.strokeStyle = '#f00';
+ctx.beginPath();
+ctx.moveTo(100, 25);
+ctx.arcTo(200, 25, 50, 25, 0);
+ctx.stroke();
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.beginPath.html ]]] -->
+
+<p>Canvas test: 2d.path.beginPath</p>
+<canvas id="c375" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_beginPath() {
+
+var canvas = document.getElementById('c375');
+var ctx = canvas.getContext('2d');
+
+ctx.rect(0, 0, 100, 50);
+ctx.beginPath();
+ctx.fillStyle = '#f00';
+ctx.fill();
+isPixel(ctx, 50,25, 0,0,0,0, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.bezierCurveTo.basic.html ]]] -->
+
+<p>Canvas test: 2d.path.bezierCurveTo.basic</p>
+<canvas id="c376" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_bezierCurveTo_basic() {
+
+var canvas = document.getElementById('c376');
+var ctx = canvas.getContext('2d');
+
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 50;
+ctx.beginPath();
+ctx.moveTo(0, 25);
+ctx.bezierCurveTo(100, 25, 100, 25, 100, 25);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.bezierCurveTo.emptysubpath.html ]]] -->
+
+<p>Canvas test: 2d.path.bezierCurveTo.emptysubpath</p>
+<canvas id="c377" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_path_bezierCurveTo_emptysubpath() {
+
+var canvas = document.getElementById('c377');
+var ctx = canvas.getContext('2d');
+
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 50;
+ctx.beginPath();
+ctx.bezierCurveTo(0, 25, 0, 25, 0, 25);
+ctx.bezierCurveTo(100, 25, 100, 25, 100, 25);
+ctx.stroke();
+todo_isPixel(ctx, 50,25, 0,0,0,0, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.bezierCurveTo.nonfinite.html ]]] -->
+
+<p>Canvas test: 2d.path.bezierCurveTo.nonfinite</p>
+<!-- Testing: bezierCurveTo() with Infinity/NaN is ignored -->
+<canvas id="c378" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_bezierCurveTo_nonfinite() {
+
+var canvas = document.getElementById('c378');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.moveTo(0, 0);
+ctx.lineTo(100, 0);
+ctx.bezierCurveTo(Infinity, 50, 0, 50, 0, 50);
+ctx.bezierCurveTo(-Infinity, 50, 0, 50, 0, 50);
+ctx.bezierCurveTo(NaN, 50, 0, 50, 0, 50);
+ctx.bezierCurveTo(0, Infinity, 0, 50, 0, 50);
+ctx.bezierCurveTo(0, -Infinity, 0, 50, 0, 50);
+ctx.bezierCurveTo(0, NaN, 0, 50, 0, 50);
+ctx.bezierCurveTo(0, 50, Infinity, 50, 0, 50);
+ctx.bezierCurveTo(0, 50, -Infinity, 50, 0, 50);
+ctx.bezierCurveTo(0, 50, NaN, 50, 0, 50);
+ctx.bezierCurveTo(0, 50, 0, Infinity, 0, 50);
+ctx.bezierCurveTo(0, 50, 0, -Infinity, 0, 50);
+ctx.bezierCurveTo(0, 50, 0, NaN, 0, 50);
+ctx.bezierCurveTo(0, 50, 0, 50, Infinity, 50);
+ctx.bezierCurveTo(0, 50, 0, 50, -Infinity, 50);
+ctx.bezierCurveTo(0, 50, 0, 50, NaN, 50);
+ctx.bezierCurveTo(0, 50, 0, 50, 0, Infinity);
+ctx.bezierCurveTo(0, 50, 0, 50, 0, -Infinity);
+ctx.bezierCurveTo(0, 50, 0, 50, 0, NaN);
+ctx.bezierCurveTo(Infinity, Infinity, 0, 50, 0, 50);
+ctx.bezierCurveTo(Infinity, Infinity, Infinity, 50, 0, 50);
+ctx.bezierCurveTo(Infinity, Infinity, Infinity, Infinity, 0, 50);
+ctx.bezierCurveTo(Infinity, Infinity, Infinity, Infinity, Infinity, 50);
+ctx.bezierCurveTo(Infinity, Infinity, Infinity, Infinity, Infinity, Infinity);
+ctx.bezierCurveTo(Infinity, Infinity, Infinity, Infinity, 0, Infinity);
+ctx.bezierCurveTo(Infinity, Infinity, Infinity, 50, Infinity, 50);
+ctx.bezierCurveTo(Infinity, Infinity, Infinity, 50, Infinity, Infinity);
+ctx.bezierCurveTo(Infinity, Infinity, Infinity, 50, 0, Infinity);
+ctx.bezierCurveTo(Infinity, Infinity, 0, Infinity, 0, 50);
+ctx.bezierCurveTo(Infinity, Infinity, 0, Infinity, Infinity, 50);
+ctx.bezierCurveTo(Infinity, Infinity, 0, Infinity, Infinity, Infinity);
+ctx.bezierCurveTo(Infinity, Infinity, 0, Infinity, 0, Infinity);
+ctx.bezierCurveTo(Infinity, Infinity, 0, 50, Infinity, 50);
+ctx.bezierCurveTo(Infinity, Infinity, 0, 50, Infinity, Infinity);
+ctx.bezierCurveTo(Infinity, Infinity, 0, 50, 0, Infinity);
+ctx.bezierCurveTo(Infinity, 50, Infinity, 50, 0, 50);
+ctx.bezierCurveTo(Infinity, 50, Infinity, Infinity, 0, 50);
+ctx.bezierCurveTo(Infinity, 50, Infinity, Infinity, Infinity, 50);
+ctx.bezierCurveTo(Infinity, 50, Infinity, Infinity, Infinity, Infinity);
+ctx.bezierCurveTo(Infinity, 50, Infinity, Infinity, 0, Infinity);
+ctx.bezierCurveTo(Infinity, 50, Infinity, 50, Infinity, 50);
+ctx.bezierCurveTo(Infinity, 50, Infinity, 50, Infinity, Infinity);
+ctx.bezierCurveTo(Infinity, 50, Infinity, 50, 0, Infinity);
+ctx.bezierCurveTo(Infinity, 50, 0, Infinity, 0, 50);
+ctx.bezierCurveTo(Infinity, 50, 0, Infinity, Infinity, 50);
+ctx.bezierCurveTo(Infinity, 50, 0, Infinity, Infinity, Infinity);
+ctx.bezierCurveTo(Infinity, 50, 0, Infinity, 0, Infinity);
+ctx.bezierCurveTo(Infinity, 50, 0, 50, Infinity, 50);
+ctx.bezierCurveTo(Infinity, 50, 0, 50, Infinity, Infinity);
+ctx.bezierCurveTo(Infinity, 50, 0, 50, 0, Infinity);
+ctx.bezierCurveTo(0, Infinity, Infinity, 50, 0, 50);
+ctx.bezierCurveTo(0, Infinity, Infinity, Infinity, 0, 50);
+ctx.bezierCurveTo(0, Infinity, Infinity, Infinity, Infinity, 50);
+ctx.bezierCurveTo(0, Infinity, Infinity, Infinity, Infinity, Infinity);
+ctx.bezierCurveTo(0, Infinity, Infinity, Infinity, 0, Infinity);
+ctx.bezierCurveTo(0, Infinity, Infinity, 50, Infinity, 50);
+ctx.bezierCurveTo(0, Infinity, Infinity, 50, Infinity, Infinity);
+ctx.bezierCurveTo(0, Infinity, Infinity, 50, 0, Infinity);
+ctx.bezierCurveTo(0, Infinity, 0, Infinity, 0, 50);
+ctx.bezierCurveTo(0, Infinity, 0, Infinity, Infinity, 50);
+ctx.bezierCurveTo(0, Infinity, 0, Infinity, Infinity, Infinity);
+ctx.bezierCurveTo(0, Infinity, 0, Infinity, 0, Infinity);
+ctx.bezierCurveTo(0, Infinity, 0, 50, Infinity, 50);
+ctx.bezierCurveTo(0, Infinity, 0, 50, Infinity, Infinity);
+ctx.bezierCurveTo(0, Infinity, 0, 50, 0, Infinity);
+ctx.bezierCurveTo(0, 50, Infinity, Infinity, 0, 50);
+ctx.bezierCurveTo(0, 50, Infinity, Infinity, Infinity, 50);
+ctx.bezierCurveTo(0, 50, Infinity, Infinity, Infinity, Infinity);
+ctx.bezierCurveTo(0, 50, Infinity, Infinity, 0, Infinity);
+ctx.bezierCurveTo(0, 50, Infinity, 50, Infinity, 50);
+ctx.bezierCurveTo(0, 50, Infinity, 50, Infinity, Infinity);
+ctx.bezierCurveTo(0, 50, Infinity, 50, 0, Infinity);
+ctx.bezierCurveTo(0, 50, 0, Infinity, Infinity, 50);
+ctx.bezierCurveTo(0, 50, 0, Infinity, Infinity, Infinity);
+ctx.bezierCurveTo(0, 50, 0, Infinity, 0, Infinity);
+ctx.bezierCurveTo(0, 50, 0, 50, Infinity, Infinity);
+ctx.lineTo(100, 50);
+ctx.lineTo(0, 50);
+ctx.fillStyle = '#0f0';
+ctx.fill();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 90,45, 0,255,0,255, 0);
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.bezierCurveTo.scaled.html ]]] -->
+
+<p>Canvas test: 2d.path.bezierCurveTo.scaled</p>
+<canvas id="c379" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_bezierCurveTo_scaled() {
+
+var canvas = document.getElementById('c379');
+var ctx = canvas.getContext('2d');
+
+ctx.scale(1000, 1000);
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 0.055;
+ctx.beginPath();
+ctx.moveTo(-2, 3.1);
+ctx.bezierCurveTo(-2, -1, 2.1, -1, 2.1, 3.1);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.bezierCurveTo.shape.html ]]] -->
+
+<p>Canvas test: 2d.path.bezierCurveTo.shape</p>
+<canvas id="c380" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_bezierCurveTo_shape() {
+
+var canvas = document.getElementById('c380');
+var ctx = canvas.getContext('2d');
+
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 55;
+ctx.beginPath();
+ctx.moveTo(-2000, 3100);
+ctx.bezierCurveTo(-2000, -1000, 2100, -1000, 2100, 3100);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.clip.basic.1.html ]]] -->
+
+<p>Canvas test: 2d.path.clip.basic.1</p>
+<canvas id="c381" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_clip_basic_1() {
+
+var canvas = document.getElementById('c381');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.beginPath();
+ctx.rect(0, 0, 100, 50);
+ctx.clip();
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.clip.basic.2.html ]]] -->
+
+<p>Canvas test: 2d.path.clip.basic.2</p>
+<canvas id="c382" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_clip_basic_2() {
+
+var canvas = document.getElementById('c382');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.beginPath();
+ctx.rect(-100, 0, 100, 50);
+ctx.clip();
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.clip.empty.html ]]] -->
+
+<p>Canvas test: 2d.path.clip.empty</p>
+<canvas id="c383" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_clip_empty() {
+
+var canvas = document.getElementById('c383');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.beginPath();
+ctx.clip();
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.clip.intersect.html ]]] -->
+
+<p>Canvas test: 2d.path.clip.intersect</p>
+<canvas id="c384" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_clip_intersect() {
+
+var canvas = document.getElementById('c384');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.beginPath();
+ctx.rect(0, 0, 50, 50);
+ctx.clip();
+ctx.beginPath();
+ctx.rect(50, 0, 50, 50)
+ctx.clip();
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.clip.unaffected.html ]]] -->
+
+<p>Canvas test: 2d.path.clip.unaffected</p>
+<canvas id="c385" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_clip_unaffected() {
+
+var canvas = document.getElementById('c385');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.fillStyle = '#0f0';
+
+ctx.beginPath();
+ctx.lineTo(0, 0);
+ctx.lineTo(0, 50);
+ctx.lineTo(100, 50);
+ctx.lineTo(100, 0);
+ctx.clip();
+
+ctx.lineTo(0, 0);
+ctx.fill();
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.clip.winding.1.html ]]] -->
+
+<p>Canvas test: 2d.path.clip.winding.1</p>
+<canvas id="c386" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_clip_winding_1() {
+
+var canvas = document.getElementById('c386');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.beginPath();
+ctx.moveTo(-10, -10);
+ctx.lineTo(110, -10);
+ctx.lineTo(110, 60);
+ctx.lineTo(-10, 60);
+ctx.lineTo(-10, -10);
+ctx.lineTo(0, 0);
+ctx.lineTo(0, 50);
+ctx.lineTo(100, 50);
+ctx.lineTo(100, 0);
+ctx.clip();
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.clip.winding.2.html ]]] -->
+
+<p>Canvas test: 2d.path.clip.winding.2</p>
+<canvas id="c387" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_clip_winding_2() {
+
+var canvas = document.getElementById('c387');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.beginPath();
+ctx.moveTo(-10, -10);
+ctx.lineTo(110, -10);
+ctx.lineTo(110, 60);
+ctx.lineTo(-10, 60);
+ctx.lineTo(-10, -10);
+ctx.clip();
+
+ctx.beginPath();
+ctx.lineTo(0, 0);
+ctx.lineTo(0, 50);
+ctx.lineTo(100, 50);
+ctx.lineTo(100, 0);
+ctx.lineTo(0, 0);
+ctx.clip();
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.closePath.empty.html ]]] -->
+
+<p>Canvas test: 2d.path.closePath.empty</p>
+<canvas id="c388" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_closePath_empty() {
+
+var canvas = document.getElementById('c388');
+var ctx = canvas.getContext('2d');
+
+ctx.closePath();
+ctx.fillStyle = '#f00';
+ctx.fill();
+isPixel(ctx, 50,25, 0,0,0,0, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.closePath.newline.html ]]] -->
+
+<p>Canvas test: 2d.path.closePath.newline</p>
+<canvas id="c389" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_closePath_newline() {
+
+var canvas = document.getElementById('c389');
+var ctx = canvas.getContext('2d');
+
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 50;
+ctx.moveTo(-100, 25);
+ctx.lineTo(-100, -100);
+ctx.lineTo(200, -100);
+ctx.lineTo(200, 25);
+ctx.closePath();
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.closePath.nextpoint.html ]]] -->
+
+<p>Canvas test: 2d.path.closePath.nextpoint</p>
+<canvas id="c390" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_closePath_nextpoint() {
+
+var canvas = document.getElementById('c390');
+var ctx = canvas.getContext('2d');
+
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 50;
+ctx.moveTo(-100, 25);
+ctx.lineTo(-100, -1000);
+ctx.closePath();
+ctx.lineTo(1000, 25);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.fill.closed.basic.html ]]] -->
+
+<p>Canvas test: 2d.path.fill.closed.basic</p>
+<canvas id="c391" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_fill_closed_basic() {
+
+var canvas = document.getElementById('c391');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.fillStyle = '#0f0';
+ctx.moveTo(0, 0);
+ctx.lineTo(100, 0);
+ctx.lineTo(100, 50);
+ctx.lineTo(0, 50);
+ctx.fill();
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.fill.closed.unaffected.html ]]] -->
+
+<p>Canvas test: 2d.path.fill.closed.unaffected</p>
+<canvas id="c392" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_fill_closed_unaffected() {
+
+var canvas = document.getElementById('c392');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#00f';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.moveTo(0, 0);
+ctx.lineTo(100, 0);
+ctx.lineTo(100, 50);
+ctx.fillStyle = '#f00';
+ctx.fill();
+ctx.lineTo(0, 50);
+ctx.fillStyle = '#0f0';
+ctx.fill();
+
+isPixel(ctx, 90,10, 0,255,0,255, 0);
+isPixel(ctx, 10,40, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.fill.overlap.html ]]] -->
+
+<p>Canvas test: 2d.path.fill.overlap</p>
+<canvas id="c393" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_fill_overlap() {
+
+var canvas = document.getElementById('c393');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#000';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
+ctx.rect(0, 0, 100, 50);
+ctx.closePath();
+ctx.rect(10, 10, 80, 30);
+ctx.fill();
+
+isPixel(ctx, 50,25, 0,127,0,255, 1);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.fill.winding.add.html ]]] -->
+
+<p>Canvas test: 2d.path.fill.winding.add</p>
+<canvas id="c394" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_fill_winding_add() {
+
+var canvas = document.getElementById('c394');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.fillStyle = '#0f0';
+ctx.moveTo(-10, -10);
+ctx.lineTo(110, -10);
+ctx.lineTo(110, 60);
+ctx.lineTo(-10, 60);
+ctx.lineTo(-10, -10);
+ctx.lineTo(0, 0);
+ctx.lineTo(100, 0);
+ctx.lineTo(100, 50);
+ctx.lineTo(0, 50);
+ctx.fill();
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.fill.winding.subtract.1.html ]]] -->
+
+<p>Canvas test: 2d.path.fill.winding.subtract.1</p>
+<canvas id="c395" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_fill_winding_subtract_1() {
+
+var canvas = document.getElementById('c395');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.fillStyle = '#f00';
+ctx.moveTo(-10, -10);
+ctx.lineTo(110, -10);
+ctx.lineTo(110, 60);
+ctx.lineTo(-10, 60);
+ctx.lineTo(-10, -10);
+ctx.lineTo(0, 0);
+ctx.lineTo(0, 50);
+ctx.lineTo(100, 50);
+ctx.lineTo(100, 0);
+ctx.fill();
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.fill.winding.subtract.2.html ]]] -->
+
+<p>Canvas test: 2d.path.fill.winding.subtract.2</p>
+<canvas id="c396" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_fill_winding_subtract_2() {
+
+var canvas = document.getElementById('c396');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.fillStyle = '#f00';
+ctx.moveTo(-10, -10);
+ctx.lineTo(110, -10);
+ctx.lineTo(110, 60);
+ctx.lineTo(-10, 60);
+ctx.moveTo(0, 0);
+ctx.lineTo(0, 50);
+ctx.lineTo(100, 50);
+ctx.lineTo(100, 0);
+ctx.fill();
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.fill.winding.subtract.3.html ]]] -->
+
+<p>Canvas test: 2d.path.fill.winding.subtract.3</p>
+<canvas id="c397" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_fill_winding_subtract_3() {
+
+var canvas = document.getElementById('c397');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.fillStyle = '#0f0';
+ctx.moveTo(-10, -10);
+ctx.lineTo(110, -10);
+ctx.lineTo(110, 60);
+ctx.lineTo(-10, 60);
+ctx.lineTo(-10, -10);
+ctx.lineTo(-20, -20);
+ctx.lineTo(120, -20);
+ctx.lineTo(120, 70);
+ctx.lineTo(-20, 70);
+ctx.lineTo(-20, -20);
+ctx.lineTo(0, 0);
+ctx.lineTo(0, 50);
+ctx.lineTo(100, 50);
+ctx.lineTo(100, 0);
+ctx.fill();
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.initial.html ]]] -->
+
+<p>Canvas test: 2d.path.initial</p>
+<canvas id="c398" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_path_initial() {
+
+var canvas = document.getElementById('c398');
+var ctx = canvas.getContext('2d');
+
+ctx.lineTo(0, 0);
+ctx.lineTo(100, 0);
+ctx.lineTo(100, 50);
+ctx.lineTo(0, 50);
+ctx.closePath();
+ctx.fillStyle = '#f00';
+ctx.fill();
+todo_isPixel(ctx, 50,25, 0,0,0,0, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.isPointInPath.arc.html ]]] -->
+
+<p>Canvas test: 2d.path.isPointInPath.arc</p>
+<!-- Testing: isPointInPath() works on arcs -->
+<canvas id="c399" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_isPointInPath_arc() {
+
+var canvas = document.getElementById('c399');
+var ctx = canvas.getContext('2d');
+
+ctx.arc(50, 25, 10, 0, Math.PI, false);
+ok(ctx.isPointInPath(50, 10) === false, "ctx.isPointInPath(50, 10) === false");
+ok(ctx.isPointInPath(50, 20) === false, "ctx.isPointInPath(50, 20) === false");
+ok(ctx.isPointInPath(50, 30) === true, "ctx.isPointInPath(50, 30) === true");
+ok(ctx.isPointInPath(50, 40) === false, "ctx.isPointInPath(50, 40) === false");
+ok(ctx.isPointInPath(30, 20) === false, "ctx.isPointInPath(30, 20) === false");
+ok(ctx.isPointInPath(70, 20) === false, "ctx.isPointInPath(70, 20) === false");
+ok(ctx.isPointInPath(30, 30) === false, "ctx.isPointInPath(30, 30) === false");
+ok(ctx.isPointInPath(70, 30) === false, "ctx.isPointInPath(70, 30) === false");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.isPointInPath.basic.1.html ]]] -->
+
+<p>Canvas test: 2d.path.isPointInPath.basic.1</p>
+<!-- Testing: isPointInPath() detects whether the point is inside the path -->
+<canvas id="c400" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_isPointInPath_basic_1() {
+
+var canvas = document.getElementById('c400');
+var ctx = canvas.getContext('2d');
+
+ctx.rect(0, 0, 20, 20);
+ok(ctx.isPointInPath(10, 10) === true, "ctx.isPointInPath(10, 10) === true");
+ok(ctx.isPointInPath(30, 10) === false, "ctx.isPointInPath(30, 10) === false");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.isPointInPath.basic.2.html ]]] -->
+
+<p>Canvas test: 2d.path.isPointInPath.basic.2</p>
+<!-- Testing: isPointInPath() detects whether the point is inside the path -->
+<canvas id="c401" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_isPointInPath_basic_2() {
+
+var canvas = document.getElementById('c401');
+var ctx = canvas.getContext('2d');
+
+ctx.rect(20, 0, 20, 20);
+ok(ctx.isPointInPath(10, 10) === false, "ctx.isPointInPath(10, 10) === false");
+ok(ctx.isPointInPath(30, 10) === true, "ctx.isPointInPath(30, 10) === true");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.isPointInPath.bezier.html ]]] -->
+
+<p>Canvas test: 2d.path.isPointInPath.bezier</p>
+<!-- Testing: isPointInPath() works on Bezier curves -->
+<canvas id="c402" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_isPointInPath_bezier() {
+
+var canvas = document.getElementById('c402');
+var ctx = canvas.getContext('2d');
+
+ctx.moveTo(25, 25);
+ctx.bezierCurveTo(50, -50, 50, 100, 75, 25);
+ok(ctx.isPointInPath(25, 20) == false, "ctx.isPointInPath(25, 20) == false");
+ok(ctx.isPointInPath(25, 30) == false, "ctx.isPointInPath(25, 30) == false");
+ok(ctx.isPointInPath(30, 20) == true, "ctx.isPointInPath(30, 20) == true");
+ok(ctx.isPointInPath(30, 30) == false, "ctx.isPointInPath(30, 30) == false");
+ok(ctx.isPointInPath(40, 2) == false, "ctx.isPointInPath(40, 2) == false");
+ok(ctx.isPointInPath(40, 20) == true, "ctx.isPointInPath(40, 20) == true");
+ok(ctx.isPointInPath(40, 30) == false, "ctx.isPointInPath(40, 30) == false");
+ok(ctx.isPointInPath(40, 47) == false, "ctx.isPointInPath(40, 47) == false");
+ok(ctx.isPointInPath(45, 20) == true, "ctx.isPointInPath(45, 20) == true");
+ok(ctx.isPointInPath(45, 30) == false, "ctx.isPointInPath(45, 30) == false");
+ok(ctx.isPointInPath(55, 20) == false, "ctx.isPointInPath(55, 20) == false");
+ok(ctx.isPointInPath(55, 30) == true, "ctx.isPointInPath(55, 30) == true");
+ok(ctx.isPointInPath(60, 2) == false, "ctx.isPointInPath(60, 2) == false");
+ok(ctx.isPointInPath(60, 20) == false, "ctx.isPointInPath(60, 20) == false");
+ok(ctx.isPointInPath(60, 30) == true, "ctx.isPointInPath(60, 30) == true");
+ok(ctx.isPointInPath(60, 47) == false, "ctx.isPointInPath(60, 47) == false");
+ok(ctx.isPointInPath(70, 20) == false, "ctx.isPointInPath(70, 20) == false");
+ok(ctx.isPointInPath(70, 30) == true, "ctx.isPointInPath(70, 30) == true");
+ok(ctx.isPointInPath(75, 20) == false, "ctx.isPointInPath(75, 20) == false");
+ok(ctx.isPointInPath(75, 30) == false, "ctx.isPointInPath(75, 30) == false");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.isPointInPath.bigarc.html ]]] -->
+
+<p>Canvas test: 2d.path.isPointInPath.bigarc</p>
+<!-- Testing: isPointInPath() works on unclosed arcs larger than 2pi -->
+<canvas id="c403" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_isPointInPath_bigarc() {
+
+var canvas = document.getElementById('c403');
+var ctx = canvas.getContext('2d');
+
+ctx.arc(50, 25, 10, 0, 7, false);
+ok(ctx.isPointInPath(50, 10) === false, "ctx.isPointInPath(50, 10) === false");
+ok(ctx.isPointInPath(50, 20) === true, "ctx.isPointInPath(50, 20) === true");
+ok(ctx.isPointInPath(50, 30) === true, "ctx.isPointInPath(50, 30) === true");
+ok(ctx.isPointInPath(50, 40) === false, "ctx.isPointInPath(50, 40) === false");
+ok(ctx.isPointInPath(30, 20) === false, "ctx.isPointInPath(30, 20) === false");
+ok(ctx.isPointInPath(70, 20) === false, "ctx.isPointInPath(70, 20) === false");
+ok(ctx.isPointInPath(30, 30) === false, "ctx.isPointInPath(30, 30) === false");
+ok(ctx.isPointInPath(70, 30) === false, "ctx.isPointInPath(70, 30) === false");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.isPointInPath.edge.html ]]] -->
+
+<p>Canvas test: 2d.path.isPointInPath.edge</p>
+<!-- Testing: isPointInPath() counts points on the path as being inside -->
+<canvas id="c404" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_isPointInPath_edge() {
+
+var canvas = document.getElementById('c404');
+var ctx = canvas.getContext('2d');
+
+ctx.rect(0, 0, 20, 20);
+
+ok(ctx.isPointInPath(0, 0) === true, "ctx.isPointInPath(0, 0) === true");
+ok(ctx.isPointInPath(10, 0) === true, "ctx.isPointInPath(10, 0) === true");
+ok(ctx.isPointInPath(20, 0) === true, "ctx.isPointInPath(20, 0) === true");
+ok(ctx.isPointInPath(20, 10) === true, "ctx.isPointInPath(20, 10) === true");
+ok(ctx.isPointInPath(20, 20) === true, "ctx.isPointInPath(20, 20) === true");
+ok(ctx.isPointInPath(10, 20) === true, "ctx.isPointInPath(10, 20) === true");
+ok(ctx.isPointInPath(0, 20) === true, "ctx.isPointInPath(0, 20) === true");
+ok(ctx.isPointInPath(0, 10) === true, "ctx.isPointInPath(0, 10) === true");
+ok(ctx.isPointInPath(10, -0.01) === false, "ctx.isPointInPath(10, -0.01) === false");
+ok(ctx.isPointInPath(10, 20.01) === false, "ctx.isPointInPath(10, 20.01) === false");
+ok(ctx.isPointInPath(-0.01, 10) === false, "ctx.isPointInPath(-0.01, 10) === false");
+ok(ctx.isPointInPath(20.01, 10) === false, "ctx.isPointInPath(20.01, 10) === false");
+
+}
+</script>
+
+<!-- [[[ test_2d.path.isPointInPath.empty.html ]]] -->
+
+<p>Canvas test: 2d.path.isPointInPath.empty</p>
+<!-- Testing: isPointInPath() works when there is no path -->
+<canvas id="c405" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_isPointInPath_empty() {
+
+var canvas = document.getElementById('c405');
+var ctx = canvas.getContext('2d');
+
+ok(ctx.isPointInPath(0, 0) === false, "ctx.isPointInPath(0, 0) === false");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.isPointInPath.nonfinite.html ]]] -->
+
+<p>Canvas test: 2d.path.isPointInPath.nonfinite</p>
+<!-- Testing: isPointInPath() returns false for non-finite arguments -->
+<canvas id="c406" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_isPointInPath_nonfinite() {
+
+var canvas = document.getElementById('c406');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.rect(-100, -50, 200, 100);
+ok(ctx.isPointInPath(Infinity, 0) === false, "ctx.isPointInPath(Infinity, 0) === false");
+ok(ctx.isPointInPath(-Infinity, 0) === false, "ctx.isPointInPath(-Infinity, 0) === false");
+ok(ctx.isPointInPath(NaN, 0) === false, "ctx.isPointInPath(NaN, 0) === false");
+ok(ctx.isPointInPath(0, Infinity) === false, "ctx.isPointInPath(0, Infinity) === false");
+ok(ctx.isPointInPath(0, -Infinity) === false, "ctx.isPointInPath(0, -Infinity) === false");
+ok(ctx.isPointInPath(0, NaN) === false, "ctx.isPointInPath(0, NaN) === false");
+ok(ctx.isPointInPath(NaN, NaN) === false, "ctx.isPointInPath(NaN, NaN) === false");
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.isPointInPath.outside.html ]]] -->
+
+<p>Canvas test: 2d.path.isPointInPath.outside</p>
+<!-- Testing: isPointInPath() works on paths outside the canvas -->
+<canvas id="c407" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_isPointInPath_outside() {
+
+var canvas = document.getElementById('c407');
+var ctx = canvas.getContext('2d');
+
+ctx.rect(0, -100, 20, 20);
+ctx.rect(20, -10, 20, 20);
+ok(ctx.isPointInPath(10, -110) === false, "ctx.isPointInPath(10, -110) === false");
+ok(ctx.isPointInPath(10, -90) === true, "ctx.isPointInPath(10, -90) === true");
+ok(ctx.isPointInPath(10, -70) === false, "ctx.isPointInPath(10, -70) === false");
+ok(ctx.isPointInPath(30, -20) === false, "ctx.isPointInPath(30, -20) === false");
+ok(ctx.isPointInPath(30, 0) === true, "ctx.isPointInPath(30, 0) === true");
+ok(ctx.isPointInPath(30, 20) === false, "ctx.isPointInPath(30, 20) === false");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.isPointInPath.subpath.html ]]] -->
+
+<p>Canvas test: 2d.path.isPointInPath.subpath</p>
+<!-- Testing: isPointInPath() uses the current path, not just the subpath -->
+<canvas id="c408" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_isPointInPath_subpath() {
+
+var canvas = document.getElementById('c408');
+var ctx = canvas.getContext('2d');
+
+ctx.rect(0, 0, 20, 20);
+ctx.beginPath();
+ctx.rect(20, 0, 20, 20);
+ctx.closePath();
+ctx.rect(40, 0, 20, 20);
+ok(ctx.isPointInPath(10, 10) === false, "ctx.isPointInPath(10, 10) === false");
+ok(ctx.isPointInPath(30, 10) === true, "ctx.isPointInPath(30, 10) === true");
+ok(ctx.isPointInPath(50, 10) === true, "ctx.isPointInPath(50, 10) === true");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.isPointInPath.transform.1.html ]]] -->
+
+<p>Canvas test: 2d.path.isPointInPath.transform.1 - bug 405300</p>
+<!-- Testing: isPointInPath() handles transformations correctly -->
+<canvas id="c409" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_isPointInPath_transform_1() {
+
+var canvas = document.getElementById('c409');
+var ctx = canvas.getContext('2d');
+
+ctx.translate(50, 0);
+ctx.rect(0, 0, 20, 20);
+ok(ctx.isPointInPath(-40, 10) === false, "ctx.isPointInPath(-40, 10) === false");
+ok(ctx.isPointInPath(10, 10) === false, "ctx.isPointInPath(10, 10) === false");
+ok(ctx.isPointInPath(49, 10) === false, "ctx.isPointInPath(49, 10) === false");
+ok(ctx.isPointInPath(51, 10) === true, "ctx.isPointInPath(51, 10) === true");
+ok(ctx.isPointInPath(69, 10) === true, "ctx.isPointInPath(69, 10) === true");
+ok(ctx.isPointInPath(71, 10) === false, "ctx.isPointInPath(71, 10) === false");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.isPointInPath.transform.2.html ]]] -->
+
+<p>Canvas test: 2d.path.isPointInPath.transform.2 - bug 405300</p>
+<!-- Testing: isPointInPath() handles transformations correctly -->
+<canvas id="c410" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_isPointInPath_transform_2() {
+
+var canvas = document.getElementById('c410');
+var ctx = canvas.getContext('2d');
+
+ctx.rect(50, 0, 20, 20);
+ctx.translate(50, 0);
+ok(ctx.isPointInPath(-40, 10) === false, "ctx.isPointInPath(-40, 10) === false");
+ok(ctx.isPointInPath(10, 10) === false, "ctx.isPointInPath(10, 10) === false");
+ok(ctx.isPointInPath(49, 10) === false, "ctx.isPointInPath(49, 10) === false");
+ok(ctx.isPointInPath(51, 10) === true, "ctx.isPointInPath(51, 10) === true");
+ok(ctx.isPointInPath(69, 10) === true, "ctx.isPointInPath(69, 10) === true");
+ok(ctx.isPointInPath(71, 10) === false, "ctx.isPointInPath(71, 10) === false");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.isPointInPath.transform.3.html ]]] -->
+
+<p>Canvas test: 2d.path.isPointInPath.transform.3 - bug 405300</p>
+<!-- Testing: isPointInPath() handles transformations correctly -->
+<canvas id="c411" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_isPointInPath_transform_3() {
+
+var canvas = document.getElementById('c411');
+var ctx = canvas.getContext('2d');
+
+ctx.scale(-1, 1);
+ctx.rect(-70, 0, 20, 20);
+ok(ctx.isPointInPath(-40, 10) === false, "ctx.isPointInPath(-40, 10) === false");
+ok(ctx.isPointInPath(10, 10) === false, "ctx.isPointInPath(10, 10) === false");
+ok(ctx.isPointInPath(49, 10) === false, "ctx.isPointInPath(49, 10) === false");
+ok(ctx.isPointInPath(51, 10) === true, "ctx.isPointInPath(51, 10) === true");
+ok(ctx.isPointInPath(69, 10) === true, "ctx.isPointInPath(69, 10) === true");
+ok(ctx.isPointInPath(71, 10) === false, "ctx.isPointInPath(71, 10) === false");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.isPointInPath.unclosed.html ]]] -->
+
+<p>Canvas test: 2d.path.isPointInPath.unclosed</p>
+<!-- Testing: isPointInPath() works on unclosed subpaths -->
+<canvas id="c412" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_isPointInPath_unclosed() {
+
+var canvas = document.getElementById('c412');
+var ctx = canvas.getContext('2d');
+
+ctx.moveTo(0, 0);
+ctx.lineTo(20, 0);
+ctx.lineTo(20, 20);
+ctx.lineTo(0, 20);
+ok(ctx.isPointInPath(10, 10) === true, "ctx.isPointInPath(10, 10) === true");
+ok(ctx.isPointInPath(30, 10) === false, "ctx.isPointInPath(30, 10) === false");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.isPointInPath.winding.html ]]] -->
+
+<p>Canvas test: 2d.path.isPointInPath.winding</p>
+<!-- Testing: isPointInPath() uses the non-zero winding number rule -->
+<canvas id="c413" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_isPointInPath_winding() {
+
+var canvas = document.getElementById('c413');
+var ctx = canvas.getContext('2d');
+
+// Create a square ring, using opposite windings to make a hole in the centre
+ctx.moveTo(0, 0);
+ctx.lineTo(50, 0);
+ctx.lineTo(50, 50);
+ctx.lineTo(0, 50);
+ctx.lineTo(0, 0);
+ctx.lineTo(10, 10);
+ctx.lineTo(10, 40);
+ctx.lineTo(40, 40);
+ctx.lineTo(40, 10);
+ctx.lineTo(10, 10);
+
+ok(ctx.isPointInPath(5, 5) === true, "ctx.isPointInPath(5, 5) === true");
+ok(ctx.isPointInPath(25, 5) === true, "ctx.isPointInPath(25, 5) === true");
+ok(ctx.isPointInPath(45, 5) === true, "ctx.isPointInPath(45, 5) === true");
+ok(ctx.isPointInPath(5, 25) === true, "ctx.isPointInPath(5, 25) === true");
+ok(ctx.isPointInPath(25, 25) === false, "ctx.isPointInPath(25, 25) === false");
+ok(ctx.isPointInPath(45, 25) === true, "ctx.isPointInPath(45, 25) === true");
+ok(ctx.isPointInPath(5, 45) === true, "ctx.isPointInPath(5, 45) === true");
+ok(ctx.isPointInPath(25, 45) === true, "ctx.isPointInPath(25, 45) === true");
+ok(ctx.isPointInPath(45, 45) === true, "ctx.isPointInPath(45, 45) === true");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.lineTo.basic.html ]]] -->
+
+<p>Canvas test: 2d.path.lineTo.basic</p>
+<canvas id="c414" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_lineTo_basic() {
+
+var canvas = document.getElementById('c414');
+var ctx = canvas.getContext('2d');
+
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 50;
+ctx.beginPath();
+ctx.moveTo(0, 25);
+ctx.lineTo(100, 25);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.lineTo.emptysubpath.html ]]] -->
+
+<p>Canvas test: 2d.path.lineTo.emptysubpath</p>
+<canvas id="c415" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_path_lineTo_emptysubpath() {
+
+var canvas = document.getElementById('c415');
+var ctx = canvas.getContext('2d');
+
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 50;
+ctx.beginPath();
+ctx.lineTo(0, 25);
+ctx.lineTo(100, 25);
+ctx.stroke();
+todo_isPixel(ctx, 50,25, 0,0,0,0, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.lineTo.nextpoint.html ]]] -->
+
+<p>Canvas test: 2d.path.lineTo.nextpoint</p>
+<canvas id="c416" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_lineTo_nextpoint() {
+
+var canvas = document.getElementById('c416');
+var ctx = canvas.getContext('2d');
+
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 50;
+ctx.beginPath();
+ctx.moveTo(-100, -100);
+ctx.lineTo(0, 25);
+ctx.lineTo(100, 25);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.lineTo.nonfinite.html ]]] -->
+
+<p>Canvas test: 2d.path.lineTo.nonfinite</p>
+<!-- Testing: lineTo() with Infinity/NaN is ignored -->
+<canvas id="c417" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_lineTo_nonfinite() {
+
+var canvas = document.getElementById('c417');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.moveTo(0, 0);
+ctx.lineTo(100, 0);
+ctx.lineTo(Infinity, 50);
+ctx.lineTo(-Infinity, 50);
+ctx.lineTo(NaN, 50);
+ctx.lineTo(0, Infinity);
+ctx.lineTo(0, -Infinity);
+ctx.lineTo(0, NaN);
+ctx.lineTo(Infinity, Infinity);
+ctx.lineTo(100, 50);
+ctx.lineTo(0, 50);
+ctx.fillStyle = '#0f0';
+ctx.fill();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 90,45, 0,255,0,255, 0);
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.moveTo.basic.html ]]] -->
+
+<p>Canvas test: 2d.path.moveTo.basic</p>
+<canvas id="c418" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_moveTo_basic() {
+
+var canvas = document.getElementById('c418');
+var ctx = canvas.getContext('2d');
+
+ctx.rect(0, 0, 10, 50);
+ctx.moveTo(100, 0);
+ctx.lineTo(10, 0);
+ctx.lineTo(10, 50);
+ctx.lineTo(100, 50);
+ctx.fillStyle = '#0f0';
+ctx.fill();
+isPixel(ctx, 90,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.moveTo.multiple.html ]]] -->
+
+<p>Canvas test: 2d.path.moveTo.multiple</p>
+<canvas id="c419" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_moveTo_multiple() {
+
+var canvas = document.getElementById('c419');
+var ctx = canvas.getContext('2d');
+
+ctx.moveTo(0, 25);
+ctx.moveTo(100, 25);
+ctx.moveTo(0, 25);
+ctx.lineTo(100, 25);
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 50;
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.moveTo.newsubpath.html ]]] -->
+
+<p>Canvas test: 2d.path.moveTo.newsubpath</p>
+<canvas id="c420" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_moveTo_newsubpath() {
+
+var canvas = document.getElementById('c420');
+var ctx = canvas.getContext('2d');
+
+ctx.beginPath();
+ctx.moveTo(0, 0);
+ctx.moveTo(100, 0);
+ctx.moveTo(100, 50);
+ctx.moveTo(0, 50);
+ctx.fillStyle = '#f00';
+ctx.fill();
+isPixel(ctx, 50,25, 0,0,0,0, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.moveTo.nonfinite.html ]]] -->
+
+<p>Canvas test: 2d.path.moveTo.nonfinite</p>
+<!-- Testing: moveTo() with Infinity/NaN is ignored -->
+<canvas id="c421" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_moveTo_nonfinite() {
+
+var canvas = document.getElementById('c421');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.moveTo(0, 0);
+ctx.lineTo(100, 0);
+ctx.moveTo(Infinity, 50);
+ctx.moveTo(-Infinity, 50);
+ctx.moveTo(NaN, 50);
+ctx.moveTo(0, Infinity);
+ctx.moveTo(0, -Infinity);
+ctx.moveTo(0, NaN);
+ctx.moveTo(Infinity, Infinity);
+ctx.lineTo(100, 50);
+ctx.lineTo(0, 50);
+ctx.fillStyle = '#0f0';
+ctx.fill();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.quadraticCurveTo.basic.html ]]] -->
+
+<p>Canvas test: 2d.path.quadraticCurveTo.basic</p>
+<canvas id="c422" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_quadraticCurveTo_basic() {
+
+var canvas = document.getElementById('c422');
+var ctx = canvas.getContext('2d');
+
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 50;
+ctx.beginPath();
+ctx.moveTo(0, 25);
+ctx.quadraticCurveTo(100, 25, 100, 25);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.quadraticCurveTo.emptysubpath.html ]]] -->
+
+<p>Canvas test: 2d.path.quadraticCurveTo.emptysubpath</p>
+<canvas id="c423" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_path_quadraticCurveTo_emptysubpath() {
+
+var canvas = document.getElementById('c423');
+var ctx = canvas.getContext('2d');
+
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 50;
+ctx.beginPath();
+ctx.quadraticCurveTo(0, 25, 0, 25);
+ctx.quadraticCurveTo(100, 25, 100, 25);
+ctx.stroke();
+todo_isPixel(ctx, 50,25, 0,0,0,0, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.quadraticCurveTo.nonfinite.html ]]] -->
+
+<p>Canvas test: 2d.path.quadraticCurveTo.nonfinite</p>
+<!-- Testing: quadraticCurveTo() with Infinity/NaN is ignored -->
+<canvas id="c424" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_quadraticCurveTo_nonfinite() {
+
+var canvas = document.getElementById('c424');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.moveTo(0, 0);
+ctx.lineTo(100, 0);
+ctx.quadraticCurveTo(Infinity, 50, 0, 50);
+ctx.quadraticCurveTo(-Infinity, 50, 0, 50);
+ctx.quadraticCurveTo(NaN, 50, 0, 50);
+ctx.quadraticCurveTo(0, Infinity, 0, 50);
+ctx.quadraticCurveTo(0, -Infinity, 0, 50);
+ctx.quadraticCurveTo(0, NaN, 0, 50);
+ctx.quadraticCurveTo(0, 50, Infinity, 50);
+ctx.quadraticCurveTo(0, 50, -Infinity, 50);
+ctx.quadraticCurveTo(0, 50, NaN, 50);
+ctx.quadraticCurveTo(0, 50, 0, Infinity);
+ctx.quadraticCurveTo(0, 50, 0, -Infinity);
+ctx.quadraticCurveTo(0, 50, 0, NaN);
+ctx.quadraticCurveTo(Infinity, Infinity, 0, 50);
+ctx.quadraticCurveTo(Infinity, Infinity, Infinity, 50);
+ctx.quadraticCurveTo(Infinity, Infinity, Infinity, Infinity);
+ctx.quadraticCurveTo(Infinity, Infinity, 0, Infinity);
+ctx.quadraticCurveTo(Infinity, 50, Infinity, 50);
+ctx.quadraticCurveTo(Infinity, 50, Infinity, Infinity);
+ctx.quadraticCurveTo(Infinity, 50, 0, Infinity);
+ctx.quadraticCurveTo(0, Infinity, Infinity, 50);
+ctx.quadraticCurveTo(0, Infinity, Infinity, Infinity);
+ctx.quadraticCurveTo(0, Infinity, 0, Infinity);
+ctx.quadraticCurveTo(0, 50, Infinity, Infinity);
+ctx.lineTo(100, 50);
+ctx.lineTo(0, 50);
+ctx.fillStyle = '#0f0';
+ctx.fill();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 90,45, 0,255,0,255, 0);
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.quadraticCurveTo.scaled.html ]]] -->
+
+<p>Canvas test: 2d.path.quadraticCurveTo.scaled</p>
+<canvas id="c425" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_quadraticCurveTo_scaled() {
+
+var canvas = document.getElementById('c425');
+var ctx = canvas.getContext('2d');
+
+ctx.scale(1000, 1000);
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 0.055;
+ctx.beginPath();
+ctx.moveTo(-1, 1.05);
+ctx.quadraticCurveTo(0, -1, 1.2, 1.05);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.quadraticCurveTo.shape.html ]]] -->
+
+<p>Canvas test: 2d.path.quadraticCurveTo.shape</p>
+<canvas id="c426" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_quadraticCurveTo_shape() {
+
+var canvas = document.getElementById('c426');
+var ctx = canvas.getContext('2d');
+
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 55;
+ctx.beginPath();
+ctx.moveTo(-1000, 1050);
+ctx.quadraticCurveTo(0, -1000, 1200, 1050);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.rect.basic.html ]]] -->
+
+<p>Canvas test: 2d.path.rect.basic</p>
+<canvas id="c427" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_rect_basic() {
+
+var canvas = document.getElementById('c427');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.rect(0, 0, 100, 50);
+ctx.fill();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.rect.closed.html ]]] -->
+
+<p>Canvas test: 2d.path.rect.closed</p>
+<canvas id="c428" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_rect_closed() {
+
+var canvas = document.getElementById('c428');
+var ctx = canvas.getContext('2d');
+
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 200;
+ctx.lineJoin = 'miter';
+ctx.rect(100, 50, 100, 100);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.rect.end.1.html ]]] -->
+
+<p>Canvas test: 2d.path.rect.end.1</p>
+<canvas id="c429" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_rect_end_1() {
+
+var canvas = document.getElementById('c429');
+var ctx = canvas.getContext('2d');
+
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 100;
+ctx.rect(200, 100, 400, 1000);
+ctx.lineTo(-2000, -1000);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.rect.end.2.html ]]] -->
+
+<p>Canvas test: 2d.path.rect.end.2</p>
+<canvas id="c430" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_rect_end_2() {
+
+var canvas = document.getElementById('c430');
+var ctx = canvas.getContext('2d');
+
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 450;
+ctx.lineCap = 'round';
+ctx.lineJoin = 'bevel';
+ctx.rect(150, 150, 2000, 2000);
+ctx.lineTo(160, 160);
+ctx.stroke();
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.rect.negative.html ]]] -->
+
+<p>Canvas test: 2d.path.rect.negative</p>
+<canvas id="c431" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_rect_negative() {
+
+var canvas = document.getElementById('c431');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.beginPath();
+ctx.fillStyle = '#0f0';
+ctx.rect(0, 0, 50, 25);
+ctx.rect(100, 0, -50, 25);
+ctx.rect(0, 50, 50, -25);
+ctx.rect(100, 50, -50, -25);
+ctx.fill();
+isPixel(ctx, 25,12, 0,255,0,255, 0);
+isPixel(ctx, 75,12, 0,255,0,255, 0);
+isPixel(ctx, 25,37, 0,255,0,255, 0);
+isPixel(ctx, 75,37, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.rect.newsubpath.html ]]] -->
+
+<p>Canvas test: 2d.path.rect.newsubpath</p>
+<canvas id="c432" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_rect_newsubpath() {
+
+var canvas = document.getElementById('c432');
+var ctx = canvas.getContext('2d');
+
+ctx.beginPath();
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 50;
+ctx.moveTo(-100, 25);
+ctx.lineTo(-50, 25);
+ctx.rect(200, 25, 1, 1);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,0,0,0, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.rect.nonfinite.html ]]] -->
+
+<p>Canvas test: 2d.path.rect.nonfinite</p>
+<!-- Testing: rect() with Infinity/NaN is ignored -->
+<canvas id="c433" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_rect_nonfinite() {
+
+var canvas = document.getElementById('c433');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.moveTo(0, 0);
+ctx.lineTo(100, 0);
+ctx.rect(Infinity, 50, 1, 1);
+ctx.rect(-Infinity, 50, 1, 1);
+ctx.rect(NaN, 50, 1, 1);
+ctx.rect(0, Infinity, 1, 1);
+ctx.rect(0, -Infinity, 1, 1);
+ctx.rect(0, NaN, 1, 1);
+ctx.rect(0, 50, Infinity, 1);
+ctx.rect(0, 50, -Infinity, 1);
+ctx.rect(0, 50, NaN, 1);
+ctx.rect(0, 50, 1, Infinity);
+ctx.rect(0, 50, 1, -Infinity);
+ctx.rect(0, 50, 1, NaN);
+ctx.rect(Infinity, Infinity, 1, 1);
+ctx.rect(Infinity, Infinity, Infinity, 1);
+ctx.rect(Infinity, Infinity, Infinity, Infinity);
+ctx.rect(Infinity, Infinity, 1, Infinity);
+ctx.rect(Infinity, 50, Infinity, 1);
+ctx.rect(Infinity, 50, Infinity, Infinity);
+ctx.rect(Infinity, 50, 1, Infinity);
+ctx.rect(0, Infinity, Infinity, 1);
+ctx.rect(0, Infinity, Infinity, Infinity);
+ctx.rect(0, Infinity, 1, Infinity);
+ctx.rect(0, 50, Infinity, Infinity);
+ctx.lineTo(100, 50);
+ctx.lineTo(0, 50);
+ctx.fillStyle = '#0f0';
+ctx.fill();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 90,45, 0,255,0,255, 0);
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.rect.selfintersect.html ]]] -->
+
+<p>Canvas test: 2d.path.rect.selfintersect</p>
+<canvas id="c434" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_path_rect_selfintersect() {
+
+var canvas = document.getElementById('c434');
+var ctx = canvas.getContext('2d');
+
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 90;
+ctx.beginPath();
+ctx.rect(45, 20, 10, 10);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.rect.winding.html ]]] -->
+
+<p>Canvas test: 2d.path.rect.winding</p>
+<canvas id="c435" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_rect_winding() {
+
+var canvas = document.getElementById('c435');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.beginPath();
+ctx.fillStyle = '#f00';
+ctx.rect(0, 0, 50, 50);
+ctx.rect(100, 50, -50, -50);
+ctx.rect(0, 25, 100, -25);
+ctx.rect(100, 25, -100, 25);
+ctx.fill();
+isPixel(ctx, 25,12, 0,255,0,255, 0);
+isPixel(ctx, 75,12, 0,255,0,255, 0);
+isPixel(ctx, 25,37, 0,255,0,255, 0);
+isPixel(ctx, 75,37, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.rect.zero.1.html ]]] -->
+
+<p>Canvas test: 2d.path.rect.zero.1</p>
+<canvas id="c436" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_rect_zero_1() {
+
+var canvas = document.getElementById('c436');
+var ctx = canvas.getContext('2d');
+
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 100;
+ctx.beginPath();
+ctx.rect(0, 50, 100, 0);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.rect.zero.2.html ]]] -->
+
+<p>Canvas test: 2d.path.rect.zero.2</p>
+<canvas id="c437" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_rect_zero_2() {
+
+var canvas = document.getElementById('c437');
+var ctx = canvas.getContext('2d');
+
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 100;
+ctx.beginPath();
+ctx.rect(50, -100, 0, 250);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.rect.zero.3.html ]]] -->
+
+<p>Canvas test: 2d.path.rect.zero.3</p>
+<canvas id="c438" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_rect_zero_3() {
+
+var canvas = document.getElementById('c438');
+var ctx = canvas.getContext('2d');
+
+if (!IsD2DEnabled()) {
+ // Disabled for D2D until we can figure out Bug 587554.
+ ctx.strokeStyle = '#f00';
+ ctx.lineWidth = 100;
+ ctx.beginPath();
+ ctx.rect(50, 25, 0, 0);
+ ctx.stroke();
+ isPixel(ctx, 50,25, 0,0,0,0, 0);
+}
+
+}
+</script>
+
+<!-- [[[ test_2d.path.rect.zero.4.html ]]] -->
+
+<p>Canvas test: 2d.path.rect.zero.4</p>
+<canvas id="c439" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_rect_zero_4() {
+
+var canvas = document.getElementById('c439');
+var ctx = canvas.getContext('2d');
+
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 50;
+ctx.rect(100, 25, 0, 0);
+ctx.lineTo(0, 25);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.rect.zero.5.html ]]] -->
+
+<p>Canvas test: 2d.path.rect.zero.5</p>
+<canvas id="c440" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_rect_zero_5() {
+
+var canvas = document.getElementById('c440');
+var ctx = canvas.getContext('2d');
+
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 50;
+ctx.moveTo(0, 0);
+ctx.rect(100, 25, 0, 0);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,0,0,0, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.rect.zero.6.html ]]] -->
+
+<p>Canvas test: 2d.path.rect.zero.6</p>
+<canvas id="c441" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_path_rect_zero_6() {
+
+var canvas = document.getElementById('c441');
+var ctx = canvas.getContext('2d');
+
+ctx.strokeStyle = '#f00';
+ctx.lineJoin = 'miter';
+ctx.miterLimit = 1.5;
+ctx.lineWidth = 200;
+ctx.beginPath();
+ctx.rect(100, 25, 1000, 0);
+ctx.stroke();
+todo_isPixel(ctx, 50,25, 0,0,0,0, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.stroke.empty.html ]]] -->
+
+<p>Canvas test: 2d.path.stroke.empty</p>
+<!-- Testing: Empty subpaths are not stroked -->
+<canvas id="c442" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_stroke_empty() {
+
+var canvas = document.getElementById('c442');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 100;
+ctx.lineCap = 'round';
+ctx.lineJoin = 'round';
+
+ctx.beginPath();
+ctx.moveTo(40, 25);
+ctx.moveTo(60, 25);
+ctx.stroke();
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.stroke.overlap.html ]]] -->
+
+<p>Canvas test: 2d.path.stroke.overlap</p>
+<!-- Testing: Stroked subpaths are combined before being drawn -->
+<canvas id="c443" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_stroke_overlap() {
+
+var canvas = document.getElementById('c443');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#000';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.strokeStyle = 'rgba(0, 255, 0, 0.5)';
+ctx.lineWidth = 50;
+ctx.moveTo(0, 20);
+ctx.lineTo(100, 20);
+ctx.moveTo(0, 30);
+ctx.lineTo(100, 30);
+ctx.stroke();
+
+isPixel(ctx, 50,25, 0,127,0,255, 1);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.stroke.prune.arc.html ]]] -->
+
+<p>Canvas test: 2d.path.stroke.prune.arc</p>
+<!-- Testing: Zero-length line segments from arcTo and arc are removed before stroking -->
+<canvas id="c444" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_path_stroke_prune_arc() {
+
+var canvas = document.getElementById('c444');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 100;
+ctx.lineCap = 'round';
+ctx.lineJoin = 'round';
+
+ctx.beginPath();
+ctx.moveTo(50, 25);
+ctx.arcTo(50, 25, 150, 25, 10);
+ctx.stroke();
+
+ctx.beginPath();
+ctx.moveTo(50, 25);
+ctx.arc(50, 25, 10, 0, 0, false);
+ctx.stroke();
+
+todo_isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.stroke.prune.closed.html ]]] -->
+
+<p>Canvas test: 2d.path.stroke.prune.closed</p>
+<!-- Testing: Zero-length line segments from closed paths are removed before stroking -->
+<canvas id="c445" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_path_stroke_prune_closed() {
+
+var canvas = document.getElementById('c445');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 100;
+ctx.lineCap = 'round';
+ctx.lineJoin = 'round';
+
+ctx.beginPath();
+ctx.moveTo(50, 25);
+ctx.lineTo(50, 25);
+ctx.closePath();
+ctx.stroke();
+
+todo_isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+}
+</script>
+
+<!-- [[[ test_2d.path.stroke.prune.corner.html ]]] -->
+
+<p>Canvas test: 2d.path.stroke.prune.corner</p>
+<!-- Testing: Zero-length line segments are removed before stroking with miters -->
+<canvas id="c446" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_stroke_prune_corner() {
+
+var canvas = document.getElementById('c446');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 400;
+ctx.lineJoin = 'miter';
+ctx.miterLimit = 1.4;
+
+ctx.beginPath();
+ctx.moveTo(-1000, 200, 0, 0);
+ctx.lineTo(-100, 200);
+ctx.lineTo(-100, 200);
+ctx.lineTo(-100, 200);
+ctx.lineTo(-100, 1000);
+ctx.stroke();
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.stroke.prune.curve.html ]]] -->
+
+<p>Canvas test: 2d.path.stroke.prune.curve</p>
+<!-- Testing: Zero-length line segments from quadraticCurveTo and bezierCurveTo are removed before stroking -->
+<canvas id="c447" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_path_stroke_prune_curve() {
+
+var canvas = document.getElementById('c447');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 100;
+ctx.lineCap = 'round';
+ctx.lineJoin = 'round';
+
+ctx.beginPath();
+ctx.moveTo(50, 25);
+ctx.quadraticCurveTo(50, 25, 50, 25);
+ctx.stroke();
+
+ctx.beginPath();
+ctx.moveTo(50, 25);
+ctx.bezierCurveTo(50, 25, 50, 25, 50, 25);
+ctx.stroke();
+
+todo_isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+}
+</script>
+
+<!-- [[[ test_2d.path.stroke.prune.line.html ]]] -->
+
+<p>Canvas test: 2d.path.stroke.prune.line</p>
+<!-- Testing: Zero-length line segments from lineTo are removed before stroking -->
+<canvas id="c448" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_path_stroke_prune_line() {
+
+var canvas = document.getElementById('c448');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 100;
+ctx.lineCap = 'round';
+ctx.lineJoin = 'round';
+
+ctx.beginPath();
+ctx.moveTo(50, 25);
+ctx.lineTo(50, 25);
+ctx.stroke();
+
+todo_isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+}
+</script>
+
+<!-- [[[ test_2d.path.stroke.prune.rect.html ]]] -->
+
+<p>Canvas test: 2d.path.stroke.prune.rect</p>
+<!-- Testing: Zero-length line segments from rect and strokeRect are removed before stroking -->
+<canvas id="c449" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_path_stroke_prune_rect() {
+
+var canvas = document.getElementById('c449');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 100;
+ctx.lineCap = 'round';
+ctx.lineJoin = 'round';
+
+ctx.beginPath();
+ctx.rect(50, 25, 0, 0);
+ctx.stroke();
+
+ctx.strokeRect(50, 25, 0, 0);
+
+todo_isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+}
+</script>
+
+<!-- [[[ test_2d.path.stroke.scale1.html ]]] -->
+
+<p>Canvas test: 2d.path.stroke.scale1</p>
+<!-- Testing: Stroke line widths are scaled by the current transformation matrix -->
+<canvas id="c450" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_stroke_scale1() {
+
+var canvas = document.getElementById('c450');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.beginPath();
+ctx.rect(25, 12.5, 50, 25);
+ctx.save();
+ctx.scale(50, 25);
+ctx.strokeStyle = '#0f0';
+ctx.stroke();
+ctx.restore();
+
+ctx.beginPath();
+ctx.rect(-25, -12.5, 150, 75);
+ctx.save();
+ctx.scale(50, 25);
+ctx.strokeStyle = '#f00';
+ctx.stroke();
+ctx.restore();
+
+isPixel(ctx, 0,0, 0,255,0,255, 0);
+isPixel(ctx, 50,0, 0,255,0,255, 0);
+isPixel(ctx, 99,0, 0,255,0,255, 0);
+isPixel(ctx, 0,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 99,25, 0,255,0,255, 0);
+isPixel(ctx, 0,49, 0,255,0,255, 0);
+isPixel(ctx, 50,49, 0,255,0,255, 0);
+isPixel(ctx, 99,49, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.stroke.scale2.html ]]] -->
+
+<p>Canvas test: 2d.path.stroke.scale2</p>
+<!-- Testing: Stroke line widths are scaled by the current transformation matrix -->
+<canvas id="c451" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_stroke_scale2() {
+
+var canvas = document.getElementById('c451');
+var ctx = canvas.getContext('2d');
+
+if (!IsD2DEnabled()) {
+ // On D2D a rasterization bug causes a small discrepancy here. See bug 587316
+ ctx.fillStyle = '#f00';
+ ctx.fillRect(0, 0, 100, 50);
+
+ ctx.beginPath();
+ ctx.rect(25, 12.5, 50, 25);
+ ctx.save();
+ ctx.rotate(Math.PI/2);
+ ctx.scale(25, 50);
+ ctx.strokeStyle = '#0f0';
+ ctx.stroke();
+ ctx.restore();
+
+ ctx.beginPath();
+ ctx.rect(-25, -12.5, 150, 75);
+ ctx.save();
+ ctx.rotate(Math.PI/2);
+ ctx.scale(25, 50);
+ ctx.strokeStyle = '#f00';
+ ctx.stroke();
+ ctx.restore();
+
+ isPixel(ctx, 0,0, 0,255,0,255, 0);
+ isPixel(ctx, 50,0, 0,255,0,255, 0);
+ isPixel(ctx, 99,0, 0,255,0,255, 0);
+ isPixel(ctx, 0,25, 0,255,0,255, 0);
+ isPixel(ctx, 50,25, 0,255,0,255, 0);
+ isPixel(ctx, 99,25, 0,255,0,255, 0);
+ isPixel(ctx, 0,49, 0,255,0,255, 0);
+ isPixel(ctx, 50,49, 0,255,0,255, 0);
+ isPixel(ctx, 99,49, 0,255,0,255, 0);
+}
+
+}
+</script>
+
+<!-- [[[ test_2d.path.stroke.skew.html ]]] -->
+
+<p>Canvas test: 2d.path.stroke.skew</p>
+<!-- Testing: Strokes lines are skewed by the current transformation matrix -->
+<canvas id="c452" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_stroke_skew() {
+
+var canvas = document.getElementById('c452');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.save();
+ctx.beginPath();
+ctx.moveTo(49, -50);
+ctx.lineTo(201, -50);
+ctx.rotate(Math.PI/4);
+ctx.scale(1, 283);
+ctx.strokeStyle = '#0f0';
+ctx.stroke();
+ctx.restore();
+
+ctx.save();
+ctx.beginPath();
+ctx.translate(-150, 0);
+ctx.moveTo(49, -50);
+ctx.lineTo(199, -50);
+ctx.rotate(Math.PI/4);
+ctx.scale(1, 142);
+ctx.strokeStyle = '#f00';
+ctx.stroke();
+ctx.restore();
+
+ctx.save();
+ctx.beginPath();
+ctx.translate(-150, 0);
+ctx.moveTo(49, -50);
+ctx.lineTo(199, -50);
+ctx.rotate(Math.PI/4);
+ctx.scale(1, 142);
+ctx.strokeStyle = '#f00';
+ctx.stroke();
+ctx.restore();
+
+isPixel(ctx, 0,0, 0,255,0,255, 0);
+isPixel(ctx, 50,0, 0,255,0,255, 0);
+isPixel(ctx, 99,0, 0,255,0,255, 0);
+isPixel(ctx, 0,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 99,25, 0,255,0,255, 0);
+isPixel(ctx, 0,49, 0,255,0,255, 0);
+isPixel(ctx, 50,49, 0,255,0,255, 0);
+isPixel(ctx, 99,49, 0,255,0,255, 0);
+
+}
+</script>
+
+<!-- [[[ test_2d.path.stroke.unaffected.html ]]] -->
+
+<p>Canvas test: 2d.path.stroke.unaffected</p>
+<!-- Testing: Stroking does not start a new path or subpath -->
+<canvas id="c453" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_stroke_unaffected() {
+
+var canvas = document.getElementById('c453');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.lineWidth = 50;
+ctx.moveTo(-100, 25);
+ctx.lineTo(-100, -100);
+ctx.lineTo(200, -100);
+ctx.lineTo(200, 25);
+ctx.strokeStyle = '#f00';
+ctx.stroke();
+
+ctx.closePath();
+ctx.strokeStyle = '#0f0';
+ctx.stroke();
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.stroke.union.html ]]] -->
+
+<p>Canvas test: 2d.path.stroke.union</p>
+<!-- Testing: Strokes in opposite directions are unioned, not subtracted -->
+<canvas id="c454" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_stroke_union() {
+
+var canvas = document.getElementById('c454');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 40;
+ctx.moveTo(0, 10);
+ctx.lineTo(100, 10);
+ctx.moveTo(100, 40);
+ctx.lineTo(0, 40);
+ctx.stroke();
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.transformation.basic.html ]]] -->
+
+<p>Canvas test: 2d.path.transformation.basic</p>
+<canvas id="c455" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_transformation_basic() {
+
+var canvas = document.getElementById('c455');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.translate(-100, 0);
+ctx.rect(100, 0, 100, 50);
+ctx.translate(0, -100);
+ctx.fillStyle = '#0f0';
+ctx.fill();
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.transformation.changing.html ]]] -->
+
+<p>Canvas test: 2d.path.transformation.changing</p>
+<!-- Testing: Transformations are applied while building paths, not when drawing -->
+<canvas id="c456" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_transformation_changing() {
+
+var canvas = document.getElementById('c456');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#0f0';
+ctx.moveTo(0, 0);
+ctx.translate(100, 0);
+ctx.lineTo(0, 0);
+ctx.translate(0, 50);
+ctx.lineTo(0, 0);
+ctx.translate(-100, 0);
+ctx.lineTo(0, 0);
+ctx.translate(1000, 1000);
+ctx.rotate(Math.PI/2);
+ctx.scale(0.1, 0.1);
+ctx.fill();
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.transformation.multiple.html ]]] -->
+
+<p>Canvas test: 2d.path.transformation.multiple</p>
+<canvas id="c457" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_transformation_multiple() {
+
+var canvas = document.getElementById('c457');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.rect(0, 0, 100, 50);
+ctx.fill();
+ctx.translate(-100, 0);
+ctx.fillStyle = '#0f0';
+ctx.fill();
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.pattern.animated.gif.html ]]] -->
+
+<p>Canvas test: 2d.pattern.animated.gif</p>
+<!-- Testing: createPattern() of an animated GIF draws the first frame -->
+<canvas id="c458" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+var canvas458 = document.getElementById('c458');
+var ctx458 = canvas458.getContext('2d');
+var isDone_test_2d_pattern_animated_gif = false;
+
+function test_2d_pattern_animated_gif() {
+
+deferTest();
+setTimeout(function () {
+ var pattern = ctx458.createPattern(document.getElementById('anim-gr_2.gif'), 'repeat');
+ ctx458.fillStyle = pattern;
+ ctx458.fillRect(0, 0, 50, 50);
+ setTimeout(wrapFunction(function () {
+ ctx458.fillRect(50, 0, 50, 50);
+ isPixel(ctx458, 25,25, 0,255,0,255, 2);
+ isPixel(ctx458, 75,25, 0,255,0,255, 2);
+ isDone_test_2d_pattern_animated_gif = true;
+ }), 2500);
+}, 2500);
+
+
+}
+</script>
+<img src="image_anim-gr.gif" id="anim-gr_2.gif" class="resource">
+
+<!-- [[[ test_2d.pattern.basic.canvas.html ]]] -->
+
+<p>Canvas test: 2d.pattern.basic.canvas</p>
+<canvas id="c459" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_pattern_basic_canvas() {
+
+var canvas = document.getElementById('c459');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+var canvas2 = document.createElement('canvas');
+canvas2.width = 100;
+canvas2.height = 50;
+var ctx2 = canvas2.getContext('2d');
+ctx2.fillStyle = '#0f0';
+ctx2.fillRect(0, 0, 100, 50);
+
+var pattern = ctx.createPattern(canvas2, 'no-repeat');
+ctx.fillStyle = pattern;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 50,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,25, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 50,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.pattern.basic.image.html ]]] -->
+
+<p>Canvas test: 2d.pattern.basic.image</p>
+<canvas id="c460" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_pattern_basic_image() {
+
+var canvas = document.getElementById('c460');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+var img = document.getElementById('green_8.png');
+var pattern = ctx.createPattern(img, 'no-repeat');
+ctx.fillStyle = pattern;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+<img src="image_green.png" id="green_8.png" class="resource">
+
+<!-- [[[ test_2d.pattern.basic.nocontext.html ]]] -->
+
+<p>Canvas test: 2d.pattern.basic.nocontext</p>
+<canvas id="c461" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_pattern_basic_nocontext() {
+
+var canvas = document.getElementById('c461');
+var ctx = canvas.getContext('2d');
+
+var canvas2 = document.createElement('canvas');
+canvas2.width = 100;
+canvas2.height = 50;
+var pattern = ctx.createPattern(canvas2, 'no-repeat');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = pattern;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.pattern.basic.type.html ]]] -->
+
+<p>Canvas test: 2d.pattern.basic.type</p>
+<canvas id="c462" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_pattern_basic_type() {
+
+var canvas = document.getElementById('c462');
+var ctx = canvas.getContext('2d');
+
+ok(window.CanvasPattern !== undefined, "window.CanvasPattern !== undefined");
+
+window.CanvasPattern.prototype.thisImplementsCanvasPattern = true;
+
+var img = document.getElementById('green_9.png');
+var pattern = ctx.createPattern(img, 'no-repeat');
+ok(pattern.thisImplementsCanvasPattern, "pattern.thisImplementsCanvasPattern");
+
+
+}
+</script>
+<img src="image_green.png" id="green_9.png" class="resource">
+
+<!-- [[[ test_2d.pattern.basic.zerocanvas.html ]]] -->
+
+<p>Canvas test: 2d.pattern.basic.zerocanvas</p>
+<canvas id="c463" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_pattern_basic_zerocanvas() {
+
+var canvas = document.getElementById('c463');
+var ctx = canvas.getContext('2d');
+
+canvas.width = 0;
+canvas.height = 10;
+ok(canvas.width === 0, "canvas.width === 0");
+ok(canvas.height === 10, "canvas.height === 10");
+var _thrown = undefined; try {
+ ctx.createPattern(canvas, 'repeat');
+} catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "InvalidStateError" && _thrown.code == DOMException.INVALID_STATE_ERR, "should throw InvalidStateError");
+
+canvas.width = 10;
+canvas.height = 0;
+ok(canvas.width === 10, "canvas.width === 10");
+ok(canvas.height === 0, "canvas.height === 0");
+var _thrown = undefined; try {
+ ctx.createPattern(canvas, 'repeat');
+} catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "InvalidStateError" && _thrown.code == DOMException.INVALID_STATE_ERR, "should throw InvalidStateError");
+
+canvas.width = 0;
+canvas.height = 0;
+ok(canvas.width === 0, "canvas.width === 0");
+ok(canvas.height === 0, "canvas.height === 0");
+var _thrown = undefined; try {
+ ctx.createPattern(canvas, 'repeat');
+} catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "InvalidStateError" && _thrown.code == DOMException.INVALID_STATE_ERR, "should throw InvalidStateError");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.pattern.crosscanvas.html ]]] -->
+
+<p>Canvas test: 2d.pattern.crosscanvas</p>
+<canvas id="c464" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_pattern_crosscanvas() {
+
+var canvas = document.getElementById('c464');
+var ctx = canvas.getContext('2d');
+
+var img = document.getElementById('green_10.png');
+
+var pattern = document.createElement('canvas').getContext('2d').createPattern(img, 'no-repeat');
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = pattern;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+<img src="image_green.png" id="green_10.png" class="resource">
+
+<!-- [[[ test_2d.pattern.image.null.html ]]] -->
+
+<p>Canvas test: 2d.pattern.image.null</p>
+<canvas id="c467" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_pattern_image_null() {
+
+var canvas = document.getElementById('c467');
+var ctx = canvas.getContext('2d');
+
+var _thrown = undefined; try {
+ ctx.createPattern(null, 'repeat');
+} catch (e) { _thrown = e };
+ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
+}
+</script>
+
+<!-- [[[ test_2d.pattern.image.string.html ]]] -->
+
+<p>Canvas test: 2d.pattern.image.string</p>
+<canvas id="c468" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_pattern_image_string() {
+
+var canvas = document.getElementById('c468');
+var ctx = canvas.getContext('2d');
+
+var _thrown = undefined; try {
+ ctx.createPattern('image_red.png', 'repeat');
+} catch (e) { _thrown = e };
+ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
+}
+</script>
+
+<!-- [[[ test_2d.pattern.image.undefined.html ]]] -->
+
+<p>Canvas test: 2d.pattern.image.undefined</p>
+<canvas id="c469" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_pattern_image_undefined() {
+
+var canvas = document.getElementById('c469');
+var ctx = canvas.getContext('2d');
+
+var _thrown = undefined; try {
+ ctx.createPattern(undefined, 'repeat');
+} catch (e) { _thrown = e };
+ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
+}
+</script>
+
+<!-- [[[ test_2d.pattern.modify.canvas1.html ]]] -->
+
+<p>Canvas test: 2d.pattern.modify.canvas1</p>
+<canvas id="c470" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_pattern_modify_canvas1() {
+
+var canvas = document.getElementById('c470');
+var ctx = canvas.getContext('2d');
+
+var canvas2 = document.createElement('canvas');
+canvas2.width = 100;
+canvas2.height = 50;
+var ctx2 = canvas2.getContext('2d');
+ctx2.fillStyle = '#0f0';
+ctx2.fillRect(0, 0, 100, 50);
+
+var pattern = ctx.createPattern(canvas2, 'no-repeat');
+
+ctx2.fillStyle = '#f00';
+ctx2.fillRect(0, 0, 100, 50);
+
+ctx.fillStyle = pattern;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.pattern.modify.canvas2.html ]]] -->
+
+<p>Canvas test: 2d.pattern.modify.canvas2</p>
+<canvas id="c471" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_pattern_modify_canvas2() {
+
+var canvas = document.getElementById('c471');
+var ctx = canvas.getContext('2d');
+
+var canvas2 = document.createElement('canvas');
+canvas2.width = 100;
+canvas2.height = 50;
+var ctx2 = canvas2.getContext('2d');
+ctx2.fillStyle = '#0f0';
+ctx2.fillRect(0, 0, 100, 50);
+
+var pattern = ctx.createPattern(canvas2, 'no-repeat');
+ctx.fillStyle = pattern;
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx2.fillStyle = '#f00';
+ctx2.fillRect(0, 0, 100, 50);
+
+ctx.fillStyle = pattern;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.pattern.modify.image1.html ]]] -->
+
+<p>Canvas test: 2d.pattern.modify.image1</p>
+<canvas id="c472" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+var canvas472 = document.getElementById('c472');
+var ctx472 = canvas472.getContext('2d');
+
+function test_2d_pattern_modify_image1() {
+
+var img = document.getElementById('green_11.png');
+var pattern = ctx472.createPattern(img, 'no-repeat');
+deferTest();
+img.onload = wrapFunction(function ()
+{
+ ctx472.fillStyle = pattern;
+ ctx472.fillRect(0, 0, 100, 50);
+
+ isPixel(ctx472, 1,1, 0,255,0,255, 0);
+ isPixel(ctx472, 98,1, 0,255,0,255, 0);
+ isPixel(ctx472, 1,48, 0,255,0,255, 0);
+ isPixel(ctx472, 98,48, 0,255,0,255, 0);
+});
+img.src = 'image_red.png';
+
+
+}
+</script>
+<img src="image_green.png" id="green_11.png" class="resource">
+
+<!-- [[[ test_2d.pattern.modify.image2.html ]]] -->
+
+<p>Canvas test: 2d.pattern.modify.image2</p>
+<canvas id="c473" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+var canvas473 = document.getElementById('c473');
+var ctx473 = canvas473.getContext('2d');
+
+function test_2d_pattern_modify_image2() {
+
+var img = document.getElementById('green_12.png');
+var pattern = ctx473.createPattern(img, 'no-repeat');
+ctx473.fillStyle = pattern;
+ctx473.fillRect(0, 0, 100, 50);
+ctx473.fillStyle = '#00f';
+ctx473.fillRect(0, 0, 100, 50);
+deferTest();
+img.onload = wrapFunction(function ()
+{
+ ctx473.fillStyle = pattern;
+ ctx473.fillRect(0, 0, 100, 50);
+
+ isPixel(ctx473, 1,1, 0,255,0,255, 0);
+ isPixel(ctx473, 98,1, 0,255,0,255, 0);
+ isPixel(ctx473, 1,48, 0,255,0,255, 0);
+ isPixel(ctx473, 98,48, 0,255,0,255, 0);
+});
+img.src = 'image_red.png';
+
+
+}
+</script>
+<img src="image_green.png" id="green_12.png" class="resource">
+
+<!-- [[[ test_2d.pattern.paint.norepeat.basic.html ]]] -->
+
+<p>Canvas test: 2d.pattern.paint.norepeat.basic</p>
+<canvas id="c474" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_pattern_paint_norepeat_basic() {
+
+var canvas = document.getElementById('c474');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+var img = document.getElementById('green_13.png');
+var pattern = ctx.createPattern(img, 'no-repeat');
+ctx.fillStyle = pattern;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+<img src="image_green.png" id="green_13.png" class="resource">
+
+<!-- [[[ test_2d.pattern.paint.norepeat.coord1.html ]]] -->
+
+<p>Canvas test: 2d.pattern.paint.norepeat.coord1</p>
+<canvas id="c475" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_pattern_paint_norepeat_coord1() {
+
+var canvas = document.getElementById('c475');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 50, 50);
+ctx.fillStyle = '#f00';
+ctx.fillRect(50, 0, 50, 50);
+
+var img = document.getElementById('green_14.png');
+var pattern = ctx.createPattern(img, 'no-repeat');
+ctx.fillStyle = pattern;
+ctx.translate(50, 0);
+ctx.fillRect(-50, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+<img src="image_green.png" id="green_14.png" class="resource">
+
+<!-- [[[ test_2d.pattern.paint.norepeat.coord2.html ]]] -->
+
+<p>Canvas test: 2d.pattern.paint.norepeat.coord2</p>
+<canvas id="c476" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_pattern_paint_norepeat_coord2() {
+
+var canvas = document.getElementById('c476');
+var ctx = canvas.getContext('2d');
+
+var img = document.getElementById('green_15.png');
+var pattern = ctx.createPattern(img, 'no-repeat');
+ctx.fillStyle = pattern;
+ctx.fillRect(0, 0, 50, 50);
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(50, 0, 50, 50);
+
+ctx.fillStyle = pattern;
+ctx.translate(50, 0);
+ctx.fillRect(-50, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+<img src="image_green.png" id="green_15.png" class="resource">
+
+<!-- [[[ test_2d.pattern.paint.norepeat.coord3.html ]]] -->
+
+<p>Canvas test: 2d.pattern.paint.norepeat.coord3</p>
+<canvas id="c477" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_pattern_paint_norepeat_coord3() {
+
+var canvas = document.getElementById('c477');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+var img = document.getElementById('red_15.png');
+var pattern = ctx.createPattern(img, 'no-repeat');
+ctx.fillStyle = pattern;
+ctx.translate(50, 25);
+ctx.fillRect(-50, -25, 100, 50);
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 50, 25);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+<img src="image_red.png" id="red_15.png" class="resource">
+
+<!-- [[[ test_2d.pattern.paint.norepeat.outside.html ]]] -->
+
+<p>Canvas test: 2d.pattern.paint.norepeat.outside</p>
+<canvas id="c478" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_pattern_paint_norepeat_outside() {
+
+var canvas = document.getElementById('c478');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+var img = document.getElementById('red_16.png');
+var pattern = ctx.createPattern(img, 'no-repeat');
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.fillStyle = pattern;
+ctx.fillRect(0, -50, 100, 50);
+ctx.fillRect(-100, 0, 100, 50);
+ctx.fillRect(0, 50, 100, 50);
+ctx.fillRect(100, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+<img src="image_red.png" id="red_16.png" class="resource">
+
+<!-- [[[ test_2d.pattern.paint.orientation.canvas.html ]]] -->
+
+<p>Canvas test: 2d.pattern.paint.orientation.canvas</p>
+<!-- Testing: Canvas patterns do not get flipped when painted -->
+<canvas id="c479" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_pattern_paint_orientation_canvas() {
+
+var canvas = document.getElementById('c479');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+var canvas2 = document.createElement('canvas');
+canvas2.width = 100;
+canvas2.height = 50;
+var ctx2 = canvas2.getContext('2d');
+ctx2.fillStyle = '#f00';
+ctx2.fillRect(0, 0, 100, 25);
+ctx2.fillStyle = '#0f0';
+ctx2.fillRect(0, 25, 100, 25);
+
+var pattern = ctx.createPattern(canvas2, 'no-repeat');
+ctx.fillStyle = pattern;
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 25);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.pattern.paint.orientation.image.html ]]] -->
+
+<p>Canvas test: 2d.pattern.paint.orientation.image</p>
+<!-- Testing: Image patterns do not get flipped when painted -->
+<canvas id="c480" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_pattern_paint_orientation_image() {
+
+var canvas = document.getElementById('c480');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+var img = document.getElementById('rrgg-256x256_1.png');
+var pattern = ctx.createPattern(img, 'no-repeat');
+ctx.fillStyle = pattern;
+ctx.save();
+ctx.translate(0, -103);
+ctx.fillRect(0, 103, 100, 50);
+ctx.restore();
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 25);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+<img src="image_rrgg-256x256.png" id="rrgg-256x256_1.png" class="resource">
+
+<!-- [[[ test_2d.pattern.paint.repeat.basic.html ]]] -->
+
+<p>Canvas test: 2d.pattern.paint.repeat.basic</p>
+<canvas id="c481" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_pattern_paint_repeat_basic() {
+
+var canvas = document.getElementById('c481');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+var img = document.getElementById('green-16x16_1.png');
+var pattern = ctx.createPattern(img, 'repeat');
+ctx.fillStyle = pattern;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+<img src="image_green-16x16.png" id="green-16x16_1.png" class="resource">
+
+<!-- [[[ test_2d.pattern.paint.repeat.coord1.html ]]] -->
+
+<p>Canvas test: 2d.pattern.paint.repeat.coord1</p>
+<canvas id="c482" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_pattern_paint_repeat_coord1() {
+
+var canvas = document.getElementById('c482');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+var img = document.getElementById('rgrg-256x256_3.png');
+var pattern = ctx.createPattern(img, 'repeat');
+ctx.fillStyle = pattern;
+ctx.translate(-128, -78);
+ctx.fillRect(128, 78, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+<img src="image_rgrg-256x256.png" id="rgrg-256x256_3.png" class="resource">
+
+<!-- [[[ test_2d.pattern.paint.repeat.coord2.html ]]] -->
+
+<p>Canvas test: 2d.pattern.paint.repeat.coord2</p>
+<canvas id="c483" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_pattern_paint_repeat_coord2() {
+
+var canvas = document.getElementById('c483');
+var ctx = canvas.getContext('2d');
+
+var img = document.getElementById('ggrr-256x256_3.png');
+var pattern = ctx.createPattern(img, 'repeat');
+ctx.fillStyle = pattern;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+<img src="image_ggrr-256x256.png" id="ggrr-256x256_3.png" class="resource">
+
+<!-- [[[ test_2d.pattern.paint.repeat.coord3.html ]]] -->
+
+<p>Canvas test: 2d.pattern.paint.repeat.coord3</p>
+<canvas id="c484" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_pattern_paint_repeat_coord3() {
+
+var canvas = document.getElementById('c484');
+var ctx = canvas.getContext('2d');
+
+var img = document.getElementById('rgrg-256x256_4.png');
+var pattern = ctx.createPattern(img, 'repeat');
+ctx.fillStyle = pattern;
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.translate(-128, -78);
+ctx.fillRect(128, 78, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+}
+</script>
+<img src="image_rgrg-256x256.png" id="rgrg-256x256_4.png" class="resource">
+
+<!-- [[[ test_2d.pattern.paint.repeat.outside.html ]]] -->
+
+<p>Canvas test: 2d.pattern.paint.repeat.outside</p>
+<canvas id="c485" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_pattern_paint_repeat_outside() {
+
+var canvas = document.getElementById('c485');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+var img = document.getElementById('green-16x16_2.png');
+var pattern = ctx.createPattern(img, 'repeat');
+ctx.fillStyle = pattern;
+ctx.translate(50, 25);
+ctx.fillRect(-50, -25, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+<img src="image_green-16x16.png" id="green-16x16_2.png" class="resource">
+
+<!-- [[[ test_2d.pattern.paint.repeatx.basic.html ]]] -->
+
+<p>Canvas test: 2d.pattern.paint.repeatx.basic</p>
+<canvas id="c486" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_pattern_paint_repeatx_basic() {
+
+var canvas = document.getElementById('c486');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 16);
+
+var img = document.getElementById('green-16x16_3.png');
+var pattern = ctx.createPattern(img, 'repeat-x');
+ctx.fillStyle = pattern;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+<img src="image_green-16x16.png" id="green-16x16_3.png" class="resource">
+
+<!-- [[[ test_2d.pattern.paint.repeatx.coord1.html ]]] -->
+
+<p>Canvas test: 2d.pattern.paint.repeatx.coord1</p>
+<canvas id="c487" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_pattern_paint_repeatx_coord1() {
+
+var canvas = document.getElementById('c487');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+var img = document.getElementById('red-16x16_1.png');
+var pattern = ctx.createPattern(img, 'repeat-x');
+ctx.fillStyle = pattern;
+ctx.translate(0, 16);
+ctx.fillRect(0, -16, 100, 50);
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 16);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+isPixel(ctx, 1,25, 0,255,0,255, 0);
+isPixel(ctx, 98,25, 0,255,0,255, 0);
+}
+</script>
+<img src="image_red-16x16.png" id="red-16x16_1.png" class="resource">
+
+<!-- [[[ test_2d.pattern.paint.repeatx.outside.html ]]] -->
+
+<p>Canvas test: 2d.pattern.paint.repeatx.outside</p>
+<canvas id="c488" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_pattern_paint_repeatx_outside() {
+
+var canvas = document.getElementById('c488');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+var img = document.getElementById('red-16x16_2.png');
+var pattern = ctx.createPattern(img, 'repeat-x');
+ctx.fillStyle = pattern;
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 16);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+}
+</script>
+<img src="image_red-16x16.png" id="red-16x16_2.png" class="resource">
+
+<!-- [[[ test_2d.pattern.paint.repeaty.basic.html ]]] -->
+
+<p>Canvas test: 2d.pattern.paint.repeaty.basic</p>
+<canvas id="c489" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_pattern_paint_repeaty_basic() {
+
+var canvas = document.getElementById('c489');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 16, 50);
+
+var img = document.getElementById('green-16x16_4.png');
+var pattern = ctx.createPattern(img, 'repeat-y');
+ctx.fillStyle = pattern;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+<img src="image_green-16x16.png" id="green-16x16_4.png" class="resource">
+
+<!-- [[[ test_2d.pattern.paint.repeaty.coord1.html ]]] -->
+
+<p>Canvas test: 2d.pattern.paint.repeaty.coord1</p>
+<canvas id="c490" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_pattern_paint_repeaty_coord1() {
+
+var canvas = document.getElementById('c490');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+var img = document.getElementById('red-16x16_3.png');
+var pattern = ctx.createPattern(img, 'repeat-y');
+ctx.fillStyle = pattern;
+ctx.translate(48, 0);
+ctx.fillRect(-48, 0, 100, 50);
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 16, 50);
+
+isPixel(ctx, 50,1, 0,255,0,255, 0);
+isPixel(ctx, 50,48, 0,255,0,255, 0);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+}
+</script>
+<img src="image_red-16x16.png" id="red-16x16_3.png" class="resource">
+
+<!-- [[[ test_2d.pattern.paint.repeaty.outside.html ]]] -->
+
+<p>Canvas test: 2d.pattern.paint.repeaty.outside</p>
+<canvas id="c491" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_pattern_paint_repeaty_outside() {
+
+var canvas = document.getElementById('c491');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+var img = document.getElementById('red-16x16_4.png');
+var pattern = ctx.createPattern(img, 'repeat-y');
+ctx.fillStyle = pattern;
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 16, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+}
+</script>
+<img src="image_red-16x16.png" id="red-16x16_4.png" class="resource">
+
+<!-- [[[ test_2d.pattern.repeat.case.html ]]] -->
+
+<p>Canvas test: 2d.pattern.repeat.case</p>
+<canvas id="c492" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_pattern_repeat_case() {
+
+var canvas = document.getElementById('c492');
+var ctx = canvas.getContext('2d');
+
+var _thrown = undefined; try {
+ ctx.createPattern(canvas, "Repeat");
+} catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "SyntaxError" && _thrown.code == DOMException.SYNTAX_ERR, "should throw SyntaxError");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.pattern.repeat.empty.html ]]] -->
+
+<p>Canvas test: 2d.pattern.repeat.empty</p>
+<canvas id="c493" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_pattern_repeat_empty() {
+
+var canvas = document.getElementById('c493');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+var img = document.getElementById('green-1x1_1.png');
+var pattern = ctx.createPattern(img, "");
+ctx.fillStyle = pattern;
+ctx.fillRect(0, 0, 200, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+<img src="image_green-1x1.png" id="green-1x1_1.png" class="resource">
+
+<!-- [[[ test_2d.pattern.repeat.null.html ]]] -->
+
+<p>Canvas test: 2d.pattern.repeat.null</p>
+<canvas id="c494" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_pattern_repeat_null() {
+
+var canvas = document.getElementById('c494');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+var img = document.getElementById('green-1x1_2.png');
+var pattern = ctx.createPattern(img, null);
+ctx.fillStyle = pattern;
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+<img src="image_green-1x1.png" id="green-1x1_2.png" class="resource">
+
+<!-- [[[ test_2d.pattern.repeat.nullsuffix.html ]]] -->
+
+<p>Canvas test: 2d.pattern.repeat.nullsuffix</p>
+<canvas id="c495" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_pattern_repeat_nullsuffix() {
+
+var canvas = document.getElementById('c495');
+var ctx = canvas.getContext('2d');
+
+var _thrown = undefined; try {
+ ctx.createPattern(canvas, "repeat\0");
+} catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "SyntaxError" && _thrown.code == DOMException.SYNTAX_ERR, "should throw SyntaxError");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.pattern.repeat.undefined.html ]]] -->
+
+<p>Canvas test: 2d.pattern.repeat.undefined</p>
+<canvas id="c496" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_pattern_repeat_undefined() {
+
+var canvas = document.getElementById('c496');
+var ctx = canvas.getContext('2d');
+
+var _thrown = undefined; try {
+ ctx.createPattern(canvas, undefined);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "SyntaxError" && _thrown.code == DOMException.SYNTAX_ERR, "should throw SyntaxError");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.pattern.repeat.unrecognised.html ]]] -->
+
+<p>Canvas test: 2d.pattern.repeat.unrecognised</p>
+<canvas id="c497" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_pattern_repeat_unrecognised() {
+
+var canvas = document.getElementById('c497');
+var ctx = canvas.getContext('2d');
+
+var _thrown = undefined; try {
+ ctx.createPattern(canvas, "invalid");
+} catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "SyntaxError" && _thrown.code == DOMException.SYNTAX_ERR, "should throw SyntaxError");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.scaled.html ]]] -->
+
+<p>Canvas test: 2d.scaled</p>
+<!-- Testing: CSS-scaled canvases get drawn correctly -->
+<canvas id="c498" width="50" height="25" style="width: 100px; height: 50px"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_scaled() {
+
+var canvas = document.getElementById('c498');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#00f';
+ctx.fillRect(0, 0, 50, 25);
+ctx.fillStyle = '#0ff';
+ctx.fillRect(0, 0, 25, 10);
+
+todo(false, "test completed successfully"); // (Bug 483989)
+
+}
+
+</script>
+<!-- [[[ test_2d.shadow.alpha.1.html ]]] -->
+
+<p>Canvas test: 2d.shadow.alpha.1</p>
+<canvas id="c499" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_shadow_alpha_1() {
+
+var canvas = document.getElementById('c499');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.shadowColor = 'rgba(255, 0, 0, 0.01)';
+ctx.shadowOffsetY = 50;
+ctx.fillRect(0, -50, 100, 50);
+
+isPixel(ctx, 50,25, 0,255,0,255, 4);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.alpha.2.html ]]] -->
+
+<p>Canvas test: 2d.shadow.alpha.2</p>
+<canvas id="c500" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_alpha_2() {
+
+var canvas = document.getElementById('c500');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.shadowColor = 'rgba(0, 0, 255, 0.5)';
+ctx.shadowOffsetY = 50;
+ctx.fillRect(0, -50, 100, 50);
+
+isPixel(ctx, 50,25, 127,0,127,255, 2);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.alpha.3.html ]]] -->
+
+<p>Canvas test: 2d.shadow.alpha.3</p>
+<canvas id="c501" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_alpha_3() {
+
+var canvas = document.getElementById('c501');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#f00'; // (work around broken Firefox globalAlpha caching)
+ctx.shadowColor = '#00f';
+ctx.shadowOffsetY = 50;
+ctx.globalAlpha = 0.5;
+ctx.fillRect(0, -50, 100, 50);
+
+isPixel(ctx, 50,25, 127,0,127,255, 2);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.alpha.4.html ]]] -->
+
+<p>Canvas test: 2d.shadow.alpha.4</p>
+<canvas id="c502" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_alpha_4() {
+
+var canvas = document.getElementById('c502');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#f00'; // (work around broken Firefox globalAlpha caching)
+ctx.shadowColor = 'rgba(0, 0, 255, 0.707)';
+ctx.shadowOffsetY = 50;
+ctx.globalAlpha = 0.707;
+ctx.fillRect(0, -50, 100, 50);
+
+isPixel(ctx, 50,25, 127,0,127,255, 2);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.alpha.5.html ]]] -->
+
+<p>Canvas test: 2d.shadow.alpha.5</p>
+<canvas id="c503" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_alpha_5() {
+
+var canvas = document.getElementById('c503');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = 'rgba(64, 0, 0, 0.5)';
+ctx.shadowColor = '#00f';
+ctx.shadowOffsetY = 50;
+ctx.fillRect(0, -50, 100, 50);
+
+isPixel(ctx, 50,25, 127,0,127,255, 2);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.attributes.shadowBlur.1.html ]]] -->
+
+<p>Canvas test: 2d.shadow.attributes.shadowBlur.1</p>
+<canvas id="c504" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_shadow_attributes_shadowBlur_1() {
+
+var canvas = document.getElementById('c504');
+var ctx = canvas.getContext('2d');
+
+ctx.shadowBlur = 1;
+ok(ctx.shadowBlur === 1, "ctx.shadowBlur === 1");
+ctx.shadowBlur = 0.5;
+ok(ctx.shadowBlur === 0.5, "ctx.shadowBlur === 0.5");
+ctx.shadowBlur = 1e6;
+ok(ctx.shadowBlur === 1e6, "ctx.shadowBlur === 1e6");
+ctx.shadowBlur = 1;
+ctx.shadowBlur = -2;
+ok(ctx.shadowBlur === 1, "ctx.shadowBlur === 1");
+ctx.shadowBlur = 0;
+ok(ctx.shadowBlur === 0, "ctx.shadowBlur === 0");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.attributes.shadowBlur.2.html ]]] -->
+
+<p>Canvas test: 2d.shadow.attributes.shadowBlur.2</p>
+<canvas id="c505" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_shadow_attributes_shadowBlur_2() {
+
+var canvas = document.getElementById('c505');
+var ctx = canvas.getContext('2d');
+
+ctx.shadowBlur = 1;
+ctx.shadowBlur = -2;
+ok(ctx.shadowBlur === 1, "ctx.shadowBlur === 1");
+
+ctx.shadowBlur = 1;
+ctx.shadowBlur = Infinity;
+ok(ctx.shadowBlur === 1, "ctx.shadowBlur === 1");
+
+ctx.shadowBlur = 1;
+ctx.shadowBlur = -Infinity;
+ok(ctx.shadowBlur === 1, "ctx.shadowBlur === 1");
+
+ctx.shadowBlur = 1;
+ctx.shadowBlur = NaN;
+ok(ctx.shadowBlur === 1, "ctx.shadowBlur === 1");
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.attributes.shadowColor.1.html ]]] -->
+
+<p>Canvas test: 2d.shadow.attributes.shadowColor.1</p>
+<canvas id="c506" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_shadow_attributes_shadowColor_1() {
+
+var canvas = document.getElementById('c506');
+var ctx = canvas.getContext('2d');
+
+ctx.shadowColor = 'lime';
+ok(ctx.shadowColor === '#00ff00', "ctx.shadowColor === '#00ff00'");
+ctx.shadowColor = 'RGBA(0,255, 0,0)';
+is(ctx.shadowColor, 'rgba(0, 255, 0, 0)', "ctx.shadowColor should be what we set it to");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.attributes.shadowColor.2.html ]]] -->
+
+<p>Canvas test: 2d.shadow.attributes.shadowColor.2</p>
+<canvas id="c507" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_shadow_attributes_shadowColor_2() {
+
+var canvas = document.getElementById('c507');
+var ctx = canvas.getContext('2d');
+
+ctx.shadowColor = '#00ff00';
+ctx.shadowColor = 'bogus';
+ok(ctx.shadowColor === '#00ff00', "ctx.shadowColor === '#00ff00'");
+ctx.shadowColor = ctx;
+ok(ctx.shadowColor === '#00ff00', "ctx.shadowColor === '#00ff00'");
+ctx.shadowColor = undefined;
+ok(ctx.shadowColor === '#00ff00', "ctx.shadowColor === '#00ff00'");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.attributes.shadowOffset.1.html ]]] -->
+
+<p>Canvas test: 2d.shadow.attributes.shadowOffset.1</p>
+<canvas id="c508" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_shadow_attributes_shadowOffset_1() {
+
+var canvas = document.getElementById('c508');
+var ctx = canvas.getContext('2d');
+
+ctx.shadowOffsetX = 1;
+ctx.shadowOffsetY = 2;
+ok(ctx.shadowOffsetX === 1, "ctx.shadowOffsetX === 1");
+ok(ctx.shadowOffsetY === 2, "ctx.shadowOffsetY === 2");
+ctx.shadowOffsetX = 0.5;
+ctx.shadowOffsetY = 0.25;
+ok(ctx.shadowOffsetX === 0.5, "ctx.shadowOffsetX === 0.5");
+ok(ctx.shadowOffsetY === 0.25, "ctx.shadowOffsetY === 0.25");
+ctx.shadowOffsetX = -0.5;
+ctx.shadowOffsetY = -0.25;
+ok(ctx.shadowOffsetX === -0.5, "ctx.shadowOffsetX === -0.5");
+ok(ctx.shadowOffsetY === -0.25, "ctx.shadowOffsetY === -0.25");
+ctx.shadowOffsetX = 1e6;
+ctx.shadowOffsetY = 1e6;
+ok(ctx.shadowOffsetX === 1e6, "ctx.shadowOffsetX === 1e6");
+ok(ctx.shadowOffsetY === 1e6, "ctx.shadowOffsetY === 1e6");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.attributes.shadowOffset.2.html ]]] -->
+
+<p>Canvas test: 2d.shadow.attributes.shadowOffset.2</p>
+<canvas id="c509" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_shadow_attributes_shadowOffset_2() {
+
+var canvas = document.getElementById('c509');
+var ctx = canvas.getContext('2d');
+
+ctx.shadowOffsetX = 1;
+ctx.shadowOffsetY = 2;
+ctx.shadowOffsetX = Infinity;
+ctx.shadowOffsetY = Infinity;
+ok(ctx.shadowOffsetX === 1, "ctx.shadowOffsetX === 1");
+ok(ctx.shadowOffsetY === 2, "ctx.shadowOffsetY === 2");
+
+ctx.shadowOffsetX = 1;
+ctx.shadowOffsetY = 2;
+ctx.shadowOffsetX = -Infinity;
+ctx.shadowOffsetY = -Infinity;
+ok(ctx.shadowOffsetX === 1, "ctx.shadowOffsetX === 1");
+ok(ctx.shadowOffsetY === 2, "ctx.shadowOffsetY === 2");
+
+ctx.shadowOffsetX = 1;
+ctx.shadowOffsetY = 2;
+ctx.shadowOffsetX = NaN;
+ctx.shadowOffsetY = NaN;
+ok(ctx.shadowOffsetX === 1, "ctx.shadowOffsetX === 1");
+ok(ctx.shadowOffsetY === 2, "ctx.shadowOffsetY === 2");
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.basic.1.html ]]] -->
+
+<p>Canvas test: 2d.shadow.basic.1</p>
+<canvas id="c510" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_shadow_basic_1() {
+
+var canvas = document.getElementById('c510');
+var ctx = canvas.getContext('2d');
+
+ctx.shadowColor = '#f00';
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.basic.2.html ]]] -->
+
+<p>Canvas test: 2d.shadow.basic.2</p>
+<canvas id="c511" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_shadow_basic_2() {
+
+var canvas = document.getElementById('c511');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#f00';
+ctx.shadowColor = '#f00';
+ctx.fillRect(0, -50, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.blur.high.html ]]] -->
+
+<p>Canvas test: 2d.shadow.blur.high</p>
+<canvas id="c512" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_shadow_blur_high() {
+
+var canvas = document.getElementById('c512');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#ff0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.shadowColor = '#00f';
+ctx.shadowOffsetY = 0;
+ctx.shadowBlur = 555.6;
+ctx.fillRect(-200, -200, 200, 400);
+
+todo(false, "test completed successfully"); // (Bug 483989)
+
+}
+
+</script>
+<!-- [[[ test_2d.shadow.blur.low.html ]]] -->
+
+<p>Canvas test: 2d.shadow.blur.low</p>
+<canvas id="c513" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_shadow_blur_low() {
+
+var canvas = document.getElementById('c513');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#ff0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.shadowColor = '#00f';
+ctx.shadowOffsetY = 25;
+for (var x = 0; x < 100; ++x) {
+ ctx.save();
+ ctx.beginPath();
+ ctx.rect(x, 0, 1, 50);
+ ctx.clip();
+ ctx.shadowBlur = x;
+ ctx.fillRect(-200, -200, 500, 200);
+ ctx.restore();
+}
+
+todo(false, "test completed successfully"); // (Bug 483989)
+
+}
+</script>
+<!-- [[[ test_2d.shadow.canvas.alpha.html ]]] -->
+
+<p>Canvas test: 2d.shadow.canvas.alpha</p>
+<canvas id="c514" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_canvas_alpha() {
+
+var canvas = document.getElementById('c514');
+var ctx = canvas.getContext('2d');
+
+var canvas2 = document.createElement('canvas');
+canvas2.width = 100;
+canvas2.height = 50;
+var ctx2 = canvas2.getContext('2d');
+ctx2.fillStyle = 'rgba(255, 0, 0, 0.5)';
+ctx2.fillRect(0, 0, 100, 50);
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.shadowOffsetY = 50;
+ctx.shadowColor = '#00f';
+ctx.drawImage(canvas2, 0, -50);
+
+isPixel(ctx, 50,25, 127,0,127,255, 2);
+
+
+}
+</script>
+<img src="image_transparent50.png" id="transparent50_1.png" class="resource">
+
+<!-- [[[ test_2d.shadow.canvas.basic.html ]]] -->
+
+<p>Canvas test: 2d.shadow.canvas.basic</p>
+<canvas id="c515" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_canvas_basic() {
+
+var canvas = document.getElementById('c515');
+var ctx = canvas.getContext('2d');
+
+var canvas2 = document.createElement('canvas');
+canvas2.width = 100;
+canvas2.height = 50;
+var ctx2 = canvas2.getContext('2d');
+ctx2.fillStyle = '#f00';
+ctx2.fillRect(0, 0, 100, 50);
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.shadowColor = '#0f0';
+ctx.shadowOffsetY = 50;
+ctx.drawImage(canvas2, 0, -50);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.canvas.transparent.1.html ]]] -->
+
+<p>Canvas test: 2d.shadow.canvas.transparent.1</p>
+<canvas id="c516" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_shadow_canvas_transparent_1() {
+
+var canvas = document.getElementById('c516');
+var ctx = canvas.getContext('2d');
+
+var canvas2 = document.createElement('canvas');
+canvas2.width = 100;
+canvas2.height = 50;
+var ctx2 = canvas2.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.shadowColor = '#f00';
+ctx.shadowOffsetY = 50;
+ctx.drawImage(canvas2, 0, -50);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.canvas.transparent.2.html ]]] -->
+
+<p>Canvas test: 2d.shadow.canvas.transparent.2</p>
+<canvas id="c517" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_canvas_transparent_2() {
+
+var canvas = document.getElementById('c517');
+var ctx = canvas.getContext('2d');
+
+var canvas2 = document.createElement('canvas');
+canvas2.width = 100;
+canvas2.height = 50;
+var ctx2 = canvas2.getContext('2d');
+ctx2.fillStyle = '#f00';
+ctx2.fillRect(0, 0, 50, 50);
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 50, 50);
+ctx.fillStyle = '#f00';
+ctx.fillRect(50, 0, 50, 50);
+ctx.shadowOffsetY = 50;
+ctx.shadowColor = '#0f0';
+ctx.drawImage(canvas2, 50, -50);
+ctx.shadowColor = '#f00';
+ctx.drawImage(canvas2, -50, -50);
+
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.clip.1.html ]]] -->
+
+<p>Canvas test: 2d.shadow.clip.1</p>
+<canvas id="c518" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_clip_1() {
+
+var canvas = document.getElementById('c518');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 50, 50);
+ctx.fillStyle = '#f00';
+ctx.fillRect(50, 0, 50, 50);
+
+ctx.save();
+ctx.beginPath();
+ctx.rect(50, 0, 50, 50);
+ctx.clip();
+ctx.shadowColor = '#0f0';
+ctx.shadowOffsetX = 50;
+ctx.fillRect(0, 0, 50, 50);
+ctx.restore();
+
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.clip.2.html ]]] -->
+
+<p>Canvas test: 2d.shadow.clip.2</p>
+<canvas id="c519" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_shadow_clip_2() {
+
+var canvas = document.getElementById('c519');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 50, 50);
+ctx.fillStyle = '#0f0';
+ctx.fillRect(50, 0, 50, 50);
+
+ctx.save();
+ctx.beginPath();
+ctx.rect(0, 0, 50, 50);
+ctx.clip();
+ctx.shadowColor = '#f00';
+ctx.shadowOffsetX = 50;
+ctx.fillRect(0, 0, 50, 50);
+ctx.restore();
+
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.clip.3.html ]]] -->
+
+<p>Canvas test: 2d.shadow.clip.3</p>
+<canvas id="c520" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_clip_3() {
+
+var canvas = document.getElementById('c520');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 50, 50);
+ctx.fillStyle = '#0f0';
+ctx.fillRect(50, 0, 50, 50);
+
+ctx.save();
+ctx.beginPath();
+ctx.rect(0, 0, 50, 50);
+ctx.clip();
+ctx.fillStyle = '#f00';
+ctx.shadowColor = '#0f0';
+ctx.shadowOffsetX = 50;
+ctx.fillRect(-50, 0, 50, 50);
+ctx.restore();
+
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.composite.1.html ]]] -->
+
+<p>Canvas test: 2d.shadow.composite.1</p>
+<canvas id="c521" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_composite_1() {
+
+var canvas = document.getElementById('c521');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'xor';
+ctx.shadowColor = '#f00';
+ctx.shadowOffsetX = 100;
+ctx.fillStyle = '#0f0';
+ctx.fillRect(-100, 0, 200, 50);
+
+isPixel(ctx, 50, 25, 0, 255, 0, 255, 2);
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.composite.2.html ]]] -->
+
+<p>Canvas test: 2d.shadow.composite.2</p>
+<canvas id="c522" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_composite_2() {
+
+var canvas = document.getElementById('c522');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'xor';
+ctx.shadowColor = '#f00';
+ctx.shadowBlur = 1;
+ctx.fillStyle = '#0f0';
+ctx.fillRect(-10, -10, 120, 70);
+
+isPixel(ctx, 50, 25, 0, 255, 0, 255, 2);
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.composite.3.html ]]] -->
+
+<p>Canvas test: 2d.shadow.composite.3</p>
+<canvas id="c523" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_composite_3() {
+
+var canvas = document.getElementById('c523');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'xor';
+ctx.shadowColor = '#f00';
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 50,25, 0,255,0,255, 2);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.composite.4.html ]]] -->
+
+<p>Canvas test: 2d.shadow.composite.4</p>
+<canvas id="c524" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_composite_4() {
+
+var canvas = document.getElementById('c524');
+var ctx = canvas.getContext('2d');
+
+ctx.globalCompositeOperation = 'destination-over';
+ctx.shadowColor = '#0f0';
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+isPixel(ctx, 50,25, 0,255,0,255, 2);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.gradient.alpha.html ]]] -->
+
+<p>Canvas test: 2d.shadow.gradient.alpha</p>
+<canvas id="c525" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_gradient_alpha() {
+
+var canvas = document.getElementById('c525');
+var ctx = canvas.getContext('2d');
+
+var gradient = ctx.createLinearGradient(0, 0, 100, 0);
+gradient.addColorStop(0, 'rgba(255,0,0,0.5)');
+gradient.addColorStop(1, 'rgba(255,0,0,0.5)');
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.shadowOffsetY = 50;
+ctx.shadowColor = '#00f';
+ctx.fillStyle = gradient;
+ctx.fillRect(0, -50, 100, 50);
+
+isPixel(ctx, 50,25, 127,0,127,255, 2);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.gradient.basic.html ]]] -->
+
+<p>Canvas test: 2d.shadow.gradient.basic</p>
+<canvas id="c526" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_gradient_basic() {
+
+var canvas = document.getElementById('c526');
+var ctx = canvas.getContext('2d');
+
+var gradient = ctx.createLinearGradient(0, 0, 100, 0);
+gradient.addColorStop(0, '#f00');
+gradient.addColorStop(1, '#f00');
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.shadowColor = '#0f0';
+ctx.shadowOffsetY = 50;
+ctx.fillStyle = gradient;
+ctx.fillRect(0, -50, 100, 50);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.gradient.transparent.1.html ]]] -->
+
+<p>Canvas test: 2d.shadow.gradient.transparent.1</p>
+<canvas id="c527" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_shadow_gradient_transparent_1() {
+
+var canvas = document.getElementById('c527');
+var ctx = canvas.getContext('2d');
+
+var gradient = ctx.createLinearGradient(0, 0, 100, 0);
+gradient.addColorStop(0, 'rgba(0,0,0,0)');
+gradient.addColorStop(1, 'rgba(0,0,0,0)');
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.shadowColor = '#f00';
+ctx.shadowOffsetY = 50;
+ctx.fillStyle = gradient;
+ctx.fillRect(0, -50, 100, 50);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.gradient.transparent.2.html ]]] -->
+
+<p>Canvas test: 2d.shadow.gradient.transparent.2</p>
+<canvas id="c528" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_gradient_transparent_2() {
+
+var canvas = document.getElementById('c528');
+var ctx = canvas.getContext('2d');
+
+var gradient = ctx.createLinearGradient(0, 0, 100, 0);
+gradient.addColorStop(0, '#f00');
+gradient.addColorStop(0.499, '#f00');
+gradient.addColorStop(0.5, 'rgba(0,0,0,0)');
+gradient.addColorStop(1, 'rgba(0,0,0,0)');
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 50, 50);
+ctx.fillStyle = '#0f0';
+ctx.fillRect(50, 0, 50, 50);
+ctx.shadowOffsetY = 50;
+ctx.shadowColor = '#0f0';
+ctx.fillStyle = gradient;
+ctx.fillRect(0, -50, 100, 50);
+
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.image.alpha.html ]]] -->
+
+<p>Canvas test: 2d.shadow.image.alpha</p>
+<canvas id="c529" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_image_alpha() {
+
+var canvas = document.getElementById('c529');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.shadowOffsetY = 50;
+ctx.shadowColor = '#00f';
+ctx.drawImage(document.getElementById('transparent50_2.png'), 0, -50);
+
+isPixel(ctx, 50,25, 127,0,127,255, 2);
+
+
+}
+</script>
+<img src="image_transparent50.png" id="transparent50_2.png" class="resource">
+
+<!-- [[[ test_2d.shadow.image.basic.html ]]] -->
+
+<p>Canvas test: 2d.shadow.image.basic</p>
+<canvas id="c530" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_image_basic() {
+
+var canvas = document.getElementById('c530');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.shadowColor = '#0f0';
+ctx.shadowOffsetY = 50;
+ctx.drawImage(document.getElementById('red_17.png'), 0, -50);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+<img src="image_red.png" id="red_17.png" class="resource">
+
+<!-- [[[ test_2d.shadow.image.scale.html ]]] -->
+
+<p>Canvas test: 2d.shadow.image.scale</p>
+<canvas id="c531" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_image_scale() {
+
+var canvas = document.getElementById('c531');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.shadowOffsetY = 50;
+ctx.shadowColor = '#0f0';
+ctx.drawImage(document.getElementById('redtransparent_2.png'), 0, 0, 100, 50, -10, -50, 240, 50);
+
+isPixel(ctx, 25,25, 0,255,0,255, 2);
+isPixel(ctx, 50,25, 0,255,0,255, 2);
+isPixel(ctx, 75,25, 0,255,0,255, 2);
+
+
+}
+</script>
+<img src="image_redtransparent.png" id="redtransparent_2.png" class="resource">
+
+<!-- [[[ test_2d.shadow.image.section.html ]]] -->
+
+<p>Canvas test: 2d.shadow.image.section</p>
+<canvas id="c532" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_shadow_image_section() {
+
+var canvas = document.getElementById('c532');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.shadowOffsetY = 50;
+ctx.shadowColor = '#f00';
+ctx.drawImage(document.getElementById('redtransparent_3.png'), 50, 0, 50, 50, 0, -50, 50, 50);
+
+isPixel(ctx, 25,25, 0,255,0,255, 2);
+isPixel(ctx, 50,25, 0,255,0,255, 2);
+isPixel(ctx, 75,25, 0,255,0,255, 2);
+
+
+}
+</script>
+<img src="image_redtransparent.png" id="redtransparent_3.png" class="resource">
+
+<!-- [[[ test_2d.shadow.image.transparent.1.html ]]] -->
+
+<p>Canvas test: 2d.shadow.image.transparent.1</p>
+<canvas id="c533" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_shadow_image_transparent_1() {
+
+var canvas = document.getElementById('c533');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.shadowColor = '#f00';
+ctx.shadowOffsetY = 50;
+ctx.drawImage(document.getElementById('transparent_1.png'), 0, -50);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+<img src="image_transparent.png" id="transparent_1.png" class="resource">
+
+<!-- [[[ test_2d.shadow.image.transparent.2.html ]]] -->
+
+<p>Canvas test: 2d.shadow.image.transparent.2</p>
+<canvas id="c534" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_image_transparent_2() {
+
+var canvas = document.getElementById('c534');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 50, 50);
+ctx.fillStyle = '#f00';
+ctx.fillRect(50, 0, 50, 50);
+ctx.shadowOffsetY = 50;
+ctx.shadowColor = '#0f0';
+ctx.drawImage(document.getElementById('redtransparent_4.png'), 50, -50);
+ctx.shadowColor = '#f00';
+ctx.drawImage(document.getElementById('redtransparent_4.png'), -50, -50);
+
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+
+
+}
+</script>
+<img src="image_redtransparent.png" id="redtransparent_4.png" class="resource">
+
+<!-- [[[ test_2d.shadow.offset.negativeX.html ]]] -->
+
+<p>Canvas test: 2d.shadow.offset.negativeX</p>
+<canvas id="c535" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_offset_negativeX() {
+
+var canvas = document.getElementById('c535');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#0f0';
+ctx.shadowColor = '#0f0';
+ctx.shadowOffsetX = -50;
+ctx.fillRect(50, 0, 50, 50);
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.offset.negativeY.html ]]] -->
+
+<p>Canvas test: 2d.shadow.offset.negativeY</p>
+<canvas id="c536" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_offset_negativeY() {
+
+var canvas = document.getElementById('c536');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#0f0';
+ctx.shadowColor = '#0f0';
+ctx.shadowOffsetY = -25;
+ctx.fillRect(0, 25, 100, 25);
+isPixel(ctx, 50,12, 0,255,0,255, 0);
+isPixel(ctx, 50,37, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.offset.positiveX.html ]]] -->
+
+<p>Canvas test: 2d.shadow.offset.positiveX</p>
+<canvas id="c537" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_offset_positiveX() {
+
+var canvas = document.getElementById('c537');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#0f0';
+ctx.shadowColor = '#0f0';
+ctx.shadowOffsetX = 50;
+ctx.fillRect(0, 0, 50, 50);
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.offset.positiveY.html ]]] -->
+
+<p>Canvas test: 2d.shadow.offset.positiveY</p>
+<canvas id="c538" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_offset_positiveY() {
+
+var canvas = document.getElementById('c538');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#0f0';
+ctx.shadowColor = '#0f0';
+ctx.shadowOffsetY = 25;
+ctx.fillRect(0, 0, 100, 25);
+isPixel(ctx, 50,12, 0,255,0,255, 0);
+isPixel(ctx, 50,37, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.outside.html ]]] -->
+
+<p>Canvas test: 2d.shadow.outside</p>
+<canvas id="c539" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_outside() {
+
+var canvas = document.getElementById('c539');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.shadowColor = '#0f0';
+ctx.shadowOffsetX = 100;
+ctx.fillRect(-100, 0, 25, 50);
+ctx.shadowOffsetX = -100;
+ctx.fillRect(175, 0, 25, 50);
+ctx.shadowOffsetX = 0;
+ctx.shadowOffsetY = 100;
+ctx.fillRect(25, -100, 50, 25);
+ctx.shadowOffsetY = -100;
+ctx.fillRect(25, 125, 50, 25);
+isPixel(ctx, 12,25, 0,255,0,255, 0);
+isPixel(ctx, 87,25, 0,255,0,255, 0);
+isPixel(ctx, 50,12, 0,255,0,255, 0);
+isPixel(ctx, 50,37, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.pattern.alpha.html ]]] -->
+
+<p>Canvas test: 2d.shadow.pattern.alpha</p>
+<canvas id="c540" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_pattern_alpha() {
+
+var canvas = document.getElementById('c540');
+var ctx = canvas.getContext('2d');
+
+var pattern = ctx.createPattern(document.getElementById('transparent50_3.png'), 'repeat');
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.shadowOffsetY = 50;
+ctx.shadowColor = '#00f';
+ctx.fillStyle = pattern;
+ctx.fillRect(0, -50, 100, 50);
+
+isPixel(ctx, 50,25, 127,0,127,255, 2);
+
+
+}
+</script>
+<img src="image_transparent50.png" id="transparent50_3.png" class="resource">
+
+<!-- [[[ test_2d.shadow.pattern.basic.html ]]] -->
+
+<p>Canvas test: 2d.shadow.pattern.basic</p>
+<canvas id="c541" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_pattern_basic() {
+
+var canvas = document.getElementById('c541');
+var ctx = canvas.getContext('2d');
+
+var pattern = ctx.createPattern(document.getElementById('red_18.png'), 'repeat');
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.shadowColor = '#0f0';
+ctx.shadowOffsetY = 50;
+ctx.fillStyle = pattern;
+ctx.fillRect(0, -50, 100, 50);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+<img src="image_red.png" id="red_18.png" class="resource">
+
+<!-- [[[ test_2d.shadow.pattern.transparent.1.html ]]] -->
+
+<p>Canvas test: 2d.shadow.pattern.transparent.1</p>
+<canvas id="c542" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_shadow_pattern_transparent_1() {
+
+var canvas = document.getElementById('c542');
+var ctx = canvas.getContext('2d');
+
+var pattern = ctx.createPattern(document.getElementById('transparent_2.png'), 'repeat');
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.shadowColor = '#f00';
+ctx.shadowOffsetY = 50;
+ctx.fillStyle = pattern;
+ctx.fillRect(0, -50, 100, 50);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+<img src="image_transparent.png" id="transparent_2.png" class="resource">
+
+<!-- [[[ test_2d.shadow.pattern.transparent.2.html ]]] -->
+
+<p>Canvas test: 2d.shadow.pattern.transparent.2</p>
+<canvas id="c543" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_pattern_transparent_2() {
+
+var canvas = document.getElementById('c543');
+var ctx = canvas.getContext('2d');
+
+var pattern = ctx.createPattern(document.getElementById('redtransparent_5.png'), 'repeat');
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 50, 50);
+ctx.fillStyle = '#0f0';
+ctx.fillRect(50, 0, 50, 50);
+ctx.shadowOffsetY = 50;
+ctx.shadowColor = '#0f0';
+ctx.fillStyle = pattern;
+ctx.fillRect(0, -50, 100, 50);
+
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+
+
+}
+</script>
+<img src="image_redtransparent.png" id="redtransparent_5.png" class="resource">
+
+<!-- [[[ test_2d.shadow.stroke.basic.html ]]] -->
+
+<p>Canvas test: 2d.shadow.stroke.basic</p>
+<canvas id="c544" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_stroke_basic() {
+
+var canvas = document.getElementById('c544');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.strokeStyle = '#f00';
+ctx.shadowColor = '#0f0';
+ctx.shadowOffsetY = 50;
+ctx.beginPath();
+ctx.lineWidth = 50;
+ctx.moveTo(0, -25);
+ctx.lineTo(100, -25);
+ctx.stroke();
+
+isPixel(ctx, 1,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.stroke.cap.1.html ]]] -->
+
+<p>Canvas test: 2d.shadow.stroke.cap.1</p>
+<canvas id="c545" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_shadow_stroke_cap_1() {
+
+var canvas = document.getElementById('c545');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.strokeStyle = '#f00';
+ctx.shadowColor = '#f00';
+ctx.shadowOffsetY = 50;
+ctx.beginPath();
+ctx.lineWidth = 50;
+ctx.lineCap = 'butt';
+ctx.moveTo(-50, -25);
+ctx.lineTo(0, -25);
+ctx.moveTo(100, -25);
+ctx.lineTo(150, -25);
+ctx.stroke();
+
+isPixel(ctx, 1,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.stroke.cap.2.html ]]] -->
+
+<p>Canvas test: 2d.shadow.stroke.cap.2</p>
+<canvas id="c546" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_stroke_cap_2() {
+
+var canvas = document.getElementById('c546');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.strokeStyle = '#f00';
+ctx.shadowColor = '#0f0';
+ctx.shadowOffsetY = 50;
+ctx.beginPath();
+ctx.lineWidth = 50;
+ctx.lineCap = 'square';
+ctx.moveTo(25, -25);
+ctx.lineTo(75, -25);
+ctx.stroke();
+
+isPixel(ctx, 1,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.stroke.join.1.html ]]] -->
+
+<p>Canvas test: 2d.shadow.stroke.join.1</p>
+<canvas id="c547" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_shadow_stroke_join_1() {
+
+var canvas = document.getElementById('c547');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.strokeStyle = '#f00';
+ctx.shadowColor = '#f00';
+ctx.shadowOffsetX = 100;
+ctx.lineWidth = 200;
+ctx.lineJoin = 'bevel';
+ctx.beginPath();
+ctx.moveTo(-200, -50);
+ctx.lineTo(-150, -50);
+ctx.lineTo(-151, -100);
+ctx.stroke();
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 48,48, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.stroke.join.2.html ]]] -->
+
+<p>Canvas test: 2d.shadow.stroke.join.2</p>
+<canvas id="c548" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_stroke_join_2() {
+
+var canvas = document.getElementById('c548');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 50, 50);
+ctx.fillStyle = '#0f0';
+ctx.fillRect(50, 0, 50, 50);
+ctx.strokeStyle = '#f00';
+ctx.shadowColor = '#0f0';
+ctx.shadowOffsetX = 100;
+ctx.lineWidth = 200;
+ctx.lineJoin = 'miter';
+ctx.beginPath();
+ctx.moveTo(-200, -50);
+ctx.lineTo(-150, -50);
+ctx.lineTo(-151, -100);
+ctx.stroke();
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 48,48, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.stroke.join.3.html ]]] -->
+
+<p>Canvas test: 2d.shadow.stroke.join.3</p>
+<canvas id="c549" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_shadow_stroke_join_3() {
+
+var canvas = document.getElementById('c549');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.strokeStyle = '#f00';
+ctx.shadowColor = '#f00';
+ctx.shadowOffsetX = 100;
+ctx.lineWidth = 200;
+ctx.lineJoin = 'miter';
+ctx.miterLimit = 0.1;
+ctx.beginPath();
+ctx.moveTo(-200, -50);
+ctx.lineTo(-150, -50);
+ctx.lineTo(-151, -100); // (not an exact right angle, to avoid some other bug in Firefox 3)
+ctx.stroke();
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 48,48, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.transform.1.html ]]] -->
+
+<p>Canvas test: 2d.shadow.transform.1</p>
+<canvas id="c550" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_transform_1() {
+
+var canvas = document.getElementById('c550');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.shadowOffsetY = 50;
+ctx.shadowColor = '#0f0';
+ctx.translate(100, 100);
+ctx.fillRect(-100, -150, 100, 50);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.shadow.transform.2.html ]]] -->
+
+<p>Canvas test: 2d.shadow.transform.2</p>
+<canvas id="c551" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_shadow_transform_2() {
+
+var canvas = document.getElementById('c551');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.shadowOffsetY = 50;
+ctx.shadowColor = '#0f0';
+ctx.rotate(Math.PI)
+ctx.fillRect(-100, 0, 100, 50);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.state.saverestore.bitmap.html ]]] -->
+
+<p>Canvas test: 2d.state.saverestore.bitmap</p>
+<!-- Testing: save()/restore() does not affect the current bitmap -->
+<canvas id="c552" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_state_saverestore_bitmap() {
+
+var canvas = document.getElementById('c552');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.save();
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.restore();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.state.saverestore.clip.html ]]] -->
+
+<p>Canvas test: 2d.state.saverestore.clip</p>
+<!-- Testing: save()/restore() affects the clipping path -->
+<canvas id="c553" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_state_saverestore_clip() {
+
+var canvas = document.getElementById('c553');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.save();
+ctx.rect(0, 0, 1, 1);
+ctx.clip();
+ctx.restore();
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.state.saverestore.fillStyle.html ]]] -->
+
+<p>Canvas test: 2d.state.saverestore.fillStyle</p>
+<!-- Testing: save()/restore() works for fillStyle -->
+<canvas id="c554" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_state_saverestore_fillStyle() {
+
+var canvas = document.getElementById('c554');
+var ctx = canvas.getContext('2d');
+
+// Test that restore() undoes any modifications
+var old = ctx.fillStyle;
+ctx.save();
+ctx.fillStyle = "#ff0000";
+ctx.restore();
+ok(ctx.fillStyle === old, "ctx.fillStyle === old");
+
+// Also test that save() doesn't modify the values
+ctx.fillStyle = "#ff0000";
+old = ctx.fillStyle;
+ // we're not interested in failures caused by get(set(x)) != x (e.g.
+ // from rounding), so compare against d instead of against "#ff0000"
+ctx.save();
+ok(ctx.fillStyle === old, "ctx.fillStyle === old");
+ctx.restore();
+
+
+}
+</script>
+
+<!-- [[[ test_2d.state.saverestore.globalAlpha.html ]]] -->
+
+<p>Canvas test: 2d.state.saverestore.globalAlpha</p>
+<!-- Testing: save()/restore() works for globalAlpha -->
+<canvas id="c555" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_state_saverestore_globalAlpha() {
+
+var canvas = document.getElementById('c555');
+var ctx = canvas.getContext('2d');
+
+// Test that restore() undoes any modifications
+var old = ctx.globalAlpha;
+ctx.save();
+ctx.globalAlpha = 0.5;
+ctx.restore();
+ok(ctx.globalAlpha === old, "ctx.globalAlpha === old");
+
+// Also test that save() doesn't modify the values
+ctx.globalAlpha = 0.5;
+old = ctx.globalAlpha;
+ // we're not interested in failures caused by get(set(x)) != x (e.g.
+ // from rounding), so compare against d instead of against 0.5
+ctx.save();
+ok(ctx.globalAlpha === old, "ctx.globalAlpha === old");
+ctx.restore();
+
+
+}
+</script>
+
+<!-- [[[ test_2d.state.saverestore.globalCompositeOperation.html ]]] -->
+
+<p>Canvas test: 2d.state.saverestore.globalCompositeOperation</p>
+<!-- Testing: save()/restore() works for globalCompositeOperation -->
+<canvas id="c556" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_state_saverestore_globalCompositeOperation() {
+
+var canvas = document.getElementById('c556');
+var ctx = canvas.getContext('2d');
+
+// Test that restore() undoes any modifications
+var old = ctx.globalCompositeOperation;
+ctx.save();
+ctx.globalCompositeOperation = "copy";
+ctx.restore();
+ok(ctx.globalCompositeOperation === old, "ctx.globalCompositeOperation === old");
+
+// Also test that save() doesn't modify the values
+ctx.globalCompositeOperation = "copy";
+old = ctx.globalCompositeOperation;
+ // we're not interested in failures caused by get(set(x)) != x (e.g.
+ // from rounding), so compare against d instead of against "copy"
+ctx.save();
+ok(ctx.globalCompositeOperation === old, "ctx.globalCompositeOperation === old");
+ctx.restore();
+
+
+}
+</script>
+
+<!-- [[[ test_2d.state.saverestore.lineCap.html ]]] -->
+
+<p>Canvas test: 2d.state.saverestore.lineCap</p>
+<!-- Testing: save()/restore() works for lineCap -->
+<canvas id="c557" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_state_saverestore_lineCap() {
+
+var canvas = document.getElementById('c557');
+var ctx = canvas.getContext('2d');
+
+// Test that restore() undoes any modifications
+var old = ctx.lineCap;
+ctx.save();
+ctx.lineCap = "round";
+ctx.restore();
+ok(ctx.lineCap === old, "ctx.lineCap === old");
+
+// Also test that save() doesn't modify the values
+ctx.lineCap = "round";
+old = ctx.lineCap;
+ // we're not interested in failures caused by get(set(x)) != x (e.g.
+ // from rounding), so compare against d instead of against "round"
+ctx.save();
+ok(ctx.lineCap === old, "ctx.lineCap === old");
+ctx.restore();
+
+
+}
+</script>
+
+<!-- [[[ test_2d.state.saverestore.lineJoin.html ]]] -->
+
+<p>Canvas test: 2d.state.saverestore.lineJoin</p>
+<!-- Testing: save()/restore() works for lineJoin -->
+<canvas id="c558" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_state_saverestore_lineJoin() {
+
+var canvas = document.getElementById('c558');
+var ctx = canvas.getContext('2d');
+
+// Test that restore() undoes any modifications
+var old = ctx.lineJoin;
+ctx.save();
+ctx.lineJoin = "round";
+ctx.restore();
+ok(ctx.lineJoin === old, "ctx.lineJoin === old");
+
+// Also test that save() doesn't modify the values
+ctx.lineJoin = "round";
+old = ctx.lineJoin;
+ // we're not interested in failures caused by get(set(x)) != x (e.g.
+ // from rounding), so compare against d instead of against "round"
+ctx.save();
+ok(ctx.lineJoin === old, "ctx.lineJoin === old");
+ctx.restore();
+
+
+}
+</script>
+
+<!-- [[[ test_2d.state.saverestore.lineWidth.html ]]] -->
+
+<p>Canvas test: 2d.state.saverestore.lineWidth</p>
+<!-- Testing: save()/restore() works for lineWidth -->
+<canvas id="c559" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_state_saverestore_lineWidth() {
+
+var canvas = document.getElementById('c559');
+var ctx = canvas.getContext('2d');
+
+// Test that restore() undoes any modifications
+var old = ctx.lineWidth;
+ctx.save();
+ctx.lineWidth = 0.5;
+ctx.restore();
+ok(ctx.lineWidth === old, "ctx.lineWidth === old");
+
+// Also test that save() doesn't modify the values
+ctx.lineWidth = 0.5;
+old = ctx.lineWidth;
+ // we're not interested in failures caused by get(set(x)) != x (e.g.
+ // from rounding), so compare against d instead of against 0.5
+ctx.save();
+ok(ctx.lineWidth === old, "ctx.lineWidth === old");
+ctx.restore();
+
+
+}
+</script>
+
+<!-- [[[ test_2d.state.saverestore.miterLimit.html ]]] -->
+
+<p>Canvas test: 2d.state.saverestore.miterLimit</p>
+<!-- Testing: save()/restore() works for miterLimit -->
+<canvas id="c560" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_state_saverestore_miterLimit() {
+
+var canvas = document.getElementById('c560');
+var ctx = canvas.getContext('2d');
+
+// Test that restore() undoes any modifications
+var old = ctx.miterLimit;
+ctx.save();
+ctx.miterLimit = 0.5;
+ctx.restore();
+ok(ctx.miterLimit === old, "ctx.miterLimit === old");
+
+// Also test that save() doesn't modify the values
+ctx.miterLimit = 0.5;
+old = ctx.miterLimit;
+ // we're not interested in failures caused by get(set(x)) != x (e.g.
+ // from rounding), so compare against d instead of against 0.5
+ctx.save();
+ok(ctx.miterLimit === old, "ctx.miterLimit === old");
+ctx.restore();
+
+
+}
+</script>
+
+<!-- [[[ test_2d.state.saverestore.path.html ]]] -->
+
+<p>Canvas test: 2d.state.saverestore.path</p>
+<!-- Testing: save()/restore() does not affect the current path -->
+<canvas id="c561" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_state_saverestore_path() {
+
+var canvas = document.getElementById('c561');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.save();
+ctx.rect(0, 0, 100, 50);
+ctx.restore();
+ctx.fillStyle = '#0f0';
+ctx.fill();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.state.saverestore.shadowBlur.html ]]] -->
+
+<p>Canvas test: 2d.state.saverestore.shadowBlur</p>
+<!-- Testing: save()/restore() works for shadowBlur -->
+<canvas id="c562" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_state_saverestore_shadowBlur() {
+
+var canvas = document.getElementById('c562');
+var ctx = canvas.getContext('2d');
+
+// Test that restore() undoes any modifications
+var old = ctx.shadowBlur;
+ctx.save();
+ctx.shadowBlur = 5;
+ctx.restore();
+ok(ctx.shadowBlur === old, "ctx.shadowBlur === old");
+
+// Also test that save() doesn't modify the values
+ctx.shadowBlur = 5;
+old = ctx.shadowBlur;
+ // we're not interested in failures caused by get(set(x)) != x (e.g.
+ // from rounding), so compare against d instead of against 5
+ctx.save();
+ok(ctx.shadowBlur === old, "ctx.shadowBlur === old");
+ctx.restore();
+
+
+}
+</script>
+
+<!-- [[[ test_2d.state.saverestore.shadowColor.html ]]] -->
+
+<p>Canvas test: 2d.state.saverestore.shadowColor</p>
+<!-- Testing: save()/restore() works for shadowColor -->
+<canvas id="c563" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_state_saverestore_shadowColor() {
+
+var canvas = document.getElementById('c563');
+var ctx = canvas.getContext('2d');
+
+// Test that restore() undoes any modifications
+var old = ctx.shadowColor;
+ctx.save();
+ctx.shadowColor = "#ff0000";
+ctx.restore();
+ok(ctx.shadowColor === old, "ctx.shadowColor === old");
+
+// Also test that save() doesn't modify the values
+ctx.shadowColor = "#ff0000";
+old = ctx.shadowColor;
+ // we're not interested in failures caused by get(set(x)) != x (e.g.
+ // from rounding), so compare against d instead of against "#ff0000"
+ctx.save();
+ok(ctx.shadowColor === old, "ctx.shadowColor === old");
+ctx.restore();
+
+
+}
+</script>
+
+<!-- [[[ test_2d.state.saverestore.shadowOffsetX.html ]]] -->
+
+<p>Canvas test: 2d.state.saverestore.shadowOffsetX</p>
+<!-- Testing: save()/restore() works for shadowOffsetX -->
+<canvas id="c564" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_state_saverestore_shadowOffsetX() {
+
+var canvas = document.getElementById('c564');
+var ctx = canvas.getContext('2d');
+
+// Test that restore() undoes any modifications
+var old = ctx.shadowOffsetX;
+ctx.save();
+ctx.shadowOffsetX = 5;
+ctx.restore();
+ok(ctx.shadowOffsetX === old, "ctx.shadowOffsetX === old");
+
+// Also test that save() doesn't modify the values
+ctx.shadowOffsetX = 5;
+old = ctx.shadowOffsetX;
+ // we're not interested in failures caused by get(set(x)) != x (e.g.
+ // from rounding), so compare against d instead of against 5
+ctx.save();
+ok(ctx.shadowOffsetX === old, "ctx.shadowOffsetX === old");
+ctx.restore();
+
+
+}
+</script>
+
+<!-- [[[ test_2d.state.saverestore.shadowOffsetY.html ]]] -->
+
+<p>Canvas test: 2d.state.saverestore.shadowOffsetY</p>
+<!-- Testing: save()/restore() works for shadowOffsetY -->
+<canvas id="c565" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_state_saverestore_shadowOffsetY() {
+
+var canvas = document.getElementById('c565');
+var ctx = canvas.getContext('2d');
+
+// Test that restore() undoes any modifications
+var old = ctx.shadowOffsetY;
+ctx.save();
+ctx.shadowOffsetY = 5;
+ctx.restore();
+ok(ctx.shadowOffsetY === old, "ctx.shadowOffsetY === old");
+
+// Also test that save() doesn't modify the values
+ctx.shadowOffsetY = 5;
+old = ctx.shadowOffsetY;
+ // we're not interested in failures caused by get(set(x)) != x (e.g.
+ // from rounding), so compare against d instead of against 5
+ctx.save();
+ok(ctx.shadowOffsetY === old, "ctx.shadowOffsetY === old");
+ctx.restore();
+
+
+}
+</script>
+
+<!-- [[[ test_2d.state.saverestore.stack.html ]]] -->
+
+<p>Canvas test: 2d.state.saverestore.stack</p>
+<!-- Testing: save()/restore() can be nested as a stack -->
+<canvas id="c566" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_state_saverestore_stack() {
+
+var canvas = document.getElementById('c566');
+var ctx = canvas.getContext('2d');
+
+ctx.lineWidth = 1;
+ctx.save();
+ctx.lineWidth = 2;
+ctx.save();
+ctx.lineWidth = 3;
+ok(ctx.lineWidth == 3, "ctx.lineWidth == 3");
+ctx.restore();
+ok(ctx.lineWidth == 2, "ctx.lineWidth == 2");
+ctx.restore();
+ok(ctx.lineWidth == 1, "ctx.lineWidth == 1");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.state.saverestore.stackdepth.html ]]] -->
+
+<p>Canvas test: 2d.state.saverestore.stackdepth</p>
+<!-- Testing: save()/restore() stack depth is not unreasonably limited -->
+<canvas id="c567" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_state_saverestore_stackdepth() {
+
+var canvas = document.getElementById('c567');
+var ctx = canvas.getContext('2d');
+
+var limit = 512;
+for (var i = 1; i < limit; ++i)
+{
+ ctx.save();
+ ctx.lineWidth = i;
+}
+for (var i = limit-1; i > 0; --i)
+{
+ ok(ctx.lineWidth == i, "ctx.lineWidth == i");
+ ctx.restore();
+}
+
+
+}
+</script>
+
+<!-- [[[ test_2d.state.saverestore.strokeStyle.html ]]] -->
+
+<p>Canvas test: 2d.state.saverestore.strokeStyle</p>
+<!-- Testing: save()/restore() works for strokeStyle -->
+<canvas id="c568" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_state_saverestore_strokeStyle() {
+
+var canvas = document.getElementById('c568');
+var ctx = canvas.getContext('2d');
+
+// Test that restore() undoes any modifications
+var old = ctx.strokeStyle;
+ctx.save();
+ctx.strokeStyle = "#ff0000";
+ctx.restore();
+ok(ctx.strokeStyle === old, "ctx.strokeStyle === old");
+
+// Also test that save() doesn't modify the values
+ctx.strokeStyle = "#ff0000";
+old = ctx.strokeStyle;
+ // we're not interested in failures caused by get(set(x)) != x (e.g.
+ // from rounding), so compare against d instead of against "#ff0000"
+ctx.save();
+ok(ctx.strokeStyle === old, "ctx.strokeStyle === old");
+ctx.restore();
+
+
+}
+</script>
+
+<!-- [[[ test_2d.state.saverestore.transformation.html ]]] -->
+
+<p>Canvas test: 2d.state.saverestore.transformation</p>
+<!-- Testing: save()/restore() affects the current transformation matrix -->
+<canvas id="c569" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_state_saverestore_transformation() {
+
+var canvas = document.getElementById('c569');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.save();
+ctx.translate(200, 0);
+ctx.restore();
+ctx.fillStyle = '#f00';
+ctx.fillRect(-200, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.state.saverestore.underflow.html ]]] -->
+
+<p>Canvas test: 2d.state.saverestore.underflow - bug 296821</p>
+<!-- Testing: restore() with an empty stack has no effect -->
+<canvas id="c570" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_state_saverestore_underflow() {
+
+var canvas = document.getElementById('c570');
+var ctx = canvas.getContext('2d');
+
+for (var i = 0; i < 16; ++i)
+ ctx.restore();
+ctx.lineWidth = 0.5;
+ctx.restore();
+ok(ctx.lineWidth == 0.5, "ctx.lineWidth == 0.5");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.strokeRect.basic.html ]]] -->
+
+<p>Canvas test: 2d.strokeRect.basic</p>
+<canvas id="c571" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_strokeRect_basic() {
+
+var canvas = document.getElementById('c571');
+var ctx = canvas.getContext('2d');
+
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 50;
+ctx.strokeRect(25, 24, 50, 2);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.strokeRect.clip.html ]]] -->
+
+<p>Canvas test: 2d.strokeRect.clip</p>
+<canvas id="c572" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_strokeRect_clip() {
+
+var canvas = document.getElementById('c572');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.beginPath();
+ctx.rect(0, 0, 16, 16);
+ctx.clip();
+
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 50;
+ctx.strokeRect(0, 0, 100, 50);
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 16, 16);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.strokeRect.globalalpha.html ]]] -->
+
+<p>Canvas test: 2d.strokeRect.globalalpha</p>
+<canvas id="c573" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_strokeRect_globalalpha() {
+
+var canvas = document.getElementById('c573');
+var ctx = canvas.getContext('2d');
+
+ctx.globalAlpha = 0;
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 50;
+ctx.strokeRect(25, 24, 50, 2);
+isPixel(ctx, 50,25, 0,0,0,0, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.strokeRect.globalcomposite.html ]]] -->
+
+<p>Canvas test: 2d.strokeRect.globalcomposite</p>
+<canvas id="c574" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_strokeRect_globalcomposite() {
+
+var canvas = document.getElementById('c574');
+var ctx = canvas.getContext('2d');
+
+ctx.globalCompositeOperation = 'source-in';
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 50;
+ctx.strokeRect(25, 24, 50, 2);
+isPixel(ctx, 50,25, 0,0,0,0, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.strokeRect.negative.html ]]] -->
+
+<p>Canvas test: 2d.strokeRect.negative</p>
+<canvas id="c575" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_strokeRect_negative() {
+
+var canvas = document.getElementById('c575');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 25;
+ctx.strokeRect(12, 12, 26, 1);
+ctx.strokeRect(88, 12, -26, 1);
+ctx.strokeRect(12, 38, 26, -1);
+ctx.strokeRect(88, 38, -26, -1);
+isPixel(ctx, 25,12, 0,255,0,255, 0);
+isPixel(ctx, 75,12, 0,255,0,255, 0);
+isPixel(ctx, 25,37, 0,255,0,255, 0);
+isPixel(ctx, 75,37, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.strokeRect.nonfinite.html ]]] -->
+
+<p>Canvas test: 2d.strokeRect.nonfinite</p>
+<!-- Testing: strokeRect() with Infinity/NaN is ignored -->
+<canvas id="c576" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_strokeRect_nonfinite() {
+
+var canvas = document.getElementById('c576');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 150;
+ctx.strokeRect(Infinity, 0, 100, 50);
+ctx.strokeRect(-Infinity, 0, 100, 50);
+ctx.strokeRect(NaN, 0, 100, 50);
+ctx.strokeRect(0, Infinity, 100, 50);
+ctx.strokeRect(0, -Infinity, 100, 50);
+ctx.strokeRect(0, NaN, 100, 50);
+ctx.strokeRect(0, 0, Infinity, 50);
+ctx.strokeRect(0, 0, -Infinity, 50);
+ctx.strokeRect(0, 0, NaN, 50);
+ctx.strokeRect(0, 0, 100, Infinity);
+ctx.strokeRect(0, 0, 100, -Infinity);
+ctx.strokeRect(0, 0, 100, NaN);
+ctx.strokeRect(Infinity, Infinity, 100, 50);
+ctx.strokeRect(Infinity, Infinity, Infinity, 50);
+ctx.strokeRect(Infinity, Infinity, Infinity, Infinity);
+ctx.strokeRect(Infinity, Infinity, 100, Infinity);
+ctx.strokeRect(Infinity, 0, Infinity, 50);
+ctx.strokeRect(Infinity, 0, Infinity, Infinity);
+ctx.strokeRect(Infinity, 0, 100, Infinity);
+ctx.strokeRect(0, Infinity, Infinity, 50);
+ctx.strokeRect(0, Infinity, Infinity, Infinity);
+ctx.strokeRect(0, Infinity, 100, Infinity);
+ctx.strokeRect(0, 0, Infinity, Infinity);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.strokeRect.path.html ]]] -->
+
+<p>Canvas test: 2d.strokeRect.path</p>
+<canvas id="c577" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_strokeRect_path() {
+
+var canvas = document.getElementById('c577');
+var ctx = canvas.getContext('2d');
+
+ctx.beginPath();
+ctx.rect(0, 0, 100, 50);
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 5;
+ctx.strokeRect(0, 0, 16, 16);
+ctx.fillStyle = '#0f0';
+ctx.fill();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.strokeRect.shadow.html ]]] -->
+
+<p>Canvas test: 2d.strokeRect.shadow</p>
+<canvas id="c578" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_strokeRect_shadow() {
+
+var canvas = document.getElementById('c578');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.fillStyle = '#f00';
+ctx.shadowBlur = 0;
+ctx.shadowOffsetX = 0;
+ctx.shadowOffsetY = 50;
+
+// Shadows are optional, so just test that if they apply to fill() then they apply to strokeRect() too
+ctx.beginPath();
+ctx.rect(0, -50, 100, 50);
+ctx.shadowColor = '#f00';
+ctx.fill();
+
+ctx.shadowColor = '#0f0';
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 50;
+ctx.strokeRect(0, -75, 100, 50);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.strokeRect.transform.html ]]] -->
+
+<p>Canvas test: 2d.strokeRect.transform</p>
+<canvas id="c579" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_strokeRect_transform() {
+
+var canvas = document.getElementById('c579');
+var ctx = canvas.getContext('2d');
+
+ctx.scale(10, 10);
+ctx.translate(0, 5);
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 5;
+ctx.strokeRect(2.5, -2.6, 5, 0.2);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.strokeRect.zero.1.html ]]] -->
+
+<p>Canvas test: 2d.strokeRect.zero.1</p>
+<canvas id="c580" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_strokeRect_zero_1() {
+
+var canvas = document.getElementById('c580');
+var ctx = canvas.getContext('2d');
+
+if (!IsD2DEnabled()) {
+ // Disabled for D2D until we can figure out Bug 587554.
+ ctx.strokeStyle = '#f00';
+ ctx.lineWidth = 250;
+ ctx.strokeRect(50, 25, 0, 0);
+ isPixel(ctx, 50,25, 0,0,0,0, 0);
+}
+
+}
+</script>
+
+<!-- [[[ test_2d.strokeRect.zero.2.html ]]] -->
+
+<p>Canvas test: 2d.strokeRect.zero.2</p>
+<canvas id="c581" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+
+function test_2d_strokeRect_zero_2() {
+
+var canvas = document.getElementById('c581');
+var ctx = canvas.getContext('2d');
+
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 250;
+ctx.lineCap = 'round';
+ctx.lineJoin = 'round';
+ctx.strokeRect(50, 25, 0, 0);
+isPixel(ctx, 50,25, 0,0,0,0, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.strokeRect.zero.3.html ]]] -->
+
+<p>Canvas test: 2d.strokeRect.zero.3</p>
+<canvas id="c582" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_strokeRect_zero_3() {
+
+var canvas = document.getElementById('c582');
+var ctx = canvas.getContext('2d');
+
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 50;
+ctx.strokeRect(0, 25, 100, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.strokeRect.zero.4.html ]]] -->
+
+<p>Canvas test: 2d.strokeRect.zero.4</p>
+<canvas id="c583" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_strokeRect_zero_4() {
+
+var canvas = document.getElementById('c583');
+var ctx = canvas.getContext('2d');
+
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 250;
+ctx.lineCap = 'round';
+ctx.strokeRect(100, 25, 100, 0);
+isPixel(ctx, 50,25, 0,0,0,0, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.strokeRect.zero.5.html ]]] -->
+
+<p>Canvas test: 2d.strokeRect.zero.5</p>
+<canvas id="c584" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_strokeRect_zero_5() {
+
+var canvas = document.getElementById('c584');
+var ctx = canvas.getContext('2d');
+
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 250;
+ctx.lineJoin = 'round';
+ctx.strokeRect(100, 25, 100, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.strokeStyle.default.html ]]] -->
+
+<p>Canvas test: 2d.strokeStyle.default</p>
+<canvas id="c585" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_strokeStyle_default() {
+
+var canvas = document.getElementById('c585');
+var ctx = canvas.getContext('2d');
+
+ok(ctx.strokeStyle == '#000000', "ctx.strokeStyle == '#000000'");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.text.align.default.html ]]] -->
+
+<p>Canvas test: 2d.text.align.default</p>
+<canvas height="50" id="c569a" width="100"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_text_align_default() {
+
+var canvas = document.getElementById('c569a');
+var ctx = canvas.getContext('2d');
+
+ok(ctx.textAlign === 'start', "ctx.textAlign === 'start'");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.text.align.invalid.html ]]] -->
+
+<p>Canvas test: 2d.text.align.invalid</p>
+<canvas height="50" id="c570a" width="100"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_text_align_invalid() {
+
+var canvas = document.getElementById('c570a');
+var ctx = canvas.getContext('2d');
+
+ctx.textAlign = 'start';
+ctx.textAlign = 'bogus';
+ok(ctx.textAlign === 'start', "ctx.textAlign === 'start'");
+
+ctx.textAlign = 'start';
+ctx.textAlign = 'END';
+ok(ctx.textAlign === 'start', "ctx.textAlign === 'start'");
+
+ctx.textAlign = 'start';
+ctx.textAlign = 'end ';
+ok(ctx.textAlign === 'start', "ctx.textAlign === 'start'");
+
+ctx.textAlign = 'start';
+ctx.textAlign = 'end\0';
+ok(ctx.textAlign === 'start', "ctx.textAlign === 'start'");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.text.baseline.default.html ]]] -->
+
+<p>Canvas test: 2d.text.baseline.default</p>
+<canvas height="50" id="c572a" width="100"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_text_baseline_default() {
+
+var canvas = document.getElementById('c572a');
+var ctx = canvas.getContext('2d');
+
+ok(ctx.textBaseline === 'alphabetic', "ctx.textBaseline === 'alphabetic'");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.text.baseline.invalid.html ]]] -->
+
+<p>Canvas test: 2d.text.baseline.invalid</p>
+<canvas height="50" id="c573a" width="100"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_text_baseline_invalid() {
+
+var canvas = document.getElementById('c573a');
+var ctx = canvas.getContext('2d');
+
+ctx.textBaseline = 'top';
+ctx.textBaseline = 'bogus';
+ok(ctx.textBaseline === 'top', "ctx.textBaseline === 'top'");
+
+ctx.textBaseline = 'top';
+ctx.textBaseline = 'MIDDLE';
+ok(ctx.textBaseline === 'top', "ctx.textBaseline === 'top'");
+
+ctx.textBaseline = 'top';
+ctx.textBaseline = 'middle ';
+ok(ctx.textBaseline === 'top', "ctx.textBaseline === 'top'");
+
+ctx.textBaseline = 'top';
+ctx.textBaseline = 'middle\0';
+ok(ctx.textBaseline === 'top', "ctx.textBaseline === 'top'");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.transformation.order.html ]]] -->
+
+<p>Canvas test: 2d.transformation.order</p>
+<!-- Testing: Transformations are applied in the right order -->
+<canvas id="c586" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_transformation_order() {
+
+var canvas = document.getElementById('c586');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.scale(2, 1);
+ctx.rotate(Math.PI / 2);
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, -50, 50, 50);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.transformation.rotate.direction.html ]]] -->
+
+<p>Canvas test: 2d.transformation.rotate.direction</p>
+<!-- Testing: rotate() is clockwise -->
+<canvas id="c587" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_transformation_rotate_direction() {
+
+var canvas = document.getElementById('c587');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.rotate(Math.PI / 2);
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, -100, 50, 100);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.transformation.rotate.nonfinite.html ]]] -->
+
+<p>Canvas test: 2d.transformation.rotate.nonfinite</p>
+<!-- Testing: rotate() with Infinity/NaN is ignored -->
+<canvas id="c588" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_transformation_rotate_nonfinite() {
+
+var canvas = document.getElementById('c588');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.translate(100, 10);
+ctx.rotate(Infinity);
+ctx.rotate(-Infinity);
+ctx.rotate(NaN);
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(-100, -10, 100, 50);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.transformation.rotate.radians.html ]]] -->
+
+<p>Canvas test: 2d.transformation.rotate.radians</p>
+<!-- Testing: rotate() uses radians -->
+<canvas id="c589" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_transformation_rotate_radians() {
+
+var canvas = document.getElementById('c589');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.rotate(Math.PI); // should fail obviously if this is 3.1 degrees
+ctx.fillStyle = '#0f0';
+ctx.fillRect(-100, -50, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.transformation.rotate.wrap.html ]]] -->
+
+<p>Canvas test: 2d.transformation.rotate.wrap</p>
+<!-- Testing: rotate() wraps large positive values correctly -->
+<canvas id="c590" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_transformation_rotate_wrap() {
+
+var canvas = document.getElementById('c590');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.rotate(Math.PI * (1 + 4096)); // == pi (mod 2*pi)
+// We need about pi +/- 0.001 in order to get correct-looking results
+// 32-bit floats can store pi*4097 with precision 2^-10, so that should
+// be safe enough on reasonable implementations
+ctx.fillStyle = '#0f0';
+ctx.fillRect(-100, -50, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,2, 0,255,0,255, 0);
+isPixel(ctx, 98,47, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.transformation.rotate.wrapnegative.html ]]] -->
+
+<p>Canvas test: 2d.transformation.rotate.wrapnegative</p>
+<!-- Testing: rotate() wraps large negative values correctly -->
+<canvas id="c591" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_transformation_rotate_wrapnegative() {
+
+var canvas = document.getElementById('c591');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.rotate(-Math.PI * (1 + 4096));
+ctx.fillStyle = '#0f0';
+ctx.fillRect(-100, -50, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,2, 0,255,0,255, 0);
+isPixel(ctx, 98,47, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.transformation.rotate.zero.html ]]] -->
+
+<p>Canvas test: 2d.transformation.rotate.zero</p>
+<!-- Testing: rotate() by 0 does nothing -->
+<canvas id="c592" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_transformation_rotate_zero() {
+
+var canvas = document.getElementById('c592');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.rotate(0);
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.transformation.scale.basic.html ]]] -->
+
+<p>Canvas test: 2d.transformation.scale.basic</p>
+<!-- Testing: scale() works -->
+<canvas id="c593" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_transformation_scale_basic() {
+
+var canvas = document.getElementById('c593');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.scale(2, 4);
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 50, 12.5);
+isPixel(ctx, 90,40, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.transformation.scale.large.html ]]] -->
+
+<p>Canvas test: 2d.transformation.scale.large</p>
+<!-- Testing: scale() with large scale factors works -->
+<canvas id="c594" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_transformation_scale_large() {
+
+var canvas = document.getElementById('c594');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.scale(1e5, 1e5);
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 1, 1);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.transformation.scale.multiple.html ]]] -->
+
+<p>Canvas test: 2d.transformation.scale.multiple</p>
+<!-- Testing: Multiple scale()s combine -->
+<canvas id="c595" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_transformation_scale_multiple() {
+
+var canvas = document.getElementById('c595');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.scale(Math.sqrt(2), Math.sqrt(2));
+ctx.scale(Math.sqrt(2), Math.sqrt(2));
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 50, 25);
+isPixel(ctx, 90,40, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.transformation.scale.negative.html ]]] -->
+
+<p>Canvas test: 2d.transformation.scale.negative</p>
+<!-- Testing: scale() with negative scale factors works -->
+<canvas id="c596" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_transformation_scale_negative() {
+
+var canvas = document.getElementById('c596');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.save();
+ctx.scale(-1, 1);
+ctx.fillStyle = '#0f0';
+ctx.fillRect(-50, 0, 50, 50);
+ctx.restore();
+
+ctx.save();
+ctx.scale(1, -1);
+ctx.fillStyle = '#0f0';
+ctx.fillRect(50, -50, 50, 50);
+ctx.restore();
+isPixel(ctx, 25,25, 0,255,0,255, 0);
+isPixel(ctx, 75,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.transformation.scale.nonfinite.html ]]] -->
+
+<p>Canvas test: 2d.transformation.scale.nonfinite</p>
+<!-- Testing: scale() with Infinity/NaN is ignored -->
+<canvas id="c597" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_transformation_scale_nonfinite() {
+
+var canvas = document.getElementById('c597');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.translate(100, 10);
+ctx.scale(Infinity, 0.1);
+ctx.scale(-Infinity, 0.1);
+ctx.scale(NaN, 0.1);
+ctx.scale(0.1, Infinity);
+ctx.scale(0.1, -Infinity);
+ctx.scale(0.1, NaN);
+ctx.scale(Infinity, Infinity);
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(-100, -10, 100, 50);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.transformation.scale.zero.html ]]] -->
+
+<p>Canvas test: 2d.transformation.scale.zero</p>
+<!-- Testing: scale() with a scale factor of zero works -->
+<canvas id="c598" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_transformation_scale_zero() {
+
+var canvas = document.getElementById('c598');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.save();
+ctx.translate(50, 0);
+ctx.scale(0, 1);
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.restore();
+
+ctx.save();
+ctx.translate(0, 25);
+ctx.scale(1, 0);
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.restore();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.transformation.setTransform.multiple.html ]]] -->
+
+<p>Canvas test: 2d.transformation.setTransform.multiple</p>
+<canvas id="c599" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_transformation_setTransform_multiple() {
+
+var canvas = document.getElementById('c599');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.setTransform(1/2,0, 0,1/2, 0,0);
+ctx.setTransform(2,0, 0,2, 0,0);
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 50, 25);
+isPixel(ctx, 75,35, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.transformation.setTransform.nonfinite.html ]]] -->
+
+<p>Canvas test: 2d.transformation.setTransform.nonfinite</p>
+<!-- Testing: setTransform() with Infinity/NaN is ignored -->
+<canvas id="c600" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_transformation_setTransform_nonfinite() {
+
+var canvas = document.getElementById('c600');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.translate(100, 10);
+ctx.setTransform(Infinity, 0, 0, 0, 0, 0);
+ctx.setTransform(-Infinity, 0, 0, 0, 0, 0);
+ctx.setTransform(NaN, 0, 0, 0, 0, 0);
+ctx.setTransform(0, Infinity, 0, 0, 0, 0);
+ctx.setTransform(0, -Infinity, 0, 0, 0, 0);
+ctx.setTransform(0, NaN, 0, 0, 0, 0);
+ctx.setTransform(0, 0, Infinity, 0, 0, 0);
+ctx.setTransform(0, 0, -Infinity, 0, 0, 0);
+ctx.setTransform(0, 0, NaN, 0, 0, 0);
+ctx.setTransform(0, 0, 0, Infinity, 0, 0);
+ctx.setTransform(0, 0, 0, -Infinity, 0, 0);
+ctx.setTransform(0, 0, 0, NaN, 0, 0);
+ctx.setTransform(0, 0, 0, 0, Infinity, 0);
+ctx.setTransform(0, 0, 0, 0, -Infinity, 0);
+ctx.setTransform(0, 0, 0, 0, NaN, 0);
+ctx.setTransform(0, 0, 0, 0, 0, Infinity);
+ctx.setTransform(0, 0, 0, 0, 0, -Infinity);
+ctx.setTransform(0, 0, 0, 0, 0, NaN);
+ctx.setTransform(Infinity, Infinity, 0, 0, 0, 0);
+ctx.setTransform(Infinity, Infinity, Infinity, 0, 0, 0);
+ctx.setTransform(Infinity, Infinity, Infinity, Infinity, 0, 0);
+ctx.setTransform(Infinity, Infinity, Infinity, Infinity, Infinity, 0);
+ctx.setTransform(Infinity, Infinity, Infinity, Infinity, Infinity, Infinity);
+ctx.setTransform(Infinity, Infinity, Infinity, Infinity, 0, Infinity);
+ctx.setTransform(Infinity, Infinity, Infinity, 0, Infinity, 0);
+ctx.setTransform(Infinity, Infinity, Infinity, 0, Infinity, Infinity);
+ctx.setTransform(Infinity, Infinity, Infinity, 0, 0, Infinity);
+ctx.setTransform(Infinity, Infinity, 0, Infinity, 0, 0);
+ctx.setTransform(Infinity, Infinity, 0, Infinity, Infinity, 0);
+ctx.setTransform(Infinity, Infinity, 0, Infinity, Infinity, Infinity);
+ctx.setTransform(Infinity, Infinity, 0, Infinity, 0, Infinity);
+ctx.setTransform(Infinity, Infinity, 0, 0, Infinity, 0);
+ctx.setTransform(Infinity, Infinity, 0, 0, Infinity, Infinity);
+ctx.setTransform(Infinity, Infinity, 0, 0, 0, Infinity);
+ctx.setTransform(Infinity, 0, Infinity, 0, 0, 0);
+ctx.setTransform(Infinity, 0, Infinity, Infinity, 0, 0);
+ctx.setTransform(Infinity, 0, Infinity, Infinity, Infinity, 0);
+ctx.setTransform(Infinity, 0, Infinity, Infinity, Infinity, Infinity);
+ctx.setTransform(Infinity, 0, Infinity, Infinity, 0, Infinity);
+ctx.setTransform(Infinity, 0, Infinity, 0, Infinity, 0);
+ctx.setTransform(Infinity, 0, Infinity, 0, Infinity, Infinity);
+ctx.setTransform(Infinity, 0, Infinity, 0, 0, Infinity);
+ctx.setTransform(Infinity, 0, 0, Infinity, 0, 0);
+ctx.setTransform(Infinity, 0, 0, Infinity, Infinity, 0);
+ctx.setTransform(Infinity, 0, 0, Infinity, Infinity, Infinity);
+ctx.setTransform(Infinity, 0, 0, Infinity, 0, Infinity);
+ctx.setTransform(Infinity, 0, 0, 0, Infinity, 0);
+ctx.setTransform(Infinity, 0, 0, 0, Infinity, Infinity);
+ctx.setTransform(Infinity, 0, 0, 0, 0, Infinity);
+ctx.setTransform(0, Infinity, Infinity, 0, 0, 0);
+ctx.setTransform(0, Infinity, Infinity, Infinity, 0, 0);
+ctx.setTransform(0, Infinity, Infinity, Infinity, Infinity, 0);
+ctx.setTransform(0, Infinity, Infinity, Infinity, Infinity, Infinity);
+ctx.setTransform(0, Infinity, Infinity, Infinity, 0, Infinity);
+ctx.setTransform(0, Infinity, Infinity, 0, Infinity, 0);
+ctx.setTransform(0, Infinity, Infinity, 0, Infinity, Infinity);
+ctx.setTransform(0, Infinity, Infinity, 0, 0, Infinity);
+ctx.setTransform(0, Infinity, 0, Infinity, 0, 0);
+ctx.setTransform(0, Infinity, 0, Infinity, Infinity, 0);
+ctx.setTransform(0, Infinity, 0, Infinity, Infinity, Infinity);
+ctx.setTransform(0, Infinity, 0, Infinity, 0, Infinity);
+ctx.setTransform(0, Infinity, 0, 0, Infinity, 0);
+ctx.setTransform(0, Infinity, 0, 0, Infinity, Infinity);
+ctx.setTransform(0, Infinity, 0, 0, 0, Infinity);
+ctx.setTransform(0, 0, Infinity, Infinity, 0, 0);
+ctx.setTransform(0, 0, Infinity, Infinity, Infinity, 0);
+ctx.setTransform(0, 0, Infinity, Infinity, Infinity, Infinity);
+ctx.setTransform(0, 0, Infinity, Infinity, 0, Infinity);
+ctx.setTransform(0, 0, Infinity, 0, Infinity, 0);
+ctx.setTransform(0, 0, Infinity, 0, Infinity, Infinity);
+ctx.setTransform(0, 0, Infinity, 0, 0, Infinity);
+ctx.setTransform(0, 0, 0, Infinity, Infinity, 0);
+ctx.setTransform(0, 0, 0, Infinity, Infinity, Infinity);
+ctx.setTransform(0, 0, 0, Infinity, 0, Infinity);
+ctx.setTransform(0, 0, 0, 0, Infinity, Infinity);
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(-100, -10, 100, 50);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.transformation.setTransform.skewed.html ]]] -->
+
+<p>Canvas test: 2d.transformation.setTransform.skewed</p>
+<canvas id="c601" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_transformation_setTransform_skewed() {
+
+var canvas = document.getElementById('c601');
+var ctx = canvas.getContext('2d');
+
+// Create green with a red square ring inside it
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#f00';
+ctx.fillRect(20, 10, 60, 30);
+ctx.fillStyle = '#0f0';
+ctx.fillRect(40, 20, 20, 10);
+
+// Draw a skewed shape to fill that gap, to make sure it is aligned correctly
+ctx.setTransform(1,4, 2,3, 5,6);
+// Post-transform coordinates:
+// [[20,10],[80,10],[80,40],[20,40],[20,10],[40,20],[40,30],[60,30],[60,20],[40,20],[20,10]];
+// Hence pre-transform coordinates:
+var pts=[[-7.4,11.2],[-43.4,59.2],[-31.4,53.2],[4.6,5.2],[-7.4,11.2],
+ [-15.4,25.2],[-11.4,23.2],[-23.4,39.2],[-27.4,41.2],[-15.4,25.2],
+ [-7.4,11.2]];
+ctx.beginPath();
+ctx.moveTo(pts[0][0], pts[0][1]);
+for (var i = 0; i < pts.length; ++i)
+ ctx.lineTo(pts[i][0], pts[i][1]);
+ctx.fill();
+isPixel(ctx, 21,11, 0,255,0,255, 0);
+isPixel(ctx, 79,11, 0,255,0,255, 0);
+isPixel(ctx, 21,39, 0,255,0,255, 0);
+isPixel(ctx, 79,39, 0,255,0,255, 0);
+isPixel(ctx, 39,19, 0,255,0,255, IsAzureSkia() ? 1 : 0);
+isPixel(ctx, 61,19, 0,255,0,255, 0);
+isPixel(ctx, 39,31, 0,255,0,255, 0);
+isPixel(ctx, 61,31, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.transformation.transform.identity.html ]]] -->
+
+<p>Canvas test: 2d.transformation.transform.identity</p>
+<!-- Testing: transform() with the identity matrix does nothing -->
+<canvas id="c602" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_transformation_transform_identity() {
+
+var canvas = document.getElementById('c602');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.transform(1,0, 0,1, 0,0);
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+
+</script>
+
+<!-- [[[ test_2d.transformation.transform.multiply.html ]]] -->
+
+<p>Canvas test: 2d.transformation.transform.multiply</p>
+<!-- Testing: transform() multiplies the CTM -->
+<canvas id="c603" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_transformation_transform_multiply() {
+
+var canvas = document.getElementById('c603');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.transform(1,2, 3,4, 5,6);
+ctx.transform(-2,1, 3/2,-1/2, 1,-2);
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.transformation.transform.nonfinite.html ]]] -->
+
+<p>Canvas test: 2d.transformation.transform.nonfinite</p>
+<!-- Testing: transform() with Infinity/NaN is ignored -->
+<canvas id="c604" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_transformation_transform_nonfinite() {
+
+var canvas = document.getElementById('c604');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.translate(100, 10);
+ctx.transform(Infinity, 0, 0, 0, 0, 0);
+ctx.transform(-Infinity, 0, 0, 0, 0, 0);
+ctx.transform(NaN, 0, 0, 0, 0, 0);
+ctx.transform(0, Infinity, 0, 0, 0, 0);
+ctx.transform(0, -Infinity, 0, 0, 0, 0);
+ctx.transform(0, NaN, 0, 0, 0, 0);
+ctx.transform(0, 0, Infinity, 0, 0, 0);
+ctx.transform(0, 0, -Infinity, 0, 0, 0);
+ctx.transform(0, 0, NaN, 0, 0, 0);
+ctx.transform(0, 0, 0, Infinity, 0, 0);
+ctx.transform(0, 0, 0, -Infinity, 0, 0);
+ctx.transform(0, 0, 0, NaN, 0, 0);
+ctx.transform(0, 0, 0, 0, Infinity, 0);
+ctx.transform(0, 0, 0, 0, -Infinity, 0);
+ctx.transform(0, 0, 0, 0, NaN, 0);
+ctx.transform(0, 0, 0, 0, 0, Infinity);
+ctx.transform(0, 0, 0, 0, 0, -Infinity);
+ctx.transform(0, 0, 0, 0, 0, NaN);
+ctx.transform(Infinity, Infinity, 0, 0, 0, 0);
+ctx.transform(Infinity, Infinity, Infinity, 0, 0, 0);
+ctx.transform(Infinity, Infinity, Infinity, Infinity, 0, 0);
+ctx.transform(Infinity, Infinity, Infinity, Infinity, Infinity, 0);
+ctx.transform(Infinity, Infinity, Infinity, Infinity, Infinity, Infinity);
+ctx.transform(Infinity, Infinity, Infinity, Infinity, 0, Infinity);
+ctx.transform(Infinity, Infinity, Infinity, 0, Infinity, 0);
+ctx.transform(Infinity, Infinity, Infinity, 0, Infinity, Infinity);
+ctx.transform(Infinity, Infinity, Infinity, 0, 0, Infinity);
+ctx.transform(Infinity, Infinity, 0, Infinity, 0, 0);
+ctx.transform(Infinity, Infinity, 0, Infinity, Infinity, 0);
+ctx.transform(Infinity, Infinity, 0, Infinity, Infinity, Infinity);
+ctx.transform(Infinity, Infinity, 0, Infinity, 0, Infinity);
+ctx.transform(Infinity, Infinity, 0, 0, Infinity, 0);
+ctx.transform(Infinity, Infinity, 0, 0, Infinity, Infinity);
+ctx.transform(Infinity, Infinity, 0, 0, 0, Infinity);
+ctx.transform(Infinity, 0, Infinity, 0, 0, 0);
+ctx.transform(Infinity, 0, Infinity, Infinity, 0, 0);
+ctx.transform(Infinity, 0, Infinity, Infinity, Infinity, 0);
+ctx.transform(Infinity, 0, Infinity, Infinity, Infinity, Infinity);
+ctx.transform(Infinity, 0, Infinity, Infinity, 0, Infinity);
+ctx.transform(Infinity, 0, Infinity, 0, Infinity, 0);
+ctx.transform(Infinity, 0, Infinity, 0, Infinity, Infinity);
+ctx.transform(Infinity, 0, Infinity, 0, 0, Infinity);
+ctx.transform(Infinity, 0, 0, Infinity, 0, 0);
+ctx.transform(Infinity, 0, 0, Infinity, Infinity, 0);
+ctx.transform(Infinity, 0, 0, Infinity, Infinity, Infinity);
+ctx.transform(Infinity, 0, 0, Infinity, 0, Infinity);
+ctx.transform(Infinity, 0, 0, 0, Infinity, 0);
+ctx.transform(Infinity, 0, 0, 0, Infinity, Infinity);
+ctx.transform(Infinity, 0, 0, 0, 0, Infinity);
+ctx.transform(0, Infinity, Infinity, 0, 0, 0);
+ctx.transform(0, Infinity, Infinity, Infinity, 0, 0);
+ctx.transform(0, Infinity, Infinity, Infinity, Infinity, 0);
+ctx.transform(0, Infinity, Infinity, Infinity, Infinity, Infinity);
+ctx.transform(0, Infinity, Infinity, Infinity, 0, Infinity);
+ctx.transform(0, Infinity, Infinity, 0, Infinity, 0);
+ctx.transform(0, Infinity, Infinity, 0, Infinity, Infinity);
+ctx.transform(0, Infinity, Infinity, 0, 0, Infinity);
+ctx.transform(0, Infinity, 0, Infinity, 0, 0);
+ctx.transform(0, Infinity, 0, Infinity, Infinity, 0);
+ctx.transform(0, Infinity, 0, Infinity, Infinity, Infinity);
+ctx.transform(0, Infinity, 0, Infinity, 0, Infinity);
+ctx.transform(0, Infinity, 0, 0, Infinity, 0);
+ctx.transform(0, Infinity, 0, 0, Infinity, Infinity);
+ctx.transform(0, Infinity, 0, 0, 0, Infinity);
+ctx.transform(0, 0, Infinity, Infinity, 0, 0);
+ctx.transform(0, 0, Infinity, Infinity, Infinity, 0);
+ctx.transform(0, 0, Infinity, Infinity, Infinity, Infinity);
+ctx.transform(0, 0, Infinity, Infinity, 0, Infinity);
+ctx.transform(0, 0, Infinity, 0, Infinity, 0);
+ctx.transform(0, 0, Infinity, 0, Infinity, Infinity);
+ctx.transform(0, 0, Infinity, 0, 0, Infinity);
+ctx.transform(0, 0, 0, Infinity, Infinity, 0);
+ctx.transform(0, 0, 0, Infinity, Infinity, Infinity);
+ctx.transform(0, 0, 0, Infinity, 0, Infinity);
+ctx.transform(0, 0, 0, 0, Infinity, Infinity);
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(-100, -10, 100, 50);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.transformation.transform.skewed.html ]]] -->
+
+<p>Canvas test: 2d.transformation.transform.skewed</p>
+<!-- Testing: transform() with skewy matrix transforms correctly -->
+<canvas id="c605" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_transformation_transform_skewed() {
+
+var canvas = document.getElementById('c605');
+var ctx = canvas.getContext('2d');
+
+// Create green with a red square ring inside it
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#f00';
+ctx.fillRect(20, 10, 60, 30);
+ctx.fillStyle = '#0f0';
+ctx.fillRect(40, 20, 20, 10);
+
+// Draw a skewed shape to fill that gap, to make sure it is aligned correctly
+ctx.transform(1,4, 2,3, 5,6);
+// Post-transform coordinates:
+// [[20,10],[80,10],[80,40],[20,40],[20,10],[40,20],[40,30],[60,30],[60,20],[40,20],[20,10]];
+// Hence pre-transform coordinates:
+var pts=[[-7.4,11.2],[-43.4,59.2],[-31.4,53.2],[4.6,5.2],[-7.4,11.2],
+ [-15.4,25.2],[-11.4,23.2],[-23.4,39.2],[-27.4,41.2],[-15.4,25.2],
+ [-7.4,11.2]];
+ctx.beginPath();
+ctx.moveTo(pts[0][0], pts[0][1]);
+for (var i = 0; i < pts.length; ++i)
+ ctx.lineTo(pts[i][0], pts[i][1]);
+ctx.fill();
+isPixel(ctx, 21,11, 0,255,0,255, 0);
+isPixel(ctx, 79,11, 0,255,0,255, 0);
+isPixel(ctx, 21,39, 0,255,0,255, 0);
+isPixel(ctx, 79,39, 0,255,0,255, 0);
+isPixel(ctx, 39,19, 0,255,0,255, IsAzureSkia() ? 1 : 0);
+isPixel(ctx, 61,19, 0,255,0,255, 0);
+isPixel(ctx, 39,31, 0,255,0,255, 0);
+isPixel(ctx, 61,31, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.transformation.translate.basic.html ]]] -->
+
+<p>Canvas test: 2d.transformation.translate.basic</p>
+<!-- Testing: translate() works -->
+<canvas id="c606" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_transformation_translate_basic() {
+
+var canvas = document.getElementById('c606');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.translate(100, 50);
+ctx.fillStyle = '#0f0';
+ctx.fillRect(-100, -50, 100, 50);
+isPixel(ctx, 90,40, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.transformation.translate.nonfinite.html ]]] -->
+
+<p>Canvas test: 2d.transformation.translate.nonfinite</p>
+<!-- Testing: translate() with Infinity/NaN is ignored -->
+<canvas id="c607" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_transformation_translate_nonfinite() {
+
+var canvas = document.getElementById('c607');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.translate(100, 10);
+ctx.translate(Infinity, 0.1);
+ctx.translate(-Infinity, 0.1);
+ctx.translate(NaN, 0.1);
+ctx.translate(0.1, Infinity);
+ctx.translate(0.1, -Infinity);
+ctx.translate(0.1, NaN);
+ctx.translate(Infinity, Infinity);
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(-100, -10, 100, 50);
+
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_2d.type.exists.html ]]] -->
+
+<p>Canvas test: 2d.type.exists</p>
+<!-- Testing: The 2D context interface is a property of 'window' -->
+<canvas id="c609" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_type_exists() {
+
+var canvas = document.getElementById('c609');
+var ctx = canvas.getContext('2d');
+
+ok(window.CanvasRenderingContext2D, "window.CanvasRenderingContext2D");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.type.extend.html ]]] -->
+
+<p>Canvas test: 2d.type.extend</p>
+<!-- Testing: Interface methods can be added -->
+<canvas id="c610" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_type_extend() {
+
+var canvas = document.getElementById('c610');
+var ctx = canvas.getContext('2d');
+
+window.CanvasRenderingContext2D.prototype.fillRectGreen = function (x, y, w, h)
+{
+ this.fillStyle = '#0f0';
+ this.fillRect(x, y, w, h);
+};
+ctx.fillStyle = '#f00';
+ctx.fillRectGreen(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.type.prototype.html ]]] -->
+
+<p>Canvas test: 2d.type.prototype</p>
+<!-- Testing: window.CanvasRenderingContext2D.prototype is { DontDelete, ReadOnly }, and its methods are not -->
+<canvas id="c611" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_type_prototype() {
+
+var canvas = document.getElementById('c611');
+var ctx = canvas.getContext('2d');
+
+var fill = window.CanvasRenderingContext2D.prototype.fill;
+ok(window.CanvasRenderingContext2D.prototype, "window.CanvasRenderingContext2D.prototype");
+ok(window.CanvasRenderingContext2D.prototype.fill, "window.CanvasRenderingContext2D.prototype.fill");
+window.CanvasRenderingContext2D.prototype = null;
+ok(window.CanvasRenderingContext2D.prototype, "window.CanvasRenderingContext2D.prototype");
+delete window.CanvasRenderingContext2D.prototype;
+ok(window.CanvasRenderingContext2D.prototype, "window.CanvasRenderingContext2D.prototype");
+window.CanvasRenderingContext2D.prototype.fill = 1;
+ok(window.CanvasRenderingContext2D.prototype.fill === 1, "window.CanvasRenderingContext2D.prototype.fill === 1");
+delete window.CanvasRenderingContext2D.prototype.fill;
+ok(window.CanvasRenderingContext2D.prototype.fill === undefined, "window.CanvasRenderingContext2D.prototype.fill === undefined");
+
+//restore the original method to ensure that other tests can run successfully
+window.CanvasRenderingContext2D.prototype.fill = fill;
+}
+</script>
+
+<!-- [[[ test_2d.type.replace.html ]]] -->
+
+<p>Canvas test: 2d.type.replace</p>
+<!-- Testing: Interface methods can be overridden -->
+<canvas id="c612" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_type_replace() {
+
+var canvas = document.getElementById('c612');
+var ctx = canvas.getContext('2d');
+
+var fillRect = window.CanvasRenderingContext2D.prototype.fillRect;
+window.CanvasRenderingContext2D.prototype.fillRect = function (x, y, w, h)
+{
+ this.fillStyle = '#0f0';
+ fillRect.call(this, x, y, w, h);
+};
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+//restore the original method to ensure that other tests can run successfully
+window.CanvasRenderingContext2D.prototype.fillRect = fillRect;
+}
+</script>
+
+<!-- [[[ test_2d.voidreturn.html ]]] -->
+
+<p>Canvas test: 2d.voidreturn</p>
+<!-- Testing: void methods return undefined -->
+<canvas id="c613" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_voidreturn() {
+
+var canvas = document.getElementById('c613');
+var ctx = canvas.getContext('2d');
+
+ok(ctx.save() === undefined, "ctx.save() === undefined");
+ok(ctx.restore() === undefined, "ctx.restore() === undefined");
+ok(ctx.scale(1, 1) === undefined, "ctx.scale(1, 1) === undefined");
+ok(ctx.rotate(0) === undefined, "ctx.rotate(0) === undefined");
+ok(ctx.translate(0, 0) === undefined, "ctx.translate(0, 0) === undefined");
+if (ctx.transform) { // (avoid spurious failures, since the aim here is not to test that all features are supported)
+ ok(ctx.transform(1, 0, 0, 1, 0, 0) === undefined, "ctx.transform(1, 0, 0, 1, 0, 0) === undefined");
+}
+if (ctx.setTransform) {
+ ok(ctx.setTransform(1, 0, 0, 1, 0, 0) === undefined, "ctx.setTransform(1, 0, 0, 1, 0, 0) === undefined");
+}
+if (ctx.resetTransform) {
+ ok(ctx.resetTransform() === undefined, "ctx.resetTransform() === undefined");
+}
+ok(ctx.clearRect(0, 0, 0, 0) === undefined, "ctx.clearRect(0, 0, 0, 0) === undefined");
+ok(ctx.fillRect(0, 0, 0, 0) === undefined, "ctx.fillRect(0, 0, 0, 0) === undefined");
+ok(ctx.strokeRect(0, 0, 0, 0) === undefined, "ctx.strokeRect(0, 0, 0, 0) === undefined");
+ok(ctx.beginPath() === undefined, "ctx.beginPath() === undefined");
+ok(ctx.closePath() === undefined, "ctx.closePath() === undefined");
+ok(ctx.moveTo(0, 0) === undefined, "ctx.moveTo(0, 0) === undefined");
+ok(ctx.lineTo(0, 0) === undefined, "ctx.lineTo(0, 0) === undefined");
+ok(ctx.quadraticCurveTo(0, 0, 0, 0) === undefined, "ctx.quadraticCurveTo(0, 0, 0, 0) === undefined");
+ok(ctx.bezierCurveTo(0, 0, 0, 0, 0, 0) === undefined, "ctx.bezierCurveTo(0, 0, 0, 0, 0, 0) === undefined");
+ok(ctx.arcTo(0, 0, 0, 0, 1) === undefined, "ctx.arcTo(0, 0, 0, 0, 1) === undefined");
+ok(ctx.rect(0, 0, 0, 0) === undefined, "ctx.rect(0, 0, 0, 0) === undefined");
+ok(ctx.arc(0, 0, 1, 0, 0, true) === undefined, "ctx.arc(0, 0, 1, 0, 0, true) === undefined");
+ok(ctx.fill() === undefined, "ctx.fill() === undefined");
+ok(ctx.stroke() === undefined, "ctx.stroke() === undefined");
+ok(ctx.clip() === undefined, "ctx.clip() === undefined");
+if (ctx.putImageData) {
+ ok(ctx.putImageData(ctx.getImageData(0, 0, 1, 1), 0, 0) === undefined, "ctx.putImageData(ctx.getImageData(0, 0, 1, 1), 0, 0) === undefined");
+}
+ok(ctx.drawImage(document.getElementById('yellow_11.png'), 0, 0, 1, 1, 0, 0, 0, 0) === undefined, "ctx.drawImage(document.getElementById('yellow_11.png'), 0, 0, 1, 1, 0, 0, 0, 0) === undefined");
+ok(ctx.drawImage(canvas, 0, 0, 1, 1, 0, 0, 0, 0) === undefined, "ctx.drawImage(canvas, 0, 0, 1, 1, 0, 0, 0, 0) === undefined");
+ok(ctx.createLinearGradient(0, 0, 0, 0).addColorStop(0, 'white') === undefined, "ctx.createLinearGradient(0, 0, 0, 0).addColorStop(0, 'white') === undefined");
+
+
+}
+</script>
+<img src="image_yellow.png" id="yellow_11.png" class="resource">
+
+<!-- [[[ test_bug397524.html ]]] -->
+
+<p>Test for Bug 397524</p>
+<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=397524">Mozilla Bug 397524</a>
+<p id="display">
+ <canvas id="canvas1" width="1" height="1"></canvas>
+ <canvas id="canvas2" width="1" height="1"></canvas>
+ <canvas id="canvas3" width="1" height="1"></canvas>
+ <img id="i1", src="image_green-1x1.png">
+ <img id="i2" src="http://example.com/tests/dom/canvas/test/image_green-1x1.png">
+ <img id="i3" src="image_green-redirect">
+</p>
+<div id="content" style="display: none">
+
+</div>
+<pre id="test">
+<script class="testbody" type="text/javascript">
+
+/** Test for Bug 397524 **/
+
+function draw(n) {
+ $("canvas" + n).getContext('2d').drawImage($("i" + n), 0, 0);
+}
+
+function test_bug397524() {
+ draw(1);
+ draw(2);
+ draw(3);
+
+ // Should be able to get the data out of the first canvas
+ $("canvas1").toDataURL("image/png");
+
+ // Should not be able to get the data out of a cross-site load
+ var gotData = false;
+ try {
+ $("canvas2").toDataURL("image/png");
+ gotData = true;
+ } catch (ex) {
+ if (ex.code != 18 || ex.name != "SecurityError") {
+ throw ex;
+ }
+ }
+ is(gotData, false, "Shouldn't be able to read images cross-site!");
+
+ // Should not be able to get the data out of a redirected cross-site load
+ var gotData = false;
+ try {
+ $("canvas3").toDataURL("image/png");
+ gotData = true;
+ } catch (ex) {
+ if (ex.code != 18 || ex.name != "SecurityError") {
+ throw ex;
+ }
+ }
+ is(gotData, false, "Shouldn't be able to read images redirected cross-site!");
+
+}
+
+</script>
+</pre>
+
+<!-- [[[ test_bug405982.html ]]] -->
+
+<p>Canvas test: toDataURL.png</p>
+<canvas id="c614" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+function test_bug405982() {
+
+var canvas = SpecialPowers.wrap(document.getElementById('c614'));
+var ctx = canvas.getContext('2d');
+
+var _threw = false;
+try {
+ var data = canvas.toDataURL('image/png', 'quality=100');
+}
+catch (e) {
+ _threw = true;
+}
+ok(!_threw, "Should not throw an exception for invalid args to png encoder");
+
+_threw = false;
+try {
+ var data = canvas.toDataURL('image/jpeg', 'foobar=true');
+}
+catch (e) {
+ _threw = true;
+}
+ok(!_threw, "Should not throw an exception for invalid args to jpeg encoder");
+
+}
+</script>
+<!-- [[[ test_context.arguments.extra.html ]]] -->
+
+<p>Canvas test: context.arguments.extra</p>
+<canvas id="c615" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_context_arguments_extra() {
+
+var canvas = document.getElementById('c615');
+var ctx = canvas.getContext('2d');
+
+ok(canvas.getContext('2d', 'foo') !== null, "canvas.getContext('2d', 'foo') !== null");
+
+
+}
+</script>
+
+<!-- [[[ test_context.arguments.missing.html ]]] -->
+
+<p>Canvas test: context.arguments.missing</p>
+<canvas id="c616" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_context_arguments_missing() {
+
+var canvas = document.getElementById('c616');
+var ctx = canvas.getContext('2d');
+
+var _thrown = undefined; try {
+ canvas.getContext();
+} catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
+
+
+}
+</script>
+
+<!-- [[[ test_context.casesensitive.html ]]] -->
+
+<p>Canvas test: context.casesensitive - bug 401788</p>
+<!-- Testing: Context name "2D" is unrecognised; matching is case sensitive -->
+<canvas id="c617" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_context_casesensitive() {
+
+var canvas = document.getElementById('c617');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ok(canvas.getContext('2D') === null, "canvas.getContext('2D') === null");
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_context.emptystring.html ]]] -->
+
+<p>Canvas test: context.emptystring - bug 401788</p>
+<!-- Testing: getContext with empty string returns null -->
+<canvas id="c618" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_context_emptystring() {
+
+var canvas = document.getElementById('c618');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ok(canvas.getContext("") === null, "canvas.getContext(\"\") === null");
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_context.unrecognised.badname.html ]]] -->
+
+<p>Canvas test: context.unrecognised.badname - bug 401788</p>
+<!-- Testing: getContext with unrecognised context name returns null -->
+<canvas id="c619" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_context_unrecognised_badname() {
+
+var canvas = document.getElementById('c619');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ok(canvas.getContext('This is not an implemented context in any real browser') === null, "canvas.getContext('This is not an implemented context in any real browser') === null");
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_context.unrecognised.badsuffix.html ]]] -->
+
+<p>Canvas test: context.unrecognised.badsuffix - bug 401788</p>
+<!-- Testing: Context name "2d" plus a suffix is unrecognised -->
+<canvas id="c620" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_context_unrecognised_badsuffix() {
+
+var canvas = document.getElementById('c620');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ok(canvas.getContext("2d#") === null, "canvas.getContext(\"2d#\") === null");
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_context.unrecognised.nullsuffix.html ]]] -->
+
+<p>Canvas test: context.unrecognised.nullsuffix - bug 401788</p>
+<!-- Testing: Context name "2d" plus a "\0" suffix is unrecognised -->
+<canvas id="c621" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_context_unrecognised_nullsuffix() {
+
+var canvas = document.getElementById('c621');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ok(canvas.getContext("2d\0") === null, "canvas.getContext(\"2d\\0\") === null");
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_context.unrecognised.unicode.html ]]] -->
+
+<p>Canvas test: context.unrecognised.unicode - bug 401788</p>
+<!-- Testing: Context name which kind of looks like "2d" is unrecognised -->
+<canvas id="c622" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_context_unrecognised_unicode() {
+
+var canvas = document.getElementById('c622');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ok(canvas.getContext("2\uFF44") === null, "canvas.getContext(\"2\\uFF44\") === null"); // Fullwidth Latin Small Letter D
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_fallback.basic.html ]]] -->
+
+<p>Canvas test: fallback.basic</p>
+<!-- Testing: Fallback content is inserted into the DOM -->
+<canvas id="c623" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_fallback_basic() {
+
+var canvas = document.getElementById('c623');
+var ctx = canvas.getContext('2d');
+
+ok(canvas.childNodes.length == 1, "canvas.childNodes.length == 1");
+
+
+}
+</script>
+
+<!-- [[[ test_fallback.multiple.html ]]] -->
+
+<p>Canvas test: fallback.multiple</p>
+<!-- Testing: Fallback content with multiple elements -->
+<canvas id="c624" width="100" height="50"><p class="fallback">FAIL</p><p class="fallback">FAIL</p></canvas>
+<script>
+
+function test_fallback_multiple() {
+
+var canvas = document.getElementById('c624');
+var ctx = canvas.getContext('2d');
+
+ok(canvas.childNodes.length == 2, "canvas.childNodes.length == 2");
+
+
+}
+</script>
+
+<!-- [[[ test_fallback.nested.html ]]] -->
+
+<p>Canvas test: fallback.nested</p>
+<!-- Testing: Fallback content containing another canvas (mostly testing parsers) -->
+<canvas id="c625" width="100" height="50"><canvas><p class="fallback">FAIL (fallback content)</p></canvas><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_fallback_nested() {
+
+var canvas = document.getElementById('c625');
+var ctx = canvas.getContext('2d');
+
+ok(canvas.childNodes.length == 2, "canvas.childNodes.length == 2");
+
+
+}
+</script>
+
+<!-- [[[ test_initial.colour.html ]]] -->
+
+<p>Canvas test: initial.colour</p>
+<!-- Testing: Initial state is transparent black -->
+<canvas id="c626" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_initial_colour() {
+
+var canvas = document.getElementById('c626');
+var ctx = canvas.getContext('2d');
+
+isPixel(ctx, 20,20, 0,0,0,0, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_initial.reset.2dstate.html ]]] -->
+
+<p>Canvas test: initial.reset.2dstate</p>
+<!-- Testing: Resetting the canvas state resets 2D state variables -->
+<canvas id="c627" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_initial_reset_2dstate() {
+
+var canvas = document.getElementById('c627');
+var ctx = canvas.getContext('2d');
+
+canvas.width = 100;
+var default_val;
+
+default_val = ctx.strokeStyle;
+ctx.strokeStyle = "#ff0000";
+canvas.width = 100;
+ok(ctx.strokeStyle === default_val, "ctx.strokeStyle === default_val");
+
+default_val = ctx.fillStyle;
+ctx.fillStyle = "#ff0000";
+canvas.width = 100;
+ok(ctx.fillStyle === default_val, "ctx.fillStyle === default_val");
+
+default_val = ctx.globalAlpha;
+ctx.globalAlpha = 0.5;
+canvas.width = 100;
+ok(ctx.globalAlpha === default_val, "ctx.globalAlpha === default_val");
+
+default_val = ctx.lineWidth;
+ctx.lineWidth = 0.5;
+canvas.width = 100;
+ok(ctx.lineWidth === default_val, "ctx.lineWidth === default_val");
+
+default_val = ctx.lineCap;
+ctx.lineCap = "round";
+canvas.width = 100;
+ok(ctx.lineCap === default_val, "ctx.lineCap === default_val");
+
+default_val = ctx.lineJoin;
+ctx.lineJoin = "round";
+canvas.width = 100;
+ok(ctx.lineJoin === default_val, "ctx.lineJoin === default_val");
+
+default_val = ctx.miterLimit;
+ctx.miterLimit = 0.5;
+canvas.width = 100;
+ok(ctx.miterLimit === default_val, "ctx.miterLimit === default_val");
+
+default_val = ctx.shadowOffsetX;
+ctx.shadowOffsetX = 5;
+canvas.width = 100;
+ok(ctx.shadowOffsetX === default_val, "ctx.shadowOffsetX === default_val");
+
+default_val = ctx.shadowOffsetY;
+ctx.shadowOffsetY = 5;
+canvas.width = 100;
+ok(ctx.shadowOffsetY === default_val, "ctx.shadowOffsetY === default_val");
+
+default_val = ctx.shadowBlur;
+ctx.shadowBlur = 5;
+canvas.width = 100;
+ok(ctx.shadowBlur === default_val, "ctx.shadowBlur === default_val");
+
+default_val = ctx.shadowColor;
+ctx.shadowColor = "#ff0000";
+canvas.width = 100;
+ok(ctx.shadowColor === default_val, "ctx.shadowColor === default_val");
+
+default_val = ctx.globalCompositeOperation;
+ctx.globalCompositeOperation = "copy";
+canvas.width = 100;
+ok(ctx.globalCompositeOperation === default_val, "ctx.globalCompositeOperation === default_val");
+
+
+}
+</script>
+
+<!-- [[[ test_initial.reset.clip.html ]]] -->
+
+<p>Canvas test: initial.reset.clip</p>
+<!-- Testing: Resetting the canvas state resets the current clip region -->
+<canvas id="c628" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_initial_reset_clip() {
+
+var canvas = document.getElementById('c628');
+var ctx = canvas.getContext('2d');
+
+canvas.width = 100;
+ctx.rect(0, 0, 1, 1);
+ctx.clip();
+canvas.width = 100;
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 20,20, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_initial.reset.different.html ]]] -->
+
+<p>Canvas test: initial.reset.different</p>
+<!-- Testing: Changing size resets canvas to transparent black -->
+<canvas id="c629" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_initial_reset_different() {
+
+var canvas = document.getElementById('c629');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 50, 50);
+isPixel(ctx, 20,20, 255,0,0,255, 0);
+canvas.width = 50;
+isPixel(ctx, 20,20, 0,0,0,0, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_initial.reset.gradient.html ]]] -->
+
+<p>Canvas test: initial.reset.gradient</p>
+<!-- Testing: Resetting the canvas state does not invalidate any existing gradients -->
+<canvas id="c630" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_initial_reset_gradient() {
+
+var canvas = document.getElementById('c630');
+var ctx = canvas.getContext('2d');
+
+canvas.width = 50;
+var g = ctx.createLinearGradient(0, 0, 100, 0);
+g.addColorStop(0, '#0f0');
+g.addColorStop(1, '#0f0');
+canvas.width = 100;
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = g;
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_initial.reset.path.html ]]] -->
+
+<p>Canvas test: initial.reset.path</p>
+<!-- Testing: Resetting the canvas state resets the current path -->
+<canvas id="c631" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_initial_reset_path() {
+
+var canvas = document.getElementById('c631');
+var ctx = canvas.getContext('2d');
+
+canvas.width = 100;
+ctx.rect(0, 0, 100, 50);
+canvas.width = 100;
+ctx.fillStyle = '#f00';
+ctx.fill();
+isPixel(ctx, 20,20, 0,0,0,0, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_initial.reset.pattern.html ]]] -->
+
+<p>Canvas test: initial.reset.pattern</p>
+<!-- Testing: Resetting the canvas state does not invalidate any existing patterns -->
+<canvas id="c632" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_initial_reset_pattern() {
+
+var canvas = document.getElementById('c632');
+var ctx = canvas.getContext('2d');
+
+canvas.width = 50;
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 50, 50);
+var p = ctx.createPattern(canvas, 'repeat-x');
+canvas.width = 100;
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = p;
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_initial.reset.same.html ]]] -->
+
+<p>Canvas test: initial.reset.same</p>
+<!-- Testing: Setting size (not changing the value) resets canvas to transparent black -->
+<canvas id="c633" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_initial_reset_same() {
+
+var canvas = document.getElementById('c633');
+var ctx = canvas.getContext('2d');
+
+canvas.width = 100;
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 50, 50);
+isPixel(ctx, 20,20, 255,0,0,255, 0);
+canvas.width = 100;
+isPixel(ctx, 20,20, 0,0,0,0, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_initial.reset.transform.html ]]] -->
+
+<p>Canvas test: initial.reset.transform</p>
+<!-- Testing: Resetting the canvas state resets the current transformation matrix -->
+<canvas id="c634" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_initial_reset_transform() {
+
+var canvas = document.getElementById('c634');
+var ctx = canvas.getContext('2d');
+
+canvas.width = 100;
+ctx.scale(0, 0);
+canvas.width = 100;
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 20,20, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_size.attributes.default.html ]]] -->
+
+<p>Canvas test: size.attributes.default</p>
+<!-- Testing: Default width/height -->
+<canvas id="c635" ><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_size_attributes_default() {
+
+var canvas = document.getElementById('c635');
+var ctx = canvas.getContext('2d');
+
+ok(canvas.width == 300, "canvas.width == 300");
+ok(canvas.height == 150, "canvas.height == 150");
+ok(!canvas.hasAttribute('width'), "!canvas.hasAttribute('width')");
+ok(!canvas.hasAttribute('height'), "!canvas.hasAttribute('height')");
+
+
+}
+</script>
+
+<!-- [[[ test_size.attributes.html ]]] -->
+
+<p>Canvas test: size.attributes</p>
+<!-- Testing: width/height DOM attributes and content attributes -->
+<canvas id="c636" width="120" height="60"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_size_attributes() {
+
+var canvas = document.getElementById('c636');
+var ctx = canvas.getContext('2d');
+
+ok(canvas.width == 120, "canvas.width == 120");
+ok(canvas.height == 60, "canvas.height == 60");
+ok(canvas.getAttribute('width') == 120, "canvas.getAttribute('width') == 120");
+ok(canvas.getAttribute('height') == 60, "canvas.getAttribute('height') == 60");
+
+
+}
+</script>
+
+<!-- [[[ test_size.attributes.parse.badsuffix.html ]]] -->
+
+<p>Canvas test: size.attributes.parse.badsuffix</p>
+<!-- Testing: Parsing of non-negative integers -->
+<canvas id="c637" width="100foo" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_size_attributes_parse_badsuffix() {
+
+var canvas = document.getElementById('c637');
+var ctx = canvas.getContext('2d');
+
+is(canvas.width, 100, "canvas.width == 100");
+
+
+}
+</script>
+
+<!-- [[[ test_size.attributes.parse.floatsuffix.html ]]] -->
+
+<p>Canvas test: size.attributes.parse.floatsuffix</p>
+<!-- Testing: Parsing of non-negative integers -->
+<canvas id="c638" width="100.9" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_size_attributes_parse_floatsuffix() {
+
+var canvas = document.getElementById('c638');
+var ctx = canvas.getContext('2d');
+
+ok(canvas.width == 100, "canvas.width == 100");
+
+
+}
+</script>
+
+<!-- [[[ test_size.attributes.parse.negative.html ]]] -->
+
+<p>Canvas test: size.attributes.parse.negative</p>
+<!-- Testing: Parsing of non-negative integers -->
+<canvas id="c639" width="-100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_size_attributes_parse_negative() {
+
+var canvas = document.getElementById('c639');
+var ctx = canvas.getContext('2d');
+
+ok(canvas.width == 300, "canvas.width == 300");
+
+
+}
+</script>
+
+<!-- [[[ test_size.attributes.parse.nonnumber.html ]]] -->
+
+<p>Canvas test: size.attributes.parse.nonnumber</p>
+<!-- Testing: Parsing of non-negative integers -->
+<canvas id="c640" width="foo" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_size_attributes_parse_nonnumber() {
+
+var canvas = document.getElementById('c640');
+var ctx = canvas.getContext('2d');
+
+ok(canvas.width == 300, "canvas.width == 300");
+
+
+}
+</script>
+
+<!-- [[[ test_size.attributes.parse.percentsuffix.html ]]] -->
+
+<p>Canvas test: size.attributes.parse.percentsuffix</p>
+<!-- Testing: Parsing of non-negative integers -->
+<canvas id="c641" width="100%" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_size_attributes_parse_percentsuffix() {
+
+var canvas = document.getElementById('c641');
+var ctx = canvas.getContext('2d');
+
+ok(canvas.width == 100, "canvas.width == 100");
+
+
+}
+</script>
+
+<!-- [[[ test_size.attributes.parse.whitespace.html ]]] -->
+
+<p>Canvas test: size.attributes.parse.whitespace</p>
+<!-- Testing: Parsing of non-negative integers -->
+<canvas id="c642" width=" 100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_size_attributes_parse_whitespace() {
+
+var canvas = document.getElementById('c642');
+var ctx = canvas.getContext('2d');
+
+ok(canvas.width == 100, "canvas.width == 100");
+
+
+}
+</script>
+
+<!-- [[[ test_size.attributes.parse.zero.html ]]] -->
+
+<p>Canvas test: size.attributes.parse.zero</p>
+<!-- Testing: Parsing of non-negative integers -->
+<canvas id="c643" width="0" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_size_attributes_parse_zero() {
+
+var canvas = document.getElementById('c643');
+var ctx = canvas.getContext('2d');
+
+ok(canvas.width == 0, "canvas.width == 0");
+
+
+}
+</script>
+
+<!-- [[[ test_size.attributes.parse.zerosuffix.html ]]] -->
+
+<p>Canvas test: size.attributes.parse.zerosuffix</p>
+<!-- Testing: Parsing of non-negative integers -->
+<canvas id="c644" width="100.0" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_size_attributes_parse_zerosuffix() {
+
+var canvas = document.getElementById('c644');
+var ctx = canvas.getContext('2d');
+
+ok(canvas.width == 100, "canvas.width == 100");
+
+
+}
+</script>
+
+<!-- [[[ test_size.attributes.reflect.1.html ]]] -->
+
+<p>Canvas test: size.attributes.reflect.1</p>
+<!-- Testing: Setting DOM attributes updates DOM and content attributes -->
+<canvas id="c645" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_size_attributes_reflect_1() {
+
+var canvas = document.getElementById('c645');
+var ctx = canvas.getContext('2d');
+
+canvas.width = 120;
+canvas.height = 60;
+ok(canvas.getAttribute('width') == '120', "canvas.getAttribute('width') == '120'");
+ok(canvas.getAttribute('height') == '60', "canvas.getAttribute('height') == '60'");
+ok(canvas.width == 120, "canvas.width == 120");
+ok(canvas.height == 60, "canvas.height == 60");
+
+
+}
+</script>
+
+<!-- [[[ test_size.attributes.reflect.2.html ]]] -->
+
+<p>Canvas test: size.attributes.reflect.2</p>
+<!-- Testing: Setting content attributes updates DOM and content attributes -->
+<canvas id="c646" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_size_attributes_reflect_2() {
+
+var canvas = document.getElementById('c646');
+var ctx = canvas.getContext('2d');
+
+canvas.setAttribute('width', '120');
+canvas.setAttribute('height', '60');
+ok(canvas.getAttribute('width') == '120', "canvas.getAttribute('width') == '120'");
+ok(canvas.getAttribute('height') == '60', "canvas.getAttribute('height') == '60'");
+ok(canvas.width == 120, "canvas.width == 120");
+ok(canvas.height == 60, "canvas.height == 60");
+
+
+}
+</script>
+
+<!-- [[[ test_size.attributes.removed.html ]]] -->
+
+<p>Canvas test: size.attributes.removed</p>
+<!-- Testing: Removing content attributes reverts to default size -->
+<canvas id="c647" width="120" height="60"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_size_attributes_removed() {
+
+var canvas = document.getElementById('c647');
+var ctx = canvas.getContext('2d');
+
+canvas.removeAttribute('width');
+ok(canvas.width == 300, "canvas.width == 300");
+
+
+}
+</script>
+
+<!-- [[[ test_size.attributes.setAttribute.badsuffix.html ]]] -->
+
+<p>Canvas test: size.attributes.setAttribute.badsuffix</p>
+<!-- Testing: Parsing of non-negative integers in setAttribute -->
+<canvas id="c648" width="50" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_size_attributes_setAttribute_badsuffix() {
+
+var canvas = document.getElementById('c648');
+var ctx = canvas.getContext('2d');
+
+canvas.setAttribute('width', '100foo');
+is(canvas.width, 100, "canvas.width == 100");
+
+
+}
+</script>
+
+<!-- [[[ test_size.attributes.setAttribute.floatsuffix.html ]]] -->
+
+<p>Canvas test: size.attributes.setAttribute.floatsuffix</p>
+<!-- Testing: Parsing of non-negative integers in setAttribute -->
+<canvas id="c649" width="50" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_size_attributes_setAttribute_floatsuffix() {
+
+var canvas = document.getElementById('c649');
+var ctx = canvas.getContext('2d');
+
+canvas.setAttribute('width', '1');
+canvas.setAttribute('width', '100.9');
+ok(canvas.width == 100, "canvas.width == 100");
+
+
+}
+</script>
+
+<!-- [[[ test_size.attributes.setAttribute.negative.html ]]] -->
+
+<p>Canvas test: size.attributes.setAttribute.negative</p>
+<!-- Testing: Parsing of non-negative integers in setAttribute -->
+<canvas id="c650" width="50" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_size_attributes_setAttribute_negative() {
+
+var canvas = document.getElementById('c650');
+var ctx = canvas.getContext('2d');
+
+canvas.setAttribute('width', '-100');
+ok(canvas.width == 300, "canvas.width == 300");
+
+
+}
+</script>
+
+<!-- [[[ test_size.attributes.setAttribute.nonnumber.html ]]] -->
+
+<p>Canvas test: size.attributes.setAttribute.nonnumber</p>
+<!-- Testing: Parsing of non-negative integers in setAttribute -->
+<canvas id="c651" width="50" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_size_attributes_setAttribute_nonnumber() {
+
+var canvas = document.getElementById('c651');
+var ctx = canvas.getContext('2d');
+
+canvas.setAttribute('width', 'foo');
+ok(canvas.width == 300, "canvas.width == 300");
+
+
+}
+</script>
+
+<!-- [[[ test_size.attributes.setAttribute.percentsuffix.html ]]] -->
+
+<p>Canvas test: size.attributes.setAttribute.percentsuffix</p>
+<!-- Testing: Parsing of non-negative integers in setAttribute -->
+<canvas id="c652" width="50" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_size_attributes_setAttribute_percentsuffix() {
+
+var canvas = document.getElementById('c652');
+var ctx = canvas.getContext('2d');
+
+canvas.setAttribute('width', '100%');
+ok(canvas.width == 100, "canvas.width == 100");
+
+
+}
+</script>
+
+<!-- [[[ test_size.attributes.setAttribute.whitespace.html ]]] -->
+
+<p>Canvas test: size.attributes.setAttribute.whitespace</p>
+<!-- Testing: Parsing of non-negative integers in setAttribute -->
+<canvas id="c653" width="50" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_size_attributes_setAttribute_whitespace() {
+
+var canvas = document.getElementById('c653');
+var ctx = canvas.getContext('2d');
+
+canvas.setAttribute('width', ' 100');
+ok(canvas.width == 100, "canvas.width == 100");
+
+
+}
+</script>
+
+<!-- [[[ test_size.attributes.setAttribute.zero.html ]]] -->
+
+<p>Canvas test: size.attributes.setAttribute.zero</p>
+<!-- Testing: Parsing of non-negative integers in setAttribute -->
+<canvas id="c654" width="50" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_size_attributes_setAttribute_zero() {
+
+var canvas = document.getElementById('c654');
+var ctx = canvas.getContext('2d');
+
+canvas.setAttribute('width', '0');
+ok(canvas.width == 0, "canvas.width == 0");
+
+
+}
+</script>
+
+<!-- [[[ test_size.attributes.setAttribute.zerosuffix.html ]]] -->
+
+<p>Canvas test: size.attributes.setAttribute.zerosuffix</p>
+<!-- Testing: Parsing of non-negative integers in setAttribute -->
+<canvas id="c655" width="50" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_size_attributes_setAttribute_zerosuffix() {
+
+var canvas = document.getElementById('c655');
+var ctx = canvas.getContext('2d');
+
+canvas.setAttribute('width', '1');
+canvas.setAttribute('width', '100.0');
+ok(canvas.width == 100, "canvas.width == 100");
+
+
+}
+</script>
+
+<!-- [[[ test_size.attributes.style.html ]]] -->
+
+<p>Canvas test: size.attributes.style</p>
+<!-- Testing: Canvas size is independent of CSS resizing -->
+<canvas id="c656" width="50" height="30" style="width: 100px; height: 50px"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_size_attributes_style() {
+
+var canvas = document.getElementById('c656');
+var ctx = canvas.getContext('2d');
+
+ok(canvas.width == 50, "canvas.width == 50");
+ok(canvas.height == 30, "canvas.height == 30");
+
+
+}
+</script>
+
+<!-- [[[ test_size.attributes.type.get.html ]]] -->
+
+<p>Canvas test: size.attributes.type.get</p>
+<!-- Testing: width/height DOM/content attributes - string vs number types -->
+<canvas id="c657" width="120" height="60"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_size_attributes_type_get() {
+
+var canvas = document.getElementById('c657');
+var ctx = canvas.getContext('2d');
+
+ok(canvas.width === 120, "canvas.width === 120");
+ok(canvas.height === 60, "canvas.height === 60");
+ok(canvas.getAttribute('width') === '120', "canvas.getAttribute('width') === '120'");
+ok(canvas.getAttribute('height') === '60', "canvas.getAttribute('height') === '60'");
+
+
+}
+</script>
+
+<!-- [[[ test_size.attributes.type.set.html ]]] -->
+
+<p>Canvas test: size.attributes.type.set</p>
+<!-- Testing: Setting width/height DOM attributes -->
+<canvas id="c658" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_size_attributes_type_set() {
+
+var canvas = document.getElementById('c658');
+var ctx = canvas.getContext('2d');
+
+canvas.width = 120;
+canvas.height = 60;
+ok(canvas.width === 120, "canvas.width === 120");
+ok(canvas.height === 60, "canvas.height === 60");
+
+
+}
+</script>
+
+<!-- [[[ test_text.font.html ]]] -->
+
+<p>Canvas test: text.font</p>
+<canvas id="c659" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+var _deferred = true;
+
+function test_text_font() {
+
+var canvas = document.getElementById('c659');
+var ctx = canvas.getContext('2d');
+
+is(ctx.font, '10px sans-serif', "default font is not '10px sans-serif'");
+
+ctx.save();
+ctx.font = '18pt serif';
+is(ctx.font, '24px serif', 'font getter returns incorrect value');
+
+ctx.restore();
+is(ctx.font, '10px sans-serif', 'font not being stored in the context state');
+
+if (!_deferred) SimpleTest.finish();
+}
+</script>
+
+<!-- [[[ test_text.measure.html ]]] -->
+
+<p>Canvas test: text.measure</p>
+<canvas id="c660" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+var _deferred = true;
+
+function test_text_measure() {
+
+var canvas = document.getElementById('c660');
+var ctx = canvas.getContext('2d');
+
+ctx.font = "10px sans-serif";
+ctx.textAlign = "left";
+ctx.textBaseline = "top";
+
+var str = 'Test String';
+var wid = ctx.measureText(str).width;
+
+ok(wid > 0, "measureText returns nonpositive value for non-empty string");
+
+ctx.font = "20px sans-serif";
+isnot(wid, ctx.measureText(str).width, "measureText does not change with a different font size");
+
+ctx.font = "10px sans-serif";
+ctx.textAlign = "center";
+ctx.textBaseline = "alphabetic";
+
+is(wid, ctx.measureText(str).width, "measureText changes when alignement/baseline is changed");
+
+
+if (!_deferred) SimpleTest.finish();
+}
+</script>
+
+<!-- [[[ test_text.space.replace.html ]]] -->
+
+<p>Canvas test: text.space.replace</p>
+<canvas id="c661" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+var _deferred = true;
+
+function test_text_space_replace() {
+
+var canvas = document.getElementById('c661');
+var ctx = canvas.getContext('2d');
+
+var swid = ctx.measureText(' ').width;
+ctx.font = "10px sans-serif";
+
+isnot(swid, 0.0, "measureText reutuns zero for a non-empty string");
+is(swid, ctx.measureText('\x09').width, "measureText does not replace whitespace char with a space");
+is(swid, ctx.measureText('\x0A').width, "measureText does not replace whitespace char with a space");
+is(swid, ctx.measureText('\x0B').width, "measureText does not replace whitespace char with a space");
+is(swid, ctx.measureText('\x0C').width, "measureText does not replace whitespace char with a space");
+is(swid, ctx.measureText('\x0D').width, "measureText does not replace whitespace char with a space");
+
+if (!_deferred) SimpleTest.finish();
+}
+</script>
+
+<!-- [[[ test_text.textAlign.html ]]] -->
+
+<p>Canvas test: text.textAlign</p>
+<canvas id="c662" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+var _deferred = true;
+
+function test_text_textAlign() {
+
+var canvas = document.getElementById('c662');
+var ctx = canvas.getContext('2d');
+
+is(ctx.textAlign, 'start', "default textAlign is not 'start'");
+
+ctx.save();
+ctx.textAlign = 'end';
+is(ctx.textAlign, 'end', 'textAlign getter returns incorrect value');
+
+ctx.save();
+ctx.textAlign = 'left';
+is(ctx.textAlign, 'left', 'textAlign getter returns incorrect value');
+
+ctx.save();
+ctx.textAlign = 'center';
+is(ctx.textAlign, 'center', 'textAlign getter returns incorrect value');
+
+ctx.save();
+ctx.textAlign = 'right';
+is(ctx.textAlign, 'right', 'textAlign getter returns incorrect value');
+
+ctx.save();
+ctx.textAlign = 'start';
+is(ctx.textAlign, 'start', 'textAlign getter returns incorrect value');
+
+ctx.restore();
+is(ctx.textAlign, 'right', 'textAlign not being stored in the context state');
+
+ctx.restore();
+is(ctx.textAlign, 'center', 'textAlign not being stored in the context state');
+
+ctx.restore();
+is(ctx.textAlign, 'left', 'textAlign not being stored in the context state');
+
+ctx.restore();
+is(ctx.textAlign, 'end', 'textAlign not being stored in the context state');
+
+ctx.restore();
+is(ctx.textAlign, 'start', 'textAlign not being stored in the context state');
+
+if (!_deferred) SimpleTest.finish();
+}
+</script>
+
+<!-- [[[ test_text.textBaseline.html ]]] -->
+
+<p>Canvas test: text.textBaseline</p>
+<canvas id="c663" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+var _deferred = true;
+
+function test_text_textBaseline() {
+
+var canvas = document.getElementById('c663');
+var ctx = canvas.getContext('2d');
+
+is(ctx.textBaseline, 'alphabetic', "default textBaseline is not 'alphabetic'");
+
+ctx.save();
+ctx.textBaseline = 'ideographic';
+is(ctx.textBaseline, 'ideographic', 'textBaseline getter returns incorrect value');
+
+ctx.save();
+ctx.textBaseline = 'top';
+is(ctx.textBaseline, 'top', 'textBaseline getter returns incorrect value');
+
+ctx.save();
+ctx.textBaseline = 'middle';
+is(ctx.textBaseline, 'middle', 'textBaseline getter returns incorrect value');
+
+ctx.save();
+ctx.textBaseline = 'bottom';
+is(ctx.textBaseline, 'bottom', 'textBaseline getter returns incorrect value');
+
+ctx.save();
+ctx.textBaseline = 'hanging';
+is(ctx.textBaseline, 'hanging', 'textBaseline getter returns incorrect value');
+
+ctx.save();
+ctx.textBaseline = 'alphabetic';
+is(ctx.textBaseline, 'alphabetic', 'textBaseline getter returns incorrect value');
+
+ctx.restore();
+is(ctx.textBaseline, 'hanging', 'textBaseline not being stored in the context state');
+
+ctx.restore();
+is(ctx.textBaseline, 'bottom', 'textBaseline not being stored in the context state');
+
+ctx.restore();
+is(ctx.textBaseline, 'middle', 'textBaseline not being stored in the context state');
+
+ctx.restore();
+is(ctx.textBaseline, 'top', 'textBaseline not being stored in the context state');
+
+ctx.restore();
+is(ctx.textBaseline, 'ideographic', 'textBaseline not being stored in the context state');
+
+ctx.restore();
+is(ctx.textBaseline, 'alphabetic', 'textBaseline not being stored in the context state');
+
+if (!_deferred) SimpleTest.finish();
+}
+</script>
+
+<!-- [[[ test_toDataURL.arguments.1.html ]]] -->
+
+<p>Canvas test: toDataURL.arguments.1 - bug 401795</p>
+<!-- Testing: toDataURL ignores extra arguments -->
+<canvas id="c664" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_toDataURL_arguments_1() {
+
+var canvas = document.getElementById('c664');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+var data = canvas.toDataURL('image/png', 'another argument that should not raise an exception');
+ok(/^data:image\/png[;,]/.test(data), "data =~ /^data:image\\/png[;,]/");
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_toDataURL.arguments.2.html ]]] -->
+
+<p>Canvas test: toDataURL.arguments.2 - bug 401795</p>
+<!-- Testing: toDataURL ignores extra arguments -->
+<canvas id="c665" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_toDataURL_arguments_2() {
+
+var canvas = document.getElementById('c665');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+var data = canvas.toDataURL('image/png', 'another argument that should not raise an exception', 'and another');
+ok(/^data:image\/png[;,]/.test(data), "data =~ /^data:image\\/png[;,]/");
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_toDataURL.arguments.3.html ]]] -->
+
+<p>Canvas test: toDataURL.arguments.3 - bug 401795</p>
+<!-- Testing: toDataURL ignores extra arguments -->
+<canvas id="c666" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_toDataURL_arguments_3() {
+
+var canvas = document.getElementById('c666');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+// More arguments that should not raise exceptions
+var data = canvas.toDataURL('image/png', null, null, null);
+ok(/^data:image\/png[;,]/.test(data), "data =~ /^data:image\\/png[;,]/");
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_toDataURL.complexcolours.html ]]] -->
+
+<p>Canvas test: toDataURL.complexcolours</p>
+<!-- Testing: toDataURL handles non-primary and non-solid colours correctly -->
+<canvas id="c667" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+var canvas667 = document.getElementById('c667');
+var ctx667 = canvas667.getContext('2d');
+
+function test_toDataURL_complexcolours() {
+
+// (These values are chosen to survive relatively alright through being premultiplied)
+ctx667.fillStyle = 'rgba(1, 3, 254, 1)';
+ctx667.fillRect(0, 0, 25, 25);
+ctx667.fillStyle = 'rgba(8, 252, 248, 0.75)';
+ctx667.fillRect(25, 0, 25, 25);
+ctx667.fillStyle = 'rgba(6, 10, 250, 0.502)';
+ctx667.fillRect(50, 0, 25, 25);
+ctx667.fillStyle = 'rgba(12, 16, 244, 0.25)';
+ctx667.fillRect(75, 0, 25, 25);
+var img = new Image();
+deferTest();
+img.onload = wrapFunction(function ()
+{
+ ctx667.drawImage(img, 0, 25);
+ // (The alpha values do not really survive float->int conversion, so just
+ // do approximate comparisons)
+ isPixel(ctx667, 12,40, 1,3,254,255, 0);
+ isPixel(ctx667, 37,40, 8,252,248,191, 2);
+ isPixel(ctx667, 62,40, 6,10,250,127, 4);
+ isPixel(ctx667, 87,40, 12,16,244,63, 8);
+});
+img.src = canvas667.toDataURL();
+
+
+}
+</script>
+
+<!-- [[[ test_toDataURL.default.html ]]] -->
+
+<p>Canvas test: toDataURL.default</p>
+<!-- Testing: toDataURL with no arguments returns a PNG -->
+<canvas id="c668" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_toDataURL_default() {
+
+var canvas = document.getElementById('c668');
+var ctx = canvas.getContext('2d');
+
+var data = canvas.toDataURL();
+ok(/^data:image\/png[;,]/.test(data), "data =~ /^data:image\\/png[;,]/");
+
+
+}
+</script>
+
+<!-- [[[ test_toDataURL.lowercase.html ]]] -->
+
+<p>Canvas test: toDataURL.lowercase - bug 401795</p>
+<!-- Testing: toDataURL type is case-sensitive -->
+<canvas id="c669" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_toDataURL_lowercase() {
+
+var canvas = document.getElementById('c669');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+var data = canvas.toDataURL('ImAgE/PnG');
+ok(/^data:image\/png[;,]/.test(data), "data =~ /^data:image\\/png[;,]/");
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_toDataURL.nocontext.html ]]] -->
+
+<p>Canvas test: toDataURL.nocontext</p>
+<!-- Testing: toDataURL works before any context has been got -->
+<canvas id="c670" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_toDataURL_nocontext() {
+
+var canvas = document.getElementById('c670');
+var ctx = canvas.getContext('2d');
+
+var canvas2 = document.createElement('canvas');
+
+var data = canvas2.toDataURL();
+ok(/^data:image\/png[;,]/.test(data), "data =~ /^data:image\\/png[;,]/");
+
+
+}
+</script>
+
+<!-- [[[ test_toDataURL.png.html ]]] -->
+
+<p>Canvas test: toDataURL.png</p>
+<!-- Testing: toDataURL with image/png returns a PNG -->
+<canvas id="c671" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_toDataURL_png() {
+
+var canvas = document.getElementById('c671');
+var ctx = canvas.getContext('2d');
+
+var data = canvas.toDataURL('image/png');
+ok(/^data:image\/png[;,]/.test(data), "data =~ /^data:image\\/png[;,]/");
+
+
+}
+</script>
+
+<!-- [[[ test_toDataURL.primarycolours.html ]]] -->
+
+<p>Canvas test: toDataURL.primarycolours</p>
+<!-- Testing: toDataURL handles simple colours correctly -->
+<canvas id="c672" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+var canvas672 = document.getElementById('c672');
+var ctx672 = canvas672.getContext('2d');
+
+function test_toDataURL_primarycolours() {
+
+ctx672.fillStyle = '#ff0';
+ctx672.fillRect(0, 0, 25, 40);
+ctx672.fillStyle = '#0ff';
+ctx672.fillRect(25, 0, 50, 40);
+ctx672.fillStyle = '#00f';
+ctx672.fillRect(75, 0, 25, 40);
+ctx672.fillStyle = '#fff';
+ctx672.fillRect(0, 40, 100, 10);
+var data = canvas672.toDataURL();
+ctx672.fillStyle = '#f00';
+ctx672.fillRect(0, 0, 100, 50);
+var img = new Image();
+deferTest();
+img.onload = wrapFunction(function ()
+{
+ ctx672.drawImage(img, 0, 0);
+ isPixel(ctx672, 12,20, 255,255,0,255, 0);
+ isPixel(ctx672, 50,20, 0,255,255,255, 0);
+ isPixel(ctx672, 87,20, 0,0,255,255, 0);
+ isPixel(ctx672, 50,45, 255,255,255,255, 0);
+});
+img.src = data;
+
+
+}
+</script>
+
+<!-- [[[ test_toDataURL.unrecognised.html ]]] -->
+
+<p>Canvas test: toDataURL.unrecognised - bug 401795</p>
+<!-- Testing: toDataURL with an unhandled type returns a PNG -->
+<canvas id="c673" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_toDataURL_unrecognised() {
+
+var canvas = document.getElementById('c673');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+var data = canvas.toDataURL('image/example');
+ok(/^data:image\/png[;,]/.test(data), "data =~ /^data:image\\/png[;,]/");
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+<!-- [[[ test_toDataURL.zerosize.html ]]] -->
+
+<p>Canvas test: toDataURL.zerosize</p>
+<!-- Testing: toDataURL on zero-size canvas returns 'data:,' -->
+<canvas id="c674" width="0" height="0"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_toDataURL_zerosize() {
+
+var canvas = document.getElementById('c674');
+var ctx = canvas.getContext('2d');
+
+var data = canvas.toDataURL();
+ok(data === 'data:,', "data === 'data:,'");
+
+
+}
+</script>
+
+<!-- [[[ test_type.exists.html ]]] -->
+
+<p>Canvas test: type.exists</p>
+<!-- Testing: HTMLCanvasElement is a property of window -->
+<canvas id="c676" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_type_exists() {
+
+var canvas = document.getElementById('c676');
+var ctx = canvas.getContext('2d');
+
+ok(window.HTMLCanvasElement, "window.HTMLCanvasElement");
+
+
+}
+</script>
+
+<!-- [[[ test_type.extend.html ]]] -->
+
+<p>Canvas test: type.extend</p>
+<!-- Testing: HTMLCanvasElement methods can be added, and the new methods used by canvases -->
+<canvas id="c677" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_type_extend() {
+
+var canvas = document.getElementById('c677');
+var ctx = canvas.getContext('2d');
+
+window.HTMLCanvasElement.prototype.getZero = function () { return 0; };
+ok(canvas.getZero() === 0, "canvas.getZero() === 0");
+
+
+}
+</script>
+
+<!-- [[[ test_type.name.html ]]] -->
+
+<p>Canvas test: type.name</p>
+<!-- Testing: HTMLCanvasElement type and toString -->
+<canvas id="c678" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_type_name() {
+
+var canvas = document.getElementById('c678');
+var ctx = canvas.getContext('2d');
+
+ok(Object.prototype.toString.call(canvas) === '[object HTMLCanvasElement]', "Object.prototype.toString.call(canvas) === '[object HTMLCanvasElement]'");
+
+
+}
+</script>
+
+<!-- [[[ test_type.prototype.html ]]] -->
+
+<p>Canvas test: type.prototype</p>
+<!-- Testing: window.HTMLCanvasElement has prototype, which is { ReadOnly, DontDelete }. prototype has getContext, which is not -->
+<canvas id="c679" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_type_prototype() {
+
+var canvas = document.getElementById('c679');
+var ctx = canvas.getContext('2d');
+
+ok(window.HTMLCanvasElement.prototype, "window.HTMLCanvasElement.prototype");
+ok(window.HTMLCanvasElement.prototype.getContext, "window.HTMLCanvasElement.prototype.getContext");
+window.HTMLCanvasElement.prototype = null;
+ok(window.HTMLCanvasElement.prototype, "window.HTMLCanvasElement.prototype");
+delete window.HTMLCanvasElement.prototype;
+ok(window.HTMLCanvasElement.prototype, "window.HTMLCanvasElement.prototype");
+var getContext = window.HTMLCanvasElement.prototype.getContext;
+window.HTMLCanvasElement.prototype.getContext = 1;
+ok(window.HTMLCanvasElement.prototype.getContext === 1, "window.HTMLCanvasElement.prototype.getContext === 1");
+delete window.HTMLCanvasElement.prototype.getContext;
+ok(window.HTMLCanvasElement.prototype.getContext === undefined, "window.HTMLCanvasElement.prototype.getContext === undefined");
+window.HTMLCanvasElement.prototype.getContext = getContext;
+
+
+}
+</script>
+
+<!-- [[[ test_type.replace.html ]]] -->
+
+<p>Canvas test: type.replace</p>
+<!-- Testing: HTMLCanvasElement methods can be replaced, and the replacement methods used by canvases -->
+<canvas id="c680" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_type_replace() {
+
+var canvas = document.getElementById('c680');
+var ctx = canvas.getContext('2d');
+
+var getContext = window.HTMLCanvasElement.prototype.getContext;
+window.HTMLCanvasElement.prototype.getContext = function (name) { return 0; };
+ok(canvas.getContext('2d') === 0, "canvas.getContext('2d') === 0");
+window.HTMLCanvasElement.prototype.getContext = getContext;
+
+
+}
+</script>
+
+<!-- [[[ test_2d.imagedata_coercion.html ]]] -->
+
+<p>Canvas test: 2d.imagedata_coercion</p>
+<!-- Testing: imagedata coerced correctly on set -->
+<canvas id="c681" width="100" height="1"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+/* NOTE: Due to round-tripping through premultiplied values and the rounding
+that ensues, values of alpha < 255 will tend to do weird things. In
+particular, the premultiplied color values are computed by multiplying by a,
+dividing by 255, then always rounding up. The conversion the other way is done
+by multiplying by 255/a and rounding down. So if
+
+ 255/a * (amount added when rounding) > 1
+
+we will get a change in value when we go through a putImageData/getImageData cycle. Therefore, to make sure we don't have to worry about our color
+channels, our alpha channel should never be < 250, unless it's 0. And when it's 0, all our color channels will come back as 0 too. */
+
+/* Our tests. Each test has two arrays: the array of values to set and the
+ array of values that should read back as a result. */
+var tests = [
+ [
+ [ 0, 1, 3, 250 ], [ 0, 1, 3, 250 ]
+ ],
+ [
+ [ 0, 1, 2, 250, 4, 5, 6, 250 ], [ 0, 1, 2, 250, 4, 5, 6, 250 ]
+ ],
+ [
+ [ 0, 1000, 2, 300, 400, 5, 600, 250 ], [ 0, 255, 2, 255, 255, 5, 255, 250 ]
+ ],
+ [
+ [ -10, -5, NaN, 250, 4, 5, 6, -250 ], [ 0, 0, 0, 250, 0, 0, 0, 0 ]
+ ],
+ [
+ [ 0.5, 12.2, 12.8, 251.5, 12.5, 13.5, 13.2, 250.5 ],
+ [ 0, 12, 13, 252, 12, 14, 13, 250 ]
+ ]
+];
+
+function doTest(type, idx) {
+ var testPair = tests[idx];
+ var test = testPair[0];
+ var ref = testPair[1];
+ var descSuffix = " for " + type + " test #" + (idx+1);
+ function myIs(a, b, str) {
+ is(a, b, str + descSuffix);
+ }
+
+ myIs(test.length, ref.length, "Length mismatch");
+ myIs(test.length % 4, 0, "Length not a multiple of 4");
+ var pixels = test.length / 4;
+ var imageData = ctx681.createImageData(pixels, 1);
+ myIs(imageData.width, pixels, "Incorrect created data width");
+ myIs(imageData.height, 1, "Incorrect created data height");
+ myIs(imageData.data.length, test.length,
+ "Incorrect length in created image data");
+
+ ctx681.putImageData(imageData, 0, 0);
+ var testImageData = ctx681.getImageData(0, 0, pixels, 1);
+ myIs(testImageData.data.length, test.length,
+ "Incorrect length in test image data after clearing pixels");
+ var j;
+ for (j = 0; j < testImageData.data.length; ++j) {
+ myIs(testImageData.data[j], 0,
+ "Nonzero value at position " + j + " in test image data " +
+ "after clearing pixels");
+ }
+ for (j = 0; j < imageData.data.length; ++j) {
+ imageData.data[j] = test[j];
+ }
+ if (type == "slow") {
+ // convert to a non-dense array so we can test that codepath
+ imageData.data.makeMeSlow = 1;
+ }
+ ctx681.putImageData(imageData, 0, 0);
+ testImageData = ctx681.getImageData(0, 0, pixels, 1);
+ myIs(testImageData.data.length, test.length,
+ "Incorrect length in test image data after putting our imagedata");
+ for (j = 0; j < testImageData.data.length; ++j) {
+ myIs(testImageData.data[j], ref[j],
+ "Incorrect value at position " + j + " in test image data " +
+ "after putting our imagedata");
+ }
+}
+
+function doTests(type) {
+ for (var i = 0; i < tests.length; ++i) {
+ doTest(type, i);
+ }
+}
+
+var canvas681;
+var ctx681;
+
+function test_2d_imagedata_coercion() {
+
+canvas681 = document.getElementById('c681');
+ctx681 = canvas681.getContext('2d');
+
+doTests("fast");
+doTests("slow");
+
+}
+</script>
+
+<!-- [[[ test_2d.imageSmoothing.html ]]] -->
+
+<p>Canvas test: 2d.imageRenderingQuality</p>
+<canvas id="c682" width="10" height="10"></canvas><br>
+<canvas style="visibility: hidden" id="c683" width="2" height="2"></canvas>
+<script type="text/javascript">
+
+function setup_test_2d_imageSmoothing() {
+ var c683 = document.getElementById("c683");
+ var cx683 = c683.getContext("2d");
+
+ cx683.fillStyle = "red";
+ cx683.fillRect(0, 0, 2, 2);
+
+ cx683.fillStyle = "rgb(0,255,0)";
+ cx683.fillRect(0, 0, 1, 1);
+}
+
+function test_2d_imageSmoothing() {
+ setup_test_2d_imageSmoothing();
+
+ var c682 = document.getElementById("c682");
+ var c683 = document.getElementById("c683");
+
+ var cx682 = c682.getContext("2d");
+
+ ok(cx682.imageSmoothingEnabled == true, "initial imageSmoothingEnabled is true");
+
+ // check that imageSmoothingEnabled is part of the context
+ cx682.save();
+ cx682.imageSmoothingEnabled = false;
+ ok(cx682.imageSmoothingEnabled == false, "imageSmoothingEnabled is false after setting");
+ cx682.restore();
+ ok(cx682.imageSmoothingEnabled == true, "imageSmoothingEnabled is true after restore");
+
+ // check that false works
+ cx682.imageSmoothingEnabled = false;
+
+ cx682.scale(10,10);
+ cx682.drawImage(c683, 0, 0);
+
+ // this should be all red
+ var data = cx682.getImageData(9, 9, 1, 1);
+ var pixels = data.data;
+ ok (pixels[0] == 0 &&
+ pixels[1] == 255 &&
+ pixels[2] == 0 &&
+ pixels[3] == 255,
+ "pixel is [" + pixels.toString() + "] (expected [0,255,0,255])");
+}
+
+</script>
+
+<p>Canvas test: zero_dimensions</p>
+<canvas id="c684" width="0" height="0"></canvas>
+<script type="text/javascript">
+function test_zero_dimensions() {
+ var c = document.getElementById("c684");
+ ok(c.width == 0, "c.width not 0");
+ ok(c.height == 0, "c.height not 0");
+}
+</script>
+
+<p>Canvas test: zero_dimensions_image_data</p>
+<canvas id="c685" width="0" height="0"></canvas>
+<script type="text/javascript">
+function test_zero_dimensions_imagedata() {
+ var c = document.getElementById("c685");
+ var ctx = c.getContext("2d");
+ ctx.fillStyle = "blue";
+ ctx.fillRect(0, 0, 100, 100);
+ var imgdata = ctx.getImageData(0, 0, 100, 100);
+ var isTransparentBlack = true;
+ for (var i = 0; i < imgdata.data.length; ++i)
+ if (imgdata.data[i] !== 0)
+ isTransparentBlack = false;
+ ok(isTransparentBlack, "isTransparentBlack");
+}
+</script>
+
+<p>Canvas test: getImageData_after_zero_canvas</p>
+<canvas id="c686" width="100" height="100"></canvas>
+<script type="text/javascript">
+function test_getImageData_after_zero_canvas() {
+ var c = document.getElementById("c686");
+ var ctx = c.getContext("2d");
+ ctx.fillStyle = "rgba(0, 0, 0, 1.0)";
+ ctx.fillRect(0, 0, c.width, c.height);
+ var oldimgdata = ctx.getImageData(0, 0, c.width, c.height);
+ c.width = c.height = 0;
+ c.width = c.height = 100;
+ ctx.fillRect(0, 0, c.width, c.height);
+ var imgdata = ctx.getImageData(0, 0, c.width, c.height);
+ var same = false;
+ ok(imgdata.data.length === oldimgdata.data.length, "not the same length");
+ for (var i = 0; i < imgdata.data.length; ++i)
+ same = imgdata.data[i] === oldimgdata.data[i];
+ ok(same, "changing dimensions broke canvas");
+}
+</script>
+
+<p>Canvas test: test_opaque</p>
+<canvas id="c688" width="150" height="50"></canvas>
+<script type="text/javascript">
+
+function test_opaque() {
+ var c = document.getElementById("c688");
+ var ctx = c.getContext("2d", {alpha: false});
+ ctx.fillStyle = "green";
+ ctx.fillRect(0,0,10,10);
+ ctx.fillStyle = "rgba(255,0,0,.5)";
+ ctx.fillRect(10,0,10,10);
+
+ isPixel(ctx, 20, 20, 0, 0, 0, 255, 0);
+ isPixel(ctx, 5, 5, 0, 128, 0, 255, 0);
+ isPixel(ctx, 15, 5, 128, 0, 0, 255, 0);
+}
+</script>
+
+<p>Canvas test: 2d.transformation.transform.identity</p>
+<!-- Testing: resetTransform() changes to the identity matrix -->
+<canvas id="c689" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_transformation_reset_transform() {
+
+var canvas = document.getElementById('c689');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+
+ctx.setTransform(0.1, 0.0, 0.0, 0.1, 80.0, 30.0);
+ctx.resetTransform();
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+
+</script>
+
+<!-- [[[ test_2d.clearRect.testdoubleprecision.html ]]] -->
+
+<p>Canvas test: 2d.clearRect.testdoubleprecision</p>
+<canvas id="c690" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_clearRect_testdoubleprecision() {
+ var canvas = document.getElementById('c690');
+ ctx = canvas.getContext('2d');
+ ctx.setTransform(1, 1, 1, 1, 0, 0);
+ ctx.clearRect(-1.79e+308, 0, 1.79e+308, 8);
+}
+</script>
+
+<!-- [[[ test_2d.path.ellipse.angle.1.html ]]] -->
+
+<p>Canvas test: 2d.path.ellipse.angle.1</p>
+<!-- Testing: ellipse() draws pi/2 .. -pi anticlockwise correctly -->
+<canvas id="c690" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_ellipse_angle_1() {
+
+var canvas = document.getElementById('c690');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#f00';
+ctx.beginPath();
+ctx.moveTo(100, 0);
+ctx.ellipse(100, 0, 150, 100, 0, Math.PI/2, -Math.PI, true);
+ctx.fill();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.ellipse.angle.2.html ]]] -->
+
+<p>Canvas test: 2d.path.ellipse.angle.2</p>
+<!-- Testing: ellipse() draws -3pi/2 .. -pi anticlockwise correctly -->
+<canvas id="c691" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_ellipse_angle_2() {
+
+var canvas = document.getElementById('c691');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#f00';
+ctx.beginPath();
+ctx.moveTo(100, 0);
+ctx.ellipse(100, 0, 150, 100, 0, -3*Math.PI/2, -Math.PI, true);
+ctx.fill();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.ellipse.angle.3.html ]]] -->
+
+<p>Canvas test: 2d.path.ellipse.angle.3</p>
+<!-- Testing: ellipse() wraps angles mod 2pi when anticlockwise and end > start+2pi -->
+<canvas id="c692" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_ellipse_angle_3() {
+
+var canvas = document.getElementById('c692');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#f00';
+ctx.beginPath();
+ctx.moveTo(100, 0);
+ctx.ellipse(100, 0, 150, 100, 0, (512+1/2)*Math.PI, (1024-1)*Math.PI, true);
+ctx.fill();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.ellipse.angle.4.html ]]] -->
+
+<p>Canvas test: 2d.path.ellipse.angle.4</p>
+<!-- Testing: ellipse() draws a full circle when clockwise and end > start+2pi -->
+<canvas id="c693" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_ellipse_angle_4() {
+
+var canvas = document.getElementById('c693');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#0f0';
+ctx.beginPath();
+ctx.moveTo(50, 25);
+ctx.ellipse(50, 25, 60, 50, 0, (512+1/2)*Math.PI, (1024-1)*Math.PI, false);
+ctx.fill();
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.ellipse.angle.5.html ]]] -->
+
+<p>Canvas test: 2d.path.ellipse.angle.5</p>
+<!-- Testing: ellipse() wraps angles mod 2pi when clockwise and start > end+2pi -->
+<canvas id="c694" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_ellipse_angle_5() {
+
+var canvas = document.getElementById('c694');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#f00';
+ctx.beginPath();
+ctx.moveTo(100, 0);
+ctx.ellipse(100, 0, 150, 100, 0, (1024-1)*Math.PI, (512+1/2)*Math.PI, false);
+ctx.fill();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.ellipse.angle.6.html ]]] -->
+
+<p>Canvas test: 2d.path.ellipse.angle.6</p>
+<!-- Testing: ellipse() draws a full circle when anticlockwise and start > end+2pi -->
+<canvas id="c695" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_ellipse_angle_6() {
+
+var canvas = document.getElementById('c695');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.fillStyle = '#0f0';
+ctx.beginPath();
+ctx.moveTo(50, 25);
+ctx.ellipse(50, 25, 60, 50, 0, (1024-1)*Math.PI, (512+1/2)*Math.PI, true);
+ctx.fill();
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.ellipse.empty.html ]]] -->
+
+<p>Canvas test: 2d.path.ellipse.empty</p>
+<!-- Testing: ellipse() with an empty path does not draw a straight line to the start point -->
+<canvas id="c696" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_ellipse_empty() {
+
+var canvas = document.getElementById('c696');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 50;
+ctx.strokeStyle = '#f00';
+ctx.beginPath();
+ctx.ellipse(200, 25, 5, 5, 0, 0, 2*Math.PI, true);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.ellipse.end.html ]]] -->
+
+<p>Canvas test: 2d.path.ellipse.end</p>
+<!-- Testing: ellipse() adds the end point of the ellipse to the subpath -->
+<canvas id="c697" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_ellipse_end() {
+
+var canvas = document.getElementById('c697');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 50;
+ctx.strokeStyle = '#0f0';
+ctx.beginPath();
+ctx.moveTo(-100, 0);
+ctx.ellipse(-100, 0, 25, 25, 0, -Math.PI/2, Math.PI/2, true);
+ctx.lineTo(100, 25);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.ellipse.negative.html ]]] -->
+
+<p>Canvas test: 2d.path.ellipse.negative</p>
+<!-- Testing: ellipse() with negative radius throws INDEX_SIZE_ERR -->
+<canvas id="c698" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_ellipse_negative() {
+
+var canvas = document.getElementById('c698');
+var ctx = canvas.getContext('2d');
+
+var _thrown = undefined;
+try {
+ ctx.ellipse(0, 0, -1, 0, 0, -Math.PI/2, Math.PI/2, true);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
+
+try {
+ ctx.ellipse(0, 0, 0, -1, 0, -Math.PI/2, Math.PI/2, true);
+} catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.ellipse.nonempty.html ]]] -->
+
+<p>Canvas test: 2d.path.ellipse.nonempty</p>
+<!-- Testing: ellipse() with a non-empty path does draw a straight line to the start point -->
+<canvas id="c699" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_ellipse_nonempty() {
+
+var canvas = document.getElementById('c699');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 50;
+ctx.strokeStyle = '#0f0';
+ctx.beginPath();
+ctx.moveTo(0, 25);
+ctx.ellipse(200, 25, 5, 2, 0, 0, 2*Math.PI, true);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.bezierCurveTo.nonfinite.html ]]] -->
+
+<p>Canvas test: 2d.path.ellipse.nonfinite</p>
+<!-- Testing: bezierCurveTo() with Infinity/NaN is ignored -->
+<canvas id="c700" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_ellipse_nonfinite() {
+
+var canvas = document.getElementById('c700');
+var ctx = canvas.getContext('2d');
+
+var _thrown_outer = false;
+try {
+
+ctx.moveTo(0, 0);
+ctx.lineTo(100, 0);
+ctx.ellipse(Infinity, 25, 0, 0, 0, 0, 2 * Math.PI, false);
+ctx.ellipse(-Infinity, 25, 0, 0, 0, 0, 2 * Math.PI, false);
+ctx.ellipse(NaN, 25, 0, 0, 0, 0, 2 * Math.PI, false);
+ctx.ellipse(50, Infinity, 0, 0, 0, 0, 2 * Math.PI, false);
+ctx.ellipse(50, -Infinity, 0, 0, 0, 0, 2 * Math.PI, false);
+ctx.ellipse(50, NaN, 50, 0, 0, 0, 2 * Math.PI, false);
+ctx.ellipse(50, 25, Infinity, 0, 0, 0, 2 * Math.PI, false);
+ctx.ellipse(50, 25, -Infinity, 0, 0, 0, 2 * Math.PI, false);
+ctx.ellipse(50, 25, NaN, 0, 0, 0, 2 * Math.PI, false);
+ctx.ellipse(50, 25, 0, Infinity, 0, 0, 2 * Math.PI, false);
+ctx.ellipse(50, 25, 0, -Infinity, 0, 0, 2 * Math.PI, false);
+ctx.ellipse(50, 25, 0, NaN, 0, 0, 2 * Math.PI, false);
+ctx.ellipse(50, 25, 0, 0, Infinity, 0, 2 * Math.PI, false);
+ctx.ellipse(50, 25, 0, 0, -Infinity, 0, 2 * Math.PI, false);
+ctx.ellipse(50, 25, 0, 0, NaN, 0, 2 * Math.PI, false);
+ctx.ellipse(50, 25, 0, 0, 0, Infinity, 2 * Math.PI, false);
+ctx.ellipse(50, 25, 0, 0, 0, -Infinity, 2 * Math.PI, false);
+ctx.ellipse(50, 25, 0, 0, 0, NaN, 2 * Math.PI, false);
+ctx.ellipse(50, 25, 0, 0, 0, 0, Infinity, false);
+ctx.ellipse(50, 25, 0, 0, 0, 0, -Infinity, false);
+ctx.ellipse(50, 25, 0, 0, 0, 0, NaN, false);
+ctx.ellipse(Infinity, Infinity, 0, 0, 0, 0, 2 * Math.PI, false);
+ctx.ellipse(Infinity, Infinity, Infinity, 0, 0, 0, 2 * Math.PI, false);
+ctx.ellipse(Infinity, Infinity, Infinity, Infinity, 0, 0, 2 * Math.PI, false);
+ctx.ellipse(Infinity, Infinity, Infinity, Infinity, Infinity, 0, 2 * Math.PI, false);
+ctx.ellipse(Infinity, Infinity, Infinity, Infinity, Infinity, Infinity, 2 * Math.PI, false);
+ctx.ellipse(Infinity, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity, false);
+ctx.ellipse(Infinity, Infinity, Infinity, Infinity, Infinity, 0, Infinity, false);
+ctx.ellipse(Infinity, Infinity, Infinity, Infinity, 0, Infinity, Infinity, false);
+ctx.ellipse(Infinity, Infinity, Infinity, 0, Infinity, Infinity, Infinity, false);
+ctx.ellipse(Infinity, Infinity, 0, Infinity, Infinity, Infinity, Infinity, false);
+ctx.ellipse(Infinity, 25, Infinity, Infinity, Infinity, Infinity, Infinity, false);
+ctx.ellipse(50, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity, false);
+ctx.ellipse(Infinity, Infinity, Infinity, Infinity, 0, Infinity, 2 * Math.PI, false);
+ctx.ellipse(Infinity, Infinity, Infinity, 0, Infinity, Infinity, 2 * Math.PI, false);
+ctx.ellipse(Infinity, Infinity, 0, Infinity, Infinity, Infinity, 2 * Math.PI, false);
+ctx.ellipse(Infinity, 25, Infinity, Infinity, Infinity, Infinity, 2 * Math.PI, false);
+ctx.ellipse(50, Infinity, Infinity, Infinity, Infinity, Infinity, 2 * Math.PI, false);
+ctx.ellipse(Infinity, Infinity, Infinity, Infinity, 0, 0, Infinity, false);
+ctx.ellipse(Infinity, Infinity, Infinity, 0, Infinity, 0, Infinity, false);
+ctx.ellipse(Infinity, Infinity, 0, Infinity, Infinity, 0, Infinity, false);
+ctx.ellipse(Infinity, 25, Infinity, Infinity, Infinity, 0, Infinity, false);
+ctx.ellipse(50, Infinity, Infinity, Infinity, Infinity, 0, Infinity, false);
+ctx.ellipse(Infinity, Infinity, Infinity, 0, 0, Infinity, Infinity, false);
+ctx.ellipse(Infinity, Infinity, 0, Infinity, 0, Infinity, Infinity, false);
+ctx.ellipse(Infinity, 25, Infinity, Infinity, 0, Infinity, Infinity, false);
+ctx.ellipse(50, Infinity, Infinity, Infinity, 0, Infinity, Infinity, false);
+ctx.ellipse(Infinity, Infinity, 50, 0, Infinity, Infinity, Infinity, false);
+ctx.ellipse(Infinity, 25, Infinity, 0, Infinity, Infinity, Infinity, false);
+ctx.ellipse(50, Infinity, Infinity, 0, Infinity, Infinity, Infinity, false);
+ctx.ellipse(Infinity, 25, 50, Infinity, Infinity, Infinity, Infinity, false);
+ctx.ellipse(50, Infinity, 50, Infinity, Infinity, Infinity, Infinity, false);
+ctx.ellipse(50, 25, Infinity, Infinity, Infinity, Infinity, Infinity, false);
+ctx.ellipse(Infinity, Infinity, Infinity, 0, Infinity, 0, 2 * Math.PI, false);
+ctx.ellipse(Infinity, Infinity, 0, Infinity, Infinity, 0, 2 * Math.PI, false);
+ctx.ellipse(Infinity, 25, Infinity, Infinity, Infinity, 0, 2 * Math.PI, false);
+ctx.ellipse(50, Infinity, Infinity, Infinity, Infinity, 0, 2 * Math.PI, false);
+ctx.ellipse(Infinity, Infinity, Infinity, 0, 0, Infinity, 2 * Math.PI, false);
+ctx.ellipse(Infinity, Infinity, 0, Infinity, 0, Infinity, 2 * Math.PI, false);
+ctx.ellipse(Infinity, 25, Infinity, Infinity, 0, Infinity, 2 * Math.PI, false);
+ctx.ellipse(50, Infinity, Infinity, Infinity, 0, Infinity, 2 * Math.PI, false);
+ctx.ellipse(Infinity, Infinity, 0, 0, Infinity, Infinity, 2 * Math.PI, false);
+ctx.ellipse(Infinity, 25, Infinity, 0, Infinity, Infinity, 2 * Math.PI, false);
+ctx.ellipse(50, Infinity, Infinity, 0, Infinity, Infinity, 2 * Math.PI, false);
+ctx.ellipse(Infinity, 25, 0, Infinity, Infinity, Infinity, 2 * Math.PI, false);
+ctx.ellipse(50, Infinity, 0, Infinity, Infinity, Infinity, 2 * Math.PI, false);
+ctx.ellipse(50, 25, Infinity, Infinity, Infinity, Infinity, 2 * Math.PI, false);
+ctx.ellipse(Infinity, Infinity, Infinity, 0, 0, 0, Infinity, false);
+ctx.ellipse(Infinity, Infinity, 0, Infinity, 0, 0, Infinity, false);
+ctx.ellipse(Infinity, 25, Infinity, Infinity, 0, 0, Infinity, false);
+ctx.ellipse(50, Infinity, Infinity, Infinity, 0, 0, Infinity, false);
+ctx.ellipse(Infinity, Infinity, 0, 0, Infinity, 0, Infinity, false);
+ctx.ellipse(Infinity, 25, Infinity, 0, Infinity, 0, Infinity, false);
+ctx.ellipse(50, Infinity, Infinity, 0, Infinity, 0, Infinity, false);
+ctx.ellipse(Infinity, 25, 0, Infinity, Infinity, 0, Infinity, false);
+ctx.ellipse(50, Infinity, 0, Infinity, Infinity, 0, Infinity, false);
+ctx.ellipse(50, 25, Infinity, Infinity, Infinity, 0, Infinity, false);
+ctx.ellipse(Infinity, Infinity, 0, 0, 0, Infinity, Infinity, false);
+ctx.ellipse(Infinity, 25, Infinity, 0, 0, Infinity, Infinity, false);
+ctx.ellipse(50, Infinity, Infinity, 0, 0, Infinity, Infinity, false);
+ctx.ellipse(Infinity, 25, 0, Infinity, 0, Infinity, Infinity, false);
+ctx.ellipse(50, Infinity, 0, Infinity, 0, Infinity, Infinity, false);
+ctx.ellipse(50, 25, Infinity, Infinity, 0, Infinity, Infinity, false);
+ctx.ellipse(Infinity, 25, 0, 0, Infinity, Infinity, Infinity, false);
+ctx.ellipse(50, Infinity, 0, 0, Infinity, Infinity, Infinity, false);
+ctx.ellipse(50, 25, Infinity, 0, Infinity, Infinity, Infinity, false);
+ctx.ellipse(50, 25, 50, Infinity, Infinity, Infinity, Infinity, false);
+ctx.ellipse(Infinity, Infinity, 0, Infinity, 0, 0, 2 * Math.PI, false);
+ctx.ellipse(Infinity, 25, Infinity, Infinity, 0, 0, 2 * Math.PI, false);
+ctx.ellipse(50, Infinity, Infinity, Infinity, 0, 0, 2 * Math.PI, false);
+ctx.ellipse(Infinity, Infinity, 0, 0, Infinity, 0, 2 * Math.PI, false);
+ctx.ellipse(Infinity, 25, Infinity, 0, Infinity, 0, 2 * Math.PI, false);
+ctx.ellipse(50, Infinity, Infinity, 0, Infinity, 0, 2 * Math.PI, false);
+ctx.ellipse(Infinity, 25, 0, Infinity, Infinity, 0, 2 * Math.PI, false);
+ctx.ellipse(50, Infinity, 0, Infinity, Infinity, 0, 2 * Math.PI, false);
+ctx.ellipse(50, 25, Infinity, Infinity, Infinity, 0, 2 * Math.PI, false);
+ctx.ellipse(Infinity, Infinity, 0, 0, 0, Infinity, 2 * Math.PI, false);
+ctx.ellipse(Infinity, 25, Infinity, 0, 0, Infinity, 2 * Math.PI, false);
+ctx.ellipse(50, Infinity, Infinity, 0, 0, Infinity, 2 * Math.PI, false);
+ctx.ellipse(Infinity, 25, 0, Infinity, 0, Infinity, 2 * Math.PI, false);
+ctx.ellipse(50, Infinity, 0, Infinity, 0, Infinity, 2 * Math.PI, false);
+ctx.ellipse(50, 25, Infinity, Infinity, 0, Infinity, 2 * Math.PI, false);
+ctx.ellipse(Infinity, 25, 0, 0, Infinity, Infinity, 2 * Math.PI, false);
+ctx.ellipse(50, Infinity, 0, 0, Infinity, Infinity, 2 * Math.PI, false);
+ctx.ellipse(50, 25, Infinity, 0, Infinity, Infinity, 2 * Math.PI, false);
+ctx.ellipse(50, 25, 0, Infinity, Infinity, Infinity, 2 * Math.PI, false);
+ctx.ellipse(Infinity, Infinity, 0, 0, 0, 0, Infinity, false);
+ctx.ellipse(Infinity, 25, Infinity, 0, 0, 0, Infinity, false);
+ctx.ellipse(50, Infinity, Infinity, 0, 0, 0, Infinity, false);
+ctx.ellipse(Infinity, 25, 0, Infinity, 0, 0, Infinity, false);
+ctx.ellipse(50, Infinity, 0, Infinity, 0, 0, Infinity, false);
+ctx.ellipse(50, 25, Infinity, Infinity, 0, 0, Infinity, false);
+ctx.ellipse(Infinity, 25, 0, 0, Infinity, 0, Infinity, false);
+ctx.ellipse(50, Infinity, 0, 0, Infinity, 0, Infinity, false);
+ctx.ellipse(50, 25, Infinity, 0, Infinity, 0, Infinity, false);
+ctx.ellipse(50, 25, 0, Infinity, Infinity, 0, Infinity, false);
+ctx.ellipse(Infinity, 25, 0, 0, 0, Infinity, Infinity, false);
+ctx.ellipse(50, Infinity, 0, 0, 0, Infinity, Infinity, false);
+ctx.ellipse(50, 25, Infinity, 0, 0, Infinity, Infinity, false);
+ctx.ellipse(50, 25, 0, Infinity, 0, Infinity, Infinity, false);
+ctx.ellipse(50, 25, 0, 0, Infinity, Infinity, Infinity, false);
+ctx.ellipse(Infinity, 25, Infinity, 0, 0, 0, 2 * Math.PI, false);
+ctx.ellipse(50, Infinity, Infinity, 0, 0, 0, 2 * Math.PI, false);
+ctx.ellipse(Infinity, 25, 0, Infinity, 0, 0, 2 * Math.PI, false);
+ctx.ellipse(50, Infinity, 0, Infinity, 0, 0, 2 * Math.PI, false);
+ctx.ellipse(50, 25, Infinity, Infinity, 0, 0, 2 * Math.PI, false);
+ctx.ellipse(Infinity, 25, 0, 0, Infinity, 0, 2 * Math.PI, false);
+ctx.ellipse(50, Infinity, 0, 0, Infinity, 0, 2 * Math.PI, false);
+ctx.ellipse(50, 25, Infinity, 0, Infinity, 0, 2 * Math.PI, false);
+ctx.ellipse(50, 25, 0, Infinity, Infinity, 0, 2 * Math.PI, false);
+ctx.ellipse(Infinity, 25, 0, 0, 0, Infinity, 2 * Math.PI, false);
+ctx.ellipse(50, Infinity, 0, 0, 0, Infinity, 2 * Math.PI, false);
+ctx.ellipse(50, 25, Infinity, 0, 0, Infinity, 2 * Math.PI, false);
+ctx.ellipse(50, 25, 0, Infinity, 0, Infinity, 2 * Math.PI, false);
+ctx.ellipse(50, 25, 0, 0, Infinity, Infinity, 2 * Math.PI, false);
+ctx.ellipse(Infinity, 25, 0, 0, 0, 0, Infinity, false);
+ctx.ellipse(50, Infinity, 0, 0, 0, 0, Infinity, false);
+ctx.ellipse(50, 25, Infinity, 0, 0, 0, Infinity, false);
+ctx.ellipse(50, 25, 0, Infinity, 0, 0, Infinity, false);
+ctx.ellipse(50, 25, 0, 0, Infinity, 0, Infinity, false);
+ctx.ellipse(50, 25, 0, 0, 0, Infinity, Infinity, false);
+ctx.lineTo(100, 50);
+ctx.lineTo(0, 50);
+ctx.fillStyle = '#0f0';
+ctx.fill();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 90,45, 0,255,0,255, 0);
+
+} catch (e) {
+ _thrown_outer = true;
+}
+ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
+
+
+}
+</script>
+
+
+<!-- [[[ test_2d.path.ellipse.scale.1.html ]]] -->
+
+<p>Canvas test: 2d.path.ellipse.scale.1</p>
+<!-- Testing: Non-uniformly scaled ellipse are the right shape -->
+<canvas id="c701" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_ellipse_scale_1() {
+
+var canvas = document.getElementById('c701');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.scale(2, 0.5);
+ctx.fillStyle = '#0f0';
+ctx.beginPath();
+var hypothenuse = Math.sqrt(50 * 50 + 25 * 25);
+var tolerance = 0.5;
+var radius = hypothenuse + tolerance;
+ctx.ellipse(25, 50, radius, radius, 0, 0, 2*Math.PI, false);
+ctx.fill();
+ctx.fillStyle = '#f00';
+ctx.beginPath();
+ctx.moveTo(-25, 50);
+ctx.ellipse(-25, 50, 24, 34, 0, 0, 2 * Math.PI, false);
+ctx.moveTo(75, 50);
+ctx.ellipse(75, 50, 24, 34, 0, 0, 2 * Math.PI, false);
+ctx.moveTo(25, -25);
+ctx.ellipse(25, -25, 34, 24, 0, 0, 2 * Math.PI, false);
+ctx.moveTo(25, 125);
+ctx.ellipse(25, -25, 34, 24, 0, 0, 2 * Math.PI, false);
+ctx.fill();
+
+isPixel(ctx, 0,0, 0,255,0,255, 0);
+isPixel(ctx, 50,0, 0,255,0,255, 0);
+isPixel(ctx, 99,0, 0,255,0,255, 0);
+isPixel(ctx, 0,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 99,25, 0,255,0,255, 0);
+isPixel(ctx, 0,49, 0,255,0,255, 0);
+isPixel(ctx, 50,49, 0,255,0,255, 0);
+isPixel(ctx, 99,49, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.ellipse.scale.2.html ]]] -->
+
+<p>Canvas test: 2d.path.ellipse.scale.2</p>
+<!-- Testing: Highly scaled ellipse are the right shape -->
+<canvas id="c702" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_ellipse_scale_2() {
+
+var canvas = document.getElementById('c702');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.scale(100, 100);
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 1.2;
+ctx.beginPath();
+ctx.ellipse(0, 0, 0.6, 1, 0, 0, Math.PI/2, false);
+ctx.ellipse(0, 0, 1, 0.6, 0, 0, Math.PI/2, false);
+ctx.stroke();
+
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 50,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,25, 0,255,0,255, 0);
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 98,25, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 50,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.ellipse.selfintersect.1.html ]]] -->
+
+<p>Canvas test: 2d.path.ellipse.selfintersect.1</p>
+<!-- Testing: ellipse() with lineWidth > 2*radius is drawn sensibly -->
+<canvas id="c703" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_ellipse_selfintersect_1() {
+
+var canvas = document.getElementById('c703');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 200;
+ctx.strokeStyle = '#f00';
+ctx.beginPath();
+ctx.ellipse(100, 50, 35, 25, 0, 0, -Math.PI/2, true);
+ctx.stroke();
+ctx.beginPath();
+ctx.ellipse(0, 0, 35, 25, 0, 0, -Math.PI/2, true);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.ellipse.selfintersect.2.html ]]] -->
+
+<p>Canvas test: 2d.path.ellipse.selfintersect.2</p>
+<!-- Testing: ellipse() with lineWidth > 2*radius is drawn sensibly -->
+<canvas id="c704" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_ellipse_selfintersect_2() {
+
+var canvas = document.getElementById('c704');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 180;
+ctx.strokeStyle = '#0f0';
+ctx.beginPath();
+ctx.ellipse(-50, 50, 25, 25, 0, 0, -Math.PI/2, true);
+ctx.stroke();
+ctx.beginPath();
+ctx.ellipse(100, 0, 25, 25, 0, 0, -Math.PI/2, true);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 90,10, 0,255,0,255, 0);
+isPixel(ctx, 97,1, 0,255,0,255, 0);
+isPixel(ctx, 97,2, 0,255,0,255, 0);
+isPixel(ctx, 97,3, 0,255,0,255, 0);
+isPixel(ctx, 2,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.ellipse.shape.1.html ]]] -->
+
+<p>Canvas test: 2d.path.ellipse.shape.1</p>
+<!-- Testing: ellipse() from 0 to pi does not draw anything in the wrong half -->
+<canvas id="c705" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_ellipse_shape_1() {
+
+var canvas = document.getElementById('c705');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 50;
+ctx.strokeStyle = '#f00';
+ctx.beginPath();
+ctx.ellipse(50, 50, 40, 60, 0, 0, Math.PI, false);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 20,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+}
+</script>
+
+<!-- [[[ test_2d.path.ellipse.shape.2.html ]]] -->
+
+<p>Canvas test: 2d.path.ellipse.shape.2</p>
+<!-- Testing: ellipse() from 0 to pi draws stuff in the right half -->
+<canvas id="c706" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_ellipse_shape_2() {
+
+var canvas = document.getElementById('c706');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 100;
+ctx.strokeStyle = '#0f0';
+ctx.beginPath();
+ctx.ellipse(50, 50, 30, 15, 0, 0, Math.PI, true);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 20,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.ellipse.shape.3.html ]]] -->
+
+<p>Canvas test: 2d.path.ellipse.shape.3</p>
+<!-- Testing: ellipse() from 0 to -pi/2 draws stuff in the right quadrant -->
+<canvas id="c707" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_ellipse_shape_3() {
+
+var canvas = document.getElementById('c707');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 150;
+ctx.strokeStyle = '#0f0';
+ctx.beginPath();
+ctx.ellipse(-50, 50, 100, 200, 0, 0, -Math.PI/2, true);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.ellipse.shape.4.html ]]] -->
+
+<p>Canvas test: 2d.path.ellipse.shape.4</p>
+<!-- Testing: ellipse() from 0 to 5pi does not draw strange things -->
+<canvas id="c708" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_ellipse_shape_4() {
+
+var canvas = document.getElementById('c708');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 200;
+ctx.strokeStyle = '#f00';
+ctx.beginPath();
+ctx.ellipse(300, 0, 100, 200, 0, 0, 5*Math.PI, false);
+ctx.stroke();
+isPixel(ctx, 50,25, 0,255,0,255, 0);
+isPixel(ctx, 1,1, 0,255,0,255, 0);
+isPixel(ctx, 98,1, 0,255,0,255, 0);
+isPixel(ctx, 1,48, 0,255,0,255, 0);
+isPixel(ctx, 98,48, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.ellipse.twopie.1.html ]]] -->
+
+<p>Canvas test: 2d.path.ellipse.twopie.1</p>
+<!-- Testing: ellipse() draws nothing when end = start + 2pi-e and anticlockwise -->
+<canvas id="c709" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_ellipse_twopie_1() {
+
+var canvas = document.getElementById('c709');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 100;
+ctx.beginPath();
+ctx.ellipse(50, 25, 50, 60, 0, 0, 2*Math.PI - 1e-4, true);
+ctx.stroke();
+isPixel(ctx, 50,20, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.ellipse.twopie.2.html ]]] -->
+
+<p>Canvas test: 2d.path.ellipse.twopie.2</p>
+<!-- Testing: ellipse() draws a full ellipse when end = start + 2pi-e and clockwise -->
+<canvas id="c710" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_ellipse_twopie_2() {
+
+var canvas = document.getElementById('c710');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 100;
+ctx.beginPath();
+ctx.ellipse(50, 25, 50, 30, 0, 0, 2*Math.PI - 1e-4, false);
+ctx.stroke();
+isPixel(ctx, 50,20, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.ellipse.twopie.3.html ]]] -->
+
+<p>Canvas test: 2d.path.ellipse.twopie.3</p>
+<!-- Testing: ellipse() draws a full circle when end = start + 2pi+e and anticlockwise -->
+<canvas id="c711" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_ellipse_twopie_3() {
+
+var canvas = document.getElementById('c711');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 100;
+ctx.beginPath();
+ctx.ellipse(50, 25, 50, 25, 0, 0, 2*Math.PI + 1e-4, true);
+ctx.stroke();
+isPixel(ctx, 50,20, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.ellipse.twopie.4.html ]]] -->
+
+<p>Canvas test: 2d.path.ellipse.twopie.4</p>
+<!-- Testing: ellipse() draws nothing when end = start + 2pi+e and clockwise -->
+<canvas id="c712" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_ellipse_twopie_4() {
+
+var canvas = document.getElementById('c712');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 100, 50);
+ctx.strokeStyle = '#0f0';
+ctx.lineWidth = 100;
+ctx.beginPath();
+ctx.ellipse(50, 25, 50, 25, 0, 0, 2*Math.PI + 1e-4, false);
+ctx.stroke();
+isPixel(ctx, 50,20, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.ellipse.zero.1.html ]]] -->
+
+<p>Canvas test: 2d.path.ellipse.zero.1</p>
+<!-- Testing: ellipse() draws nothing when startAngle = endAngle and anticlockwise -->
+<canvas id="c713" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_ellipse_zero_1() {
+
+var canvas = document.getElementById('c713');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 100;
+ctx.beginPath();
+ctx.ellipse(50, 25, 50, 25, 0, 0, 0, true);
+ctx.stroke();
+isPixel(ctx, 50,20, 0,255,0,255, 0);
+
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.ellipse.zero.2.html ]]] -->
+
+<p>Canvas test: 2d.path.ellipse.zero.2</p>
+<!-- Testing: ellipse() draws nothing when startAngle = endAngle and clockwise -->
+<canvas id="c714" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+
+function test_2d_path_ellipse_zero_2() {
+
+var canvas = document.getElementById('c714');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.strokeStyle = '#f00';
+ctx.lineWidth = 100;
+ctx.beginPath();
+ctx.ellipse(50, 25, 50, 25, 0, 0, 0, true);
+ctx.stroke();
+isPixel(ctx, 50,20, 0,255,0,255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.ellipse.zeroradius.html ]]] -->
+
+<p>Canvas test: 2d.path.ellipse.zeroradius</p>
+<!-- Testing: ellipse() with zero radius draws a line to the start point -->
+<canvas id="c715" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_ellipse_zeroradius() {
+
+var canvas = document.getElementById('c715');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#f00'
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 50;
+ctx.strokeStyle = '#0f0';
+ctx.beginPath();
+ctx.moveTo(0, 25);
+ctx.ellipse(200, 25, 0, 0, 0, 0, Math.PI, true);
+ctx.stroke();
+
+isPixel(ctx, 50, 25, 0, 255, 0, 255, 0);
+
+
+}
+</script>
+
+<!-- [[[ test_2d.path.ellipse.rotate.html ]]] -->
+
+<p>Canvas test: 2d.path.ellipse.rotate</p>
+<!-- Testing: ellipse() with a rotation angle works -->
+<canvas id="c716" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<script>
+
+function test_2d_path_ellipse_rotate() {
+
+var canvas = document.getElementById('c716');
+var ctx = canvas.getContext('2d');
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.lineWidth = 5;
+ctx.strokeStyle = '#f00';
+ctx.beginPath();
+ctx.ellipse(50, 25, 50, 25, Math.PI/4, 0, 2 * Math.PI, false);
+ctx.stroke();
+ctx.beginPath();
+ctx.ellipse(50, 25, 50, 25, -Math.PI/4, 0, 2 * Math.PI, false);
+ctx.stroke();
+isPixel(ctx, 50, 25, 0,255,0,255, 0);
+isPixel(ctx, 48,1, 0,255,0,255, 0);
+isPixel(ctx, 98,24, 0,255,0,255, 0);
+isPixel(ctx, 48,48, 0,255,0,255, 0);
+isPixel(ctx, 24,48, 0,255,0,255, 0);
+}
+</script>
+
+<script>
+
+function asyncTestsDone() {
+ if (isDone_test_2d_drawImage_animated_apng &&
+ isDone_test_2d_pattern_animated_gif &&
+ isDone_test_2d_drawImage_animated_gif) {
+ SimpleTest.finish();
+ } else {
+ setTimeout(asyncTestsDone, 500);
+ }
+ }
+
+// eslint-disable-next-line complexity
+function runTests() {
+/**
+ * xor and lighter aren't well handled by cairo; they mostly work, but we don't want
+ * to test that
+ */
+ //test_2d_composite_solid_lighter();
+ //test_2d_composite_transparent_xor();
+ //test_2d_composite_solid_xor();
+ //test_2d_composite_transparent_lighter();
+ //test_2d_composite_image_xor();
+ //test_2d_composite_image_lighter();
+ //test_2d_composite_canvas_xor();
+ //test_2d_composite_canvas_lighter();
+ //test_2d_composite_clip_xor();
+ //test_2d_composite_clip_lighter();
+
+/**
+ * Temporarily disabled tests; unbounded operators changed behaviour, need to reevaluate tests
+ */
+ //test_2d_composite_canvas_destination_atop();
+ //test_2d_composite_canvas_destination_in();
+ //test_2d_composite_canvas_source_in();
+ //test_2d_composite_canvas_source_out();
+ //test_2d_composite_image_destination_atop();
+ //test_2d_composite_image_destination_in();
+ //test_2d_composite_image_source_in();
+ //test_2d_composite_image_source_out();
+
+ /**
+ * These tests only pass on Mac OS X >= 10.5; see bug 450114
+ */
+ //test_2d_gradient_radial_equal();
+ //test_2d_gradient_radial_touch1();
+ //test_2d_gradient_radial_touch2();
+ //test_2d_gradient_radial_touch3();
+
+ /**
+ * These 19 tests receive special makefile treatment
+ */
+ //test_2d_composite_uncovered_image_destination_atop();
+ //test_2d_composite_uncovered_image_destination_in();
+ //test_2d_composite_uncovered_image_source_in();
+ //test_2d_composite_uncovered_image_source_out();
+ //test_2d_gradient_radial_cone_behind();
+ //test_2d_gradient_radial_cone_beside();
+ //test_2d_gradient_radial_cone_front();
+ //test_2d_gradient_radial_cone_shape2();
+ //test_2d_gradient_radial_cone_top();
+ //test_2d_gradient_radial_inside2();
+ //test_2d_gradient_radial_inside3();
+ //test_2d_gradient_radial_outside1();
+ //test_2d_gradient_radial_outside2();
+ //test_2d_gradient_radial_outside3();
+ //test_2d_line_cap_closed();
+ //test_2d_line_join_parallel();
+ //test_2d_path_arc_shape_3();
+ //test_2d_path_rect_selfintersect();
+ //test_2d_strokeRect_zero_5();
+
+ /**
+ * Other tests not being run
+ */
+ //test_2d_composite_uncovered_fill_destination_atop();
+ //test_2d_composite_uncovered_fill_destination_in();
+ //test_2d_composite_uncovered_fill_source_in();
+ //test_2d_composite_uncovered_fill_source_out();
+ //test_2d_composite_uncovered_pattern_destination_atop();
+ //test_2d_composite_uncovered_pattern_destination_in();
+ //test_2d_composite_uncovered_pattern_source_in();
+ //test_2d_composite_uncovered_pattern_source_out();
+
+ //test_2d_path_rect_zero_6(); // This test is bogus according to the spec; see bug 407107
+
+ // These tests are bogus according to the spec: shadows should not be
+ // drawn if shadowBlur, shadowOffsetX, and shadowOffsetY are all zero, whic
+ // they are in these tests
+ //test_2d_shadow_composite_3();
+ //test_2d_shadow_composite_4();
+ try {
+ test_2d_canvas_readonly();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_canvas_readonly");
+ }
+ try {
+ test_2d_canvas_reference();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_canvas_reference");
+ }
+ try {
+ test_2d_clearRect_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_clearRect_basic");
+ }
+ try {
+ test_2d_clearRect_clip();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_clearRect_clip");
+ }
+ try {
+ test_2d_clearRect_globalalpha();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_clearRect_globalalpha");
+ }
+ try {
+ test_2d_clearRect_globalcomposite();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_clearRect_globalcomposite");
+ }
+ try {
+ test_2d_clearRect_negative();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_clearRect_negative");
+ }
+ try {
+ test_2d_clearRect_nonfinite();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_clearRect_nonfinite");
+ }
+ try {
+ test_2d_clearRect_path();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_clearRect_path");
+ }
+ try {
+ test_2d_clearRect_shadow();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_clearRect_shadow");
+ }
+ try {
+ test_2d_clearRect_transform();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_clearRect_transform");
+ }
+ try {
+ test_2d_clearRect_zero();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_clearRect_zero");
+ }
+ try {
+ test_2d_composite_canvas_copy();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_canvas_copy");
+ }
+ try {
+ test_2d_composite_canvas_destination_out();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_canvas_destination_out");
+ }
+ try {
+ test_2d_composite_canvas_destination_over();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_canvas_destination_over");
+ }
+ try {
+ test_2d_composite_canvas_source_atop();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_canvas_source_atop");
+ }
+ try {
+ test_2d_composite_canvas_source_over();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_canvas_source_over");
+ }
+ try {
+ test_2d_composite_clip_copy();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_clip_copy");
+ }
+ try {
+ test_2d_composite_clip_destination_atop();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_clip_destination_atop");
+ }
+ try {
+ test_2d_composite_clip_destination_in();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_clip_destination_in");
+ }
+ try {
+ test_2d_composite_clip_destination_out();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_clip_destination_out");
+ }
+ try {
+ test_2d_composite_clip_destination_over();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_clip_destination_over");
+ }
+ try {
+ test_2d_composite_clip_source_atop();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_clip_source_atop");
+ }
+ try {
+ test_2d_composite_clip_source_in();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_clip_source_in");
+ }
+ try {
+ test_2d_composite_clip_source_out();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_clip_source_out");
+ }
+ try {
+ test_2d_composite_clip_source_over();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_clip_source_over");
+ }
+ try {
+ test_2d_composite_globalAlpha_canvas();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_globalAlpha_canvas");
+ }
+ try {
+ test_2d_composite_globalAlpha_canvaspattern();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_globalAlpha_canvaspattern");
+ }
+ try {
+ test_2d_composite_globalAlpha_default();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_globalAlpha_default");
+ }
+ try {
+ test_2d_composite_globalAlpha_fill();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_globalAlpha_fill");
+ }
+ try {
+ test_2d_composite_globalAlpha_image();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_globalAlpha_image");
+ }
+ try {
+ test_2d_composite_globalAlpha_imagepattern();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_globalAlpha_imagepattern");
+ }
+ try {
+ test_2d_composite_globalAlpha_invalid();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_globalAlpha_invalid");
+ }
+ try {
+ test_2d_composite_globalAlpha_range();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_globalAlpha_range");
+ }
+ try {
+ test_2d_composite_image_copy();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_image_copy");
+ }
+ try {
+ test_2d_composite_image_destination_out();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_image_destination_out");
+ }
+ try {
+ test_2d_composite_image_destination_over();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_image_destination_over");
+ }
+ try {
+ test_2d_composite_image_source_atop();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_image_source_atop");
+ }
+ try {
+ test_2d_composite_image_source_over();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_image_source_over");
+ }
+ try {
+ test_2d_composite_operation_casesensitive();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_operation_casesensitive");
+ }
+ try {
+ test_2d_composite_operation_darker();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_operation_darker");
+ }
+ try {
+ test_2d_composite_operation_default();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_operation_default");
+ }
+ try {
+ test_2d_composite_operation_get();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_operation_get");
+ }
+ try {
+ test_2d_composite_operation_highlight();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_operation_highlight");
+ }
+ try {
+ test_2d_composite_operation_nullsuffix();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_operation_nullsuffix");
+ }
+ try {
+ test_2d_composite_operation_over();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_operation_over");
+ }
+ try {
+ test_2d_composite_operation_unrecognised();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_operation_unrecognised");
+ }
+ try {
+ test_2d_composite_solid_copy();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_solid_copy");
+ }
+ try {
+ test_2d_composite_solid_destination_atop();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_solid_destination_atop");
+ }
+ try {
+ test_2d_composite_solid_destination_in();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_solid_destination_in");
+ }
+ try {
+ test_2d_composite_solid_destination_out();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_solid_destination_out");
+ }
+ try {
+ test_2d_composite_solid_destination_over();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_solid_destination_over");
+ }
+ try {
+ test_2d_composite_solid_source_atop();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_solid_source_atop");
+ }
+ try {
+ test_2d_composite_solid_source_in();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_solid_source_in");
+ }
+ try {
+ test_2d_composite_solid_source_out();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_solid_source_out");
+ }
+ try {
+ test_2d_composite_solid_source_over();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_solid_source_over");
+ }
+ try {
+ test_2d_composite_transparent_copy();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_transparent_copy");
+ }
+ try {
+ test_2d_composite_transparent_destination_atop();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_transparent_destination_atop");
+ }
+ try {
+ test_2d_composite_transparent_destination_in();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_transparent_destination_in");
+ }
+ try {
+ test_2d_composite_transparent_destination_out();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_transparent_destination_out");
+ }
+ try {
+ test_2d_composite_transparent_destination_over();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_transparent_destination_over");
+ }
+ try {
+ test_2d_composite_transparent_source_atop();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_transparent_source_atop");
+ }
+ try {
+ test_2d_composite_transparent_source_in();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_transparent_source_in");
+ }
+ try {
+ test_2d_composite_transparent_source_out();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_transparent_source_out");
+ }
+ try {
+ test_2d_composite_transparent_source_over();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_transparent_source_over");
+ }
+ try {
+ test_2d_composite_uncovered_fill_copy();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_uncovered_fill_copy");
+ }
+ try {
+ test_2d_composite_uncovered_image_copy();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_uncovered_image_copy");
+ }
+ try {
+ test_2d_composite_uncovered_pattern_copy();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_composite_uncovered_pattern_copy");
+ }
+ try {
+ test_2d_drawImage_3arg();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_3arg");
+ }
+ try {
+ test_2d_drawImage_5arg();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_5arg");
+ }
+ try {
+ test_2d_drawImage_9arg_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_9arg_basic");
+ }
+ try {
+ test_2d_drawImage_9arg_destpos();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_9arg_destpos");
+ }
+ try {
+ test_2d_drawImage_9arg_destsize();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_9arg_destsize");
+ }
+ try {
+ test_2d_drawImage_9arg_sourcepos();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_9arg_sourcepos");
+ }
+ try {
+ test_2d_drawImage_9arg_sourcesize();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_9arg_sourcesize");
+ }
+ try {
+ test_2d_drawImage_alpha();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_alpha");
+ }
+ try {
+ test_2d_drawImage_animated_poster();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_animated_poster");
+ }
+ try {
+ test_2d_drawImage_broken();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_broken");
+ }
+ try {
+ test_2d_drawImage_canvas();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_canvas");
+ }
+ try {
+ test_2d_drawImage_clip();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_clip");
+ }
+ try {
+ test_2d_drawImage_composite();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_composite");
+ }
+ try {
+ test_2d_drawImage_floatsource();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_floatsource");
+ }
+ try {
+ test_2d_drawImage_incomplete();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_incomplete");
+ }
+ try {
+ test_2d_drawImage_negativedest();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_negativedest");
+ }
+ try {
+ test_2d_drawImage_negativesource();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_negativesource");
+ }
+ try {
+ test_2d_drawImage_nonfinite();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_nonfinite");
+ }
+ try {
+ test_2d_drawImage_nowrap();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_nowrap");
+ }
+ try {
+ test_2d_drawImage_null();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_null");
+ }
+ try {
+ test_2d_drawImage_path();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_path");
+ }
+ try {
+ test_2d_drawImage_self_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_self_1");
+ }
+ try {
+ test_2d_drawImage_self_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_self_2");
+ }
+ try {
+ test_2d_drawImage_transform();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_transform");
+ }
+ try {
+ test_2d_drawImage_wrongtype();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_wrongtype");
+ }
+ try {
+ test_2d_drawImage_zerosource();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_zerosource");
+ }
+ try {
+ test_2d_fillRect_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillRect_basic");
+ }
+ try {
+ test_2d_fillRect_clip();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillRect_clip");
+ }
+ try {
+ test_2d_fillRect_negative();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillRect_negative");
+ }
+ try {
+ test_2d_fillRect_nonfinite();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillRect_nonfinite");
+ }
+ try {
+ test_2d_fillRect_path();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillRect_path");
+ }
+ try {
+ test_2d_fillRect_shadow();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillRect_shadow");
+ }
+ try {
+ test_2d_fillRect_transform();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillRect_transform");
+ }
+ try {
+ test_2d_fillRect_zero();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillRect_zero");
+ }
+ try {
+ test_2d_fillStyle_default();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_default");
+ }
+ try {
+ test_2d_fillStyle_get_semitransparent();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_get_semitransparent");
+ }
+ try {
+ test_2d_fillStyle_get_solid();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_get_solid");
+ }
+ try {
+ test_2d_fillStyle_get_transparent();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_get_transparent");
+ }
+ try {
+ test_2d_fillStyle_invalidstring();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_invalidstring");
+ }
+ try {
+ test_2d_fillStyle_invalidtype();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_invalidtype");
+ }
+ try {
+ test_2d_fillStyle_parse_current_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_current_basic");
+ }
+ try {
+ test_2d_fillStyle_parse_current_changed();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_current_changed");
+ }
+ try {
+ test_2d_fillStyle_parse_current_removed();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_current_removed");
+ }
+ try {
+ test_2d_fillStyle_parse_hex3();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hex3");
+ }
+ try {
+ test_2d_fillStyle_parse_hex6();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hex6");
+ }
+ try {
+ test_2d_fillStyle_parse_hsl_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsl_1");
+ }
+ try {
+ test_2d_fillStyle_parse_hsl_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsl_2");
+ }
+ try {
+ test_2d_fillStyle_parse_hsl_3();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsl_3");
+ }
+ try {
+ test_2d_fillStyle_parse_hsl_4();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsl_4");
+ }
+ try {
+ test_2d_fillStyle_parse_hsl_5();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsl_5");
+ }
+ try {
+ test_2d_fillStyle_parse_hsl_clamp_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsl_clamp_1");
+ }
+ try {
+ test_2d_fillStyle_parse_hsl_clamp_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsl_clamp_2");
+ }
+ try {
+ test_2d_fillStyle_parse_hsl_clamp_3();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsl_clamp_3");
+ }
+ try {
+ test_2d_fillStyle_parse_hsl_clamp_4();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsl_clamp_4");
+ }
+ try {
+ test_2d_fillStyle_parse_hsla_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsla_1");
+ }
+ try {
+ test_2d_fillStyle_parse_hsla_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsla_2");
+ }
+ try {
+ test_2d_fillStyle_parse_hsla_clamp_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsla_clamp_1");
+ }
+ try {
+ test_2d_fillStyle_parse_hsla_clamp_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsla_clamp_2");
+ }
+ try {
+ test_2d_fillStyle_parse_hsla_clamp_3();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsla_clamp_3");
+ }
+ try {
+ test_2d_fillStyle_parse_hsla_clamp_4();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsla_clamp_4");
+ }
+ try {
+ test_2d_fillStyle_parse_hsla_clamp_5();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsla_clamp_5");
+ }
+ try {
+ test_2d_fillStyle_parse_hsla_clamp_6();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsla_clamp_6");
+ }
+ try {
+ test_2d_fillStyle_parse_html4();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_html4");
+ }
+ try {
+ test_2d_fillStyle_parse_invalid_hex3();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_hex3");
+ }
+ try {
+ test_2d_fillStyle_parse_invalid_hex6();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_hex6");
+ }
+ try {
+ test_2d_fillStyle_parse_invalid_hsl_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_hsl_1");
+ }
+ try {
+ test_2d_fillStyle_parse_invalid_hsl_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_hsl_2");
+ }
+ try {
+ test_2d_fillStyle_parse_invalid_hsl_3();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_hsl_3");
+ }
+ try {
+ test_2d_fillStyle_parse_invalid_hsl_4();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_hsl_4");
+ }
+ try {
+ test_2d_fillStyle_parse_invalid_hsl_5();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_hsl_5");
+ }
+ try {
+ test_2d_fillStyle_parse_invalid_hsla_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_hsla_1");
+ }
+ try {
+ test_2d_fillStyle_parse_invalid_hsla_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_hsla_2");
+ }
+ try {
+ test_2d_fillStyle_parse_invalid_name_1()
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_name_1");
+ }
+ try {
+ test_2d_fillStyle_parse_invalid_name_2()
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_name_2");
+ }
+ try {
+ test_2d_fillStyle_parse_invalid_name_3()
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_name_3");
+ }
+ try {
+ test_2d_fillStyle_parse_invalid_rgb_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_rgb_1");
+ }
+ try {
+ test_2d_fillStyle_parse_invalid_rgb_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_rgb_2");
+ }
+ try {
+ test_2d_fillStyle_parse_invalid_rgb_3();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_rgb_3");
+ }
+ try {
+ test_2d_fillStyle_parse_invalid_rgb_4();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_rgb_4");
+ }
+ try {
+ test_2d_fillStyle_parse_invalid_rgb_5();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_rgb_5");
+ }
+ try {
+ test_2d_fillStyle_parse_invalid_rgb_6();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_rgb_6");
+ }
+ try {
+ test_2d_fillStyle_parse_invalid_rgb_7();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_rgb_7");
+ }
+ try {
+ test_2d_fillStyle_parse_invalid_rgba_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_rgba_1");
+ }
+ try {
+ test_2d_fillStyle_parse_invalid_rgba_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_rgba_2");
+ }
+ try {
+ test_2d_fillStyle_parse_invalid_rgba_3();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_rgba_3");
+ }
+ try {
+ test_2d_fillStyle_parse_invalid_rgba_4();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_rgba_4");
+ }
+ try {
+ test_2d_fillStyle_parse_invalid_rgba_5();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_rgba_5");
+ }
+ try {
+ test_2d_fillStyle_parse_rgb_clamp_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgb_clamp_1");
+ }
+ try {
+ test_2d_fillStyle_parse_rgb_clamp_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgb_clamp_2");
+ }
+ try {
+ test_2d_fillStyle_parse_rgb_clamp_3();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgb_clamp_3");
+ }
+ try {
+ test_2d_fillStyle_parse_rgb_clamp_4();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgb_clamp_4");
+ }
+ try {
+ test_2d_fillStyle_parse_rgb_clamp_5();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgb_clamp_5");
+ }
+ try {
+ test_2d_fillStyle_parse_rgb_num();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgb_num");
+ }
+ try {
+ test_2d_fillStyle_parse_rgb_percent();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgb_percent");
+ }
+ try {
+ test_2d_fillStyle_parse_rgba_clamp_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgba_clamp_1");
+ }
+ try {
+ test_2d_fillStyle_parse_rgba_clamp_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgba_clamp_2");
+ }
+ try {
+ test_2d_fillStyle_parse_rgba_num_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgba_num_1");
+ }
+ try {
+ test_2d_fillStyle_parse_rgba_num_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgba_num_2");
+ }
+ try {
+ test_2d_fillStyle_parse_rgba_percent();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgba_percent");
+ }
+ try {
+ test_2d_fillStyle_parse_rgba_solid_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgba_solid_1");
+ }
+ try {
+ test_2d_fillStyle_parse_rgba_solid_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgba_solid_2");
+ }
+ try {
+ test_2d_fillStyle_parse_svg_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_svg_1");
+ }
+ try {
+ test_2d_fillStyle_parse_svg_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_svg_2");
+ }
+ try {
+ test_2d_fillStyle_parse_system();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_system");
+ }
+ try {
+ test_2d_fillStyle_parse_transparent_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_transparent_1");
+ }
+ try {
+ test_2d_fillStyle_parse_transparent_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_transparent_2");
+ }
+ try {
+ test_2d_getcontext_exists();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_getcontext_exists");
+ }
+ try {
+ test_2d_getcontext_shared();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_getcontext_shared");
+ }
+ try {
+ test_2d_getcontext_unique();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_getcontext_unique");
+ }
+ try {
+ test_2d_gradient_empty();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_empty");
+ }
+ try {
+ test_2d_gradient_interpolate_alpha();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_interpolate_alpha");
+ }
+ try {
+ test_2d_gradient_interpolate_colour();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_interpolate_colour");
+ }
+ try {
+ test_2d_gradient_interpolate_colouralpha();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_interpolate_colouralpha");
+ }
+ try {
+ test_2d_gradient_interpolate_multiple();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_interpolate_multiple");
+ }
+ try {
+ test_2d_gradient_interpolate_outside();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_interpolate_outside");
+ }
+ try {
+ test_2d_gradient_interpolate_overlap();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_interpolate_overlap");
+ }
+ try {
+ test_2d_gradient_interpolate_overlap2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_interpolate_overlap2");
+ }
+ try {
+ test_2d_gradient_interpolate_solid();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_interpolate_solid");
+ }
+ try {
+ test_2d_gradient_interpolate_vertical();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_interpolate_vertical");
+ }
+ try {
+ test_2d_gradient_interpolate_zerosize();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_interpolate_zerosize");
+ }
+ try {
+ test_2d_gradient_linear_nonfinite();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_linear_nonfinite");
+ }
+ try {
+ test_2d_gradient_linear_transform_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_linear_transform_1");
+ }
+ try {
+ test_2d_gradient_linear_transform_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_linear_transform_2");
+ }
+ try {
+ test_2d_gradient_linear_transform_3();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_linear_transform_3");
+ }
+ try {
+ test_2d_gradient_object_compare();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_object_compare");
+ }
+ try {
+ test_2d_gradient_object_crosscanvas();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_object_crosscanvas");
+ }
+ try {
+ test_2d_gradient_object_invalidcolour();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_object_invalidcolour");
+ }
+ try {
+ test_2d_gradient_object_invalidoffset();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_object_invalidoffset");
+ }
+ try {
+ test_2d_gradient_object_return();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_object_return");
+ }
+ try {
+ test_2d_gradient_object_type();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_object_type");
+ }
+ try {
+ test_2d_gradient_object_update();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_object_update");
+ }
+ try {
+ test_2d_gradient_radial_cone_bottom();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_radial_cone_bottom");
+ }
+ try {
+ test_2d_gradient_radial_cone_cylinder();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_radial_cone_cylinder");
+ }
+ try {
+ test_2d_gradient_radial_cone_shape1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_radial_cone_shape1");
+ }
+ try {
+ test_2d_gradient_radial_inside1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_radial_inside1");
+ }
+ try {
+ test_2d_gradient_radial_negative();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_radial_negative");
+ }
+ try {
+ test_2d_gradient_radial_nonfinite();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_radial_nonfinite");
+ }
+ try {
+ test_2d_gradient_radial_transform_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_radial_transform_1");
+ }
+ try {
+ test_2d_gradient_radial_transform_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_radial_transform_2");
+ }
+ try {
+ test_2d_gradient_radial_transform_3();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_gradient_radial_transform_3");
+ }
+ try {
+ test_2d_imageData_create_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_create_basic");
+ }
+ try {
+ test_2d_imageData_create1_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_create1_basic");
+ }
+ try {
+ test_2d_imageData_create_initial();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_create_initial");
+ }
+ try {
+ test_2d_imageData_create1_initial();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_create1_initial");
+ }
+ try {
+ test_2d_imageData_create_large();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_create_large");
+ }
+ try {
+ test_2d_imageData_create_negative();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_create_negative");
+ }
+ try {
+ test_2d_imageData_create_nonfinite();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_create_nonfinite");
+ }
+ try {
+ test_2d_imageData_create_round();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_create_round");
+ }
+ try {
+ test_2d_imageData_create_tiny();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_create_tiny");
+ }
+ try {
+ test_2d_imageData_create_type();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_create_type");
+ }
+ try {
+ test_2d_imageData_create1_type();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_create1_type");
+ }
+ try {
+ test_2d_imageData_create_zero();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_create_zero");
+ }
+ try {
+ test_2d_imageData_create1_zero();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_create1_zero");
+ }
+ try {
+ test_2d_imageData_get_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_get_basic");
+ }
+ try {
+ test_2d_imageData_get_clamp();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_get_clamp");
+ }
+ try {
+ test_2d_imageData_get_nonfinite();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_get_nonfinite");
+ }
+ try {
+ test_2d_imageData_get_nonpremul();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_get_nonpremul");
+ }
+ try {
+ test_2d_imageData_get_order_alpha();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_get_order_alpha");
+ }
+ try {
+ test_2d_imageData_get_order_cols();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_get_order_cols");
+ }
+ try {
+ test_2d_imageData_get_order_rgb();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_get_order_rgb");
+ }
+ try {
+ test_2d_imageData_get_order_rows();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_get_order_rows");
+ }
+ try {
+ test_2d_imageData_get_range();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_get_range");
+ }
+ try {
+ test_2d_imageData_get_source_negative();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_get_source_negative");
+ }
+ try {
+ test_2d_imageData_get_source_outside();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_get_source_outside");
+ }
+ try {
+ test_2d_imageData_get_source_size();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_get_source_size");
+ }
+ try {
+ test_2d_imageData_get_tiny();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_get_tiny");
+ }
+ try {
+ test_2d_imageData_get_type();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_get_type");
+ }
+ try {
+ test_2d_imageData_get_unaffected();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_get_unaffected");
+ }
+ try {
+ test_2d_imageData_get_zero();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_get_zero");
+ }
+ try {
+ test_2d_imageData_object_clamp();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_object_clamp");
+ }
+ try {
+ test_2d_imageData_object_ctor();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_object_ctor");
+ }
+ try {
+ test_2d_imageData_object_nan();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_object_nan");
+ }
+ try {
+ test_2d_imageData_object_properties();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_object_properties");
+ }
+ try {
+ test_2d_imageData_object_readonly();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_object_readonly");
+ }
+ try {
+ test_2d_imageData_object_round();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_object_round");
+ }
+ try {
+ test_2d_imageData_object_set();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_object_set");
+ }
+ try {
+ test_2d_imageData_object_string();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_object_string");
+ }
+ try {
+ test_2d_imageData_object_undefined();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_object_undefined");
+ }
+ try {
+ test_2d_imageData_put_alpha();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_put_alpha");
+ }
+ try {
+ test_2d_imageData_put_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_put_basic");
+ }
+ try {
+ test_2d_imageData_put_clip();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_put_clip");
+ }
+ try {
+ test_2d_imageData_put_created();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_put_created");
+ }
+ try {
+ test_2d_imageData_put_cross();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_put_cross");
+ }
+ try {
+ test_2d_imageData_put_dirty_negative();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_put_dirty_negative");
+ }
+ try {
+ test_2d_imageData_put_dirty_outside();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_put_dirty_outside");
+ }
+ try {
+ test_2d_imageData_put_dirty_rect1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_put_dirty_rect1");
+ }
+ try {
+ test_2d_imageData_put_dirty_rect2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_put_dirty_rect2");
+ }
+ try {
+ test_2d_imageData_put_dirty_zero();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_put_dirty_zero");
+ }
+ try {
+ test_2d_imageData_put_modified();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_put_modified");
+ }
+ try {
+ test_2d_imageData_put_nonfinite();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_put_nonfinite");
+ }
+ try {
+ test_2d_imageData_put_null();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_put_null");
+ }
+ try {
+ test_2d_imageData_put_path();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_put_path");
+ }
+ try {
+ test_2d_imageData_put_unaffected();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_put_unaffected");
+ }
+ try {
+ test_2d_imageData_put_unchanged();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_put_unchanged");
+ }
+ try {
+ test_2d_imageData_put_wrongtype();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageData_put_wrongtype");
+ }
+ try {
+ test_2d_line_cap_butt();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_line_cap_butt");
+ }
+ try {
+ test_2d_line_cap_invalid();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_line_cap_invalid");
+ }
+ try {
+ test_2d_line_cap_open();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_line_cap_open");
+ }
+ try {
+ test_2d_line_cap_round();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_line_cap_round");
+ }
+ try {
+ test_2d_line_cap_square();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_line_cap_square");
+ }
+ try {
+ test_2d_line_cross();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_line_cross");
+ }
+ try {
+ test_2d_line_defaults();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_line_defaults");
+ }
+ try {
+ test_2d_line_join_bevel();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_line_join_bevel");
+ }
+ try {
+ test_2d_line_join_closed();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_line_join_closed");
+ }
+ try {
+ test_2d_line_join_invalid();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_line_join_invalid");
+ }
+ try {
+ test_2d_line_join_miter();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_line_join_miter");
+ }
+ try {
+ test_2d_line_join_open();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_line_join_open");
+ }
+ try {
+ test_2d_line_join_round();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_line_join_round");
+ }
+ try {
+ test_2d_line_miter_acute();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_line_miter_acute");
+ }
+ try {
+ test_2d_line_miter_exceeded();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_line_miter_exceeded");
+ }
+ try {
+ test_2d_line_miter_invalid();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_line_miter_invalid");
+ }
+ try {
+ test_2d_line_miter_lineedge();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_line_miter_lineedge");
+ }
+ try {
+ test_2d_line_miter_obtuse();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_line_miter_obtuse");
+ }
+ try {
+ test_2d_line_miter_rightangle();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_line_miter_rightangle");
+ }
+ try {
+ test_2d_line_miter_within();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_line_miter_within");
+ }
+ try {
+ test_2d_line_union();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_line_union");
+ }
+ try {
+ test_2d_line_width_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_line_width_basic");
+ }
+ try {
+ test_2d_line_width_invalid();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_line_width_invalid");
+ }
+ try {
+ test_2d_line_width_transformed();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_line_width_transformed");
+ }
+ try {
+ test_2d_missingargs();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_missingargs");
+ }
+ try {
+ test_2d_path_arc_angle_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arc_angle_1");
+ }
+ try {
+ test_2d_path_arc_angle_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arc_angle_2");
+ }
+ try {
+ test_2d_path_arc_angle_3();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arc_angle_3");
+ }
+ try {
+ test_2d_path_arc_angle_4();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arc_angle_4");
+ }
+ try {
+ test_2d_path_arc_angle_5();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arc_angle_5");
+ }
+ try {
+ test_2d_path_arc_angle_6();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arc_angle_6");
+ }
+ try {
+ test_2d_path_arc_empty();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arc_empty");
+ }
+ try {
+ test_2d_path_arc_end();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arc_end");
+ }
+ try {
+ test_2d_path_arc_negative();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arc_negative");
+ }
+ try {
+ test_2d_path_arc_nonempty();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arc_nonempty");
+ }
+ try {
+ test_2d_path_arc_nonfinite();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arc_nonfinite");
+ }
+ try {
+ test_2d_path_arc_scale_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arc_scale_1");
+ }
+ try {
+ test_2d_path_arc_scale_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arc_scale_2");
+ }
+ try {
+ test_2d_path_arc_selfintersect_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arc_selfintersect_1");
+ }
+ try {
+ test_2d_path_arc_selfintersect_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arc_selfintersect_2");
+ }
+ try {
+ test_2d_path_arc_shape_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arc_shape_1");
+ }
+ try {
+ test_2d_path_arc_shape_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arc_shape_2");
+ }
+ try {
+ test_2d_path_arc_shape_4();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arc_shape_4");
+ }
+ try {
+ test_2d_path_arc_shape_5();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arc_shape_5");
+ }
+ try {
+ test_2d_path_arc_twopie_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arc_twopie_1");
+ }
+ try {
+ test_2d_path_arc_twopie_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arc_twopie_2");
+ }
+ try {
+ test_2d_path_arc_twopie_3();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arc_twopie_3");
+ }
+ try {
+ test_2d_path_arc_twopie_4();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arc_twopie_4");
+ }
+ try {
+ test_2d_path_arc_zero_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arc_zero_1");
+ }
+ try {
+ test_2d_path_arc_zero_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arc_zero_2");
+ }
+ try {
+ test_2d_path_arc_zeroradius();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arc_zeroradius");
+ }
+ try {
+ test_2d_path_arcTo_coincide_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arcTo_coincide_1");
+ }
+ try {
+ test_2d_path_arcTo_coincide_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arcTo_coincide_2");
+ }
+ try {
+ test_2d_path_arcTo_collinear_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arcTo_collinear_1");
+ }
+ try {
+ test_2d_path_arcTo_collinear_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arcTo_collinear_2");
+ }
+ try {
+ test_2d_path_arcTo_collinear_3();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arcTo_collinear_3");
+ }
+ try {
+ test_2d_path_arcTo_emptysubpath();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arcTo_emptysubpath");
+ }
+ try {
+ test_2d_path_arcTo_negative();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arcTo_negative");
+ }
+ try {
+ test_2d_path_arcTo_nonfinite();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arcTo_nonfinite");
+ }
+ try {
+ test_2d_path_arcTo_scale();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arcTo_scale");
+ }
+ try {
+ test_2d_path_arcTo_shape_curve1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arcTo_shape_curve1");
+ }
+ try {
+ test_2d_path_arcTo_shape_curve2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arcTo_shape_curve2");
+ }
+ try {
+ test_2d_path_arcTo_shape_end();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arcTo_shape_end");
+ }
+ try {
+ test_2d_path_arcTo_shape_start();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arcTo_shape_start");
+ }
+ try {
+ test_2d_path_arcTo_transformation();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arcTo_transformation");
+ }
+ try {
+ test_2d_path_arcTo_zero_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arcTo_zero_1");
+ }
+ try {
+ test_2d_path_arcTo_zero_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_arcTo_zero_2");
+ }
+ try {
+ test_2d_path_beginPath();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_beginPath");
+ }
+ try {
+ test_2d_path_bezierCurveTo_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_bezierCurveTo_basic");
+ }
+ try {
+ test_2d_path_bezierCurveTo_emptysubpath();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_bezierCurveTo_emptysubpath");
+ }
+ try {
+ test_2d_path_bezierCurveTo_nonfinite();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_bezierCurveTo_nonfinite");
+ }
+ try {
+ test_2d_path_bezierCurveTo_scaled();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_bezierCurveTo_scaled");
+ }
+ try {
+ test_2d_path_bezierCurveTo_shape();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_bezierCurveTo_shape");
+ }
+ try {
+ test_2d_path_clip_basic_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_clip_basic_1");
+ }
+ try {
+ test_2d_path_clip_basic_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_clip_basic_2");
+ }
+ try {
+ test_2d_path_clip_empty();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_clip_empty");
+ }
+ try {
+ test_2d_path_clip_intersect();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_clip_intersect");
+ }
+ try {
+ test_2d_path_clip_unaffected();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_clip_unaffected");
+ }
+ try {
+ test_2d_path_clip_winding_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_clip_winding_1");
+ }
+ try {
+ test_2d_path_clip_winding_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_clip_winding_2");
+ }
+ try {
+ test_2d_path_closePath_empty();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_closePath_empty");
+ }
+ try {
+ test_2d_path_closePath_newline();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_closePath_newline");
+ }
+ try {
+ test_2d_path_closePath_nextpoint();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_closePath_nextpoint");
+ }
+ try {
+ test_2d_path_fill_closed_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_fill_closed_basic");
+ }
+ try {
+ test_2d_path_fill_closed_unaffected();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_fill_closed_unaffected");
+ }
+ try {
+ test_2d_path_fill_overlap();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_fill_overlap");
+ }
+ try {
+ test_2d_path_fill_winding_add();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_fill_winding_add");
+ }
+ try {
+ test_2d_path_fill_winding_subtract_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_fill_winding_subtract_1");
+ }
+ try {
+ test_2d_path_fill_winding_subtract_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_fill_winding_subtract_2");
+ }
+ try {
+ test_2d_path_fill_winding_subtract_3();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_fill_winding_subtract_3");
+ }
+ try {
+ test_2d_path_initial();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_initial");
+ }
+ try {
+ test_2d_path_isPointInPath_arc();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_arc");
+ }
+ try {
+ test_2d_path_isPointInPath_basic_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_basic_1");
+ }
+ try {
+ test_2d_path_isPointInPath_basic_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_basic_2");
+ }
+ try {
+ test_2d_path_isPointInPath_bezier();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_bezier");
+ }
+ try {
+ test_2d_path_isPointInPath_bigarc();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_bigarc");
+ }
+ try {
+ test_2d_path_isPointInPath_edge();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_edge");
+ }
+ try {
+ test_2d_path_isPointInPath_empty();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_empty");
+ }
+ try {
+ test_2d_path_isPointInPath_nonfinite();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_nonfinite");
+ }
+ try {
+ test_2d_path_isPointInPath_outside();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_outside");
+ }
+ try {
+ test_2d_path_isPointInPath_subpath();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_subpath");
+ }
+ try {
+ test_2d_path_isPointInPath_transform_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_transform_1");
+ }
+ try {
+ test_2d_path_isPointInPath_transform_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_transform_2");
+ }
+ try {
+ test_2d_path_isPointInPath_transform_3();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_transform_3");
+ }
+ try {
+ test_2d_path_isPointInPath_unclosed();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_unclosed");
+ }
+ try {
+ test_2d_path_isPointInPath_winding();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_winding");
+ }
+ try {
+ test_2d_path_lineTo_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_lineTo_basic");
+ }
+ try {
+ test_2d_path_lineTo_emptysubpath();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_lineTo_emptysubpath");
+ }
+ try {
+ test_2d_path_lineTo_nextpoint();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_lineTo_nextpoint");
+ }
+ try {
+ test_2d_path_lineTo_nonfinite();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_lineTo_nonfinite");
+ }
+ try {
+ test_2d_path_moveTo_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_moveTo_basic");
+ }
+ try {
+ test_2d_path_moveTo_multiple();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_moveTo_multiple");
+ }
+ try {
+ test_2d_path_moveTo_newsubpath();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_moveTo_newsubpath");
+ }
+ try {
+ test_2d_path_moveTo_nonfinite();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_moveTo_nonfinite");
+ }
+ try {
+ test_2d_path_quadraticCurveTo_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_quadraticCurveTo_basic");
+ }
+ try {
+ test_2d_path_quadraticCurveTo_emptysubpath();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_quadraticCurveTo_emptysubpath");
+ }
+ try {
+ test_2d_path_quadraticCurveTo_nonfinite();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_quadraticCurveTo_nonfinite");
+ }
+ try {
+ test_2d_path_quadraticCurveTo_scaled();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_quadraticCurveTo_scaled");
+ }
+ try {
+ test_2d_path_quadraticCurveTo_shape();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_quadraticCurveTo_shape");
+ }
+ try {
+ test_2d_path_rect_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_rect_basic");
+ }
+ try {
+ test_2d_path_rect_closed();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_rect_closed");
+ }
+ try {
+ test_2d_path_rect_end_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_rect_end_1");
+ }
+ try {
+ test_2d_path_rect_end_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_rect_end_2");
+ }
+ try {
+ test_2d_path_rect_negative();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_rect_negative");
+ }
+ try {
+ test_2d_path_rect_newsubpath();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_rect_newsubpath");
+ }
+ try {
+ test_2d_path_rect_nonfinite();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_rect_nonfinite");
+ }
+ try {
+ test_2d_path_rect_winding();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_rect_winding");
+ }
+ try {
+ test_2d_path_rect_zero_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_rect_zero_1");
+ }
+ try {
+ test_2d_path_rect_zero_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_rect_zero_2");
+ }
+ try {
+ test_2d_path_rect_zero_3();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_rect_zero_3");
+ }
+ try {
+ test_2d_path_rect_zero_4();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_rect_zero_4");
+ }
+ try {
+ test_2d_path_rect_zero_5();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_rect_zero_5");
+ }
+ try {
+ test_2d_path_stroke_empty();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_stroke_empty");
+ }
+ try {
+ test_2d_path_stroke_overlap();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_stroke_overlap");
+ }
+ try {
+ test_2d_path_stroke_prune_arc();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_stroke_prune_arc");
+ }
+ try {
+ test_2d_path_stroke_prune_closed();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_stroke_prune_closed");
+ }
+ try {
+ test_2d_path_stroke_prune_corner();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_stroke_prune_corner");
+ }
+ try {
+ test_2d_path_stroke_prune_curve();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_stroke_prune_curve");
+ }
+ try {
+ test_2d_path_stroke_prune_line();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_stroke_prune_line");
+ }
+ try {
+ test_2d_path_stroke_prune_rect();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_stroke_prune_rect");
+ }
+ try {
+ test_2d_path_stroke_scale1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_stroke_scale1");
+ }
+ try {
+ test_2d_path_stroke_scale2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_stroke_scale2");
+ }
+ try {
+ test_2d_path_stroke_skew();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_stroke_skew");
+ }
+ try {
+ test_2d_path_stroke_unaffected();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_stroke_unaffected");
+ }
+ try {
+ test_2d_path_stroke_union();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_stroke_union");
+ }
+ try {
+ test_2d_path_transformation_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_transformation_basic");
+ }
+ try {
+ test_2d_path_transformation_changing();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_transformation_changing");
+ }
+ try {
+ test_2d_path_transformation_multiple();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_transformation_multiple");
+ }
+ try {
+ test_2d_pattern_animated_gif();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_animated_gif");
+ }
+ try {
+ test_2d_pattern_basic_canvas();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_basic_canvas");
+ }
+ try {
+ test_2d_pattern_basic_image();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_basic_image");
+ }
+ try {
+ test_2d_pattern_basic_nocontext();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_basic_nocontext");
+ }
+ try {
+ test_2d_pattern_basic_type();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_basic_type");
+ }
+ try {
+ test_2d_pattern_basic_zerocanvas();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_basic_zerocanvas");
+ }
+ try {
+ test_2d_pattern_crosscanvas();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_crosscanvas");
+ }
+ try {
+ test_2d_pattern_image_null();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_image_null");
+ }
+ try {
+ test_2d_pattern_image_string();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_image_string");
+ }
+ try {
+ test_2d_pattern_image_undefined();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_image_undefined");
+ }
+ try {
+ test_2d_pattern_modify_canvas1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_modify_canvas1");
+ }
+ try {
+ test_2d_pattern_modify_canvas2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_modify_canvas2");
+ }
+ try {
+ test_2d_pattern_modify_image1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_modify_image1");
+ }
+ try {
+ test_2d_pattern_modify_image2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_modify_image2");
+ }
+ try {
+ test_2d_pattern_paint_norepeat_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_paint_norepeat_basic");
+ }
+ try {
+ test_2d_pattern_paint_norepeat_coord1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_paint_norepeat_coord1");
+ }
+ try {
+ test_2d_pattern_paint_norepeat_coord2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_paint_norepeat_coord2");
+ }
+ try {
+ test_2d_pattern_paint_norepeat_coord3();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_paint_norepeat_coord3");
+ }
+ try {
+ test_2d_pattern_paint_norepeat_outside();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_paint_norepeat_outside");
+ }
+ try {
+ test_2d_pattern_paint_orientation_canvas();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_paint_orientation_canvas");
+ }
+ try {
+ test_2d_pattern_paint_orientation_image();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_paint_orientation_image");
+ }
+ try {
+ test_2d_pattern_paint_repeat_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_paint_repeat_basic");
+ }
+ try {
+ test_2d_pattern_paint_repeat_coord1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_paint_repeat_coord1");
+ }
+ try {
+ test_2d_pattern_paint_repeat_coord2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_paint_repeat_coord2");
+ }
+ try {
+ test_2d_pattern_paint_repeat_coord3();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_paint_repeat_coord3");
+ }
+ try {
+ test_2d_pattern_paint_repeat_outside();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_paint_repeat_outside");
+ }
+ try {
+ test_2d_pattern_paint_repeatx_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_paint_repeatx_basic");
+ }
+ try {
+ test_2d_pattern_paint_repeatx_coord1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_paint_repeatx_coord1");
+ }
+ try {
+ test_2d_pattern_paint_repeatx_outside();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_paint_repeatx_outside");
+ }
+ try {
+ test_2d_pattern_paint_repeaty_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_paint_repeaty_basic");
+ }
+ try {
+ test_2d_pattern_paint_repeaty_coord1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_paint_repeaty_coord1");
+ }
+ try {
+ test_2d_pattern_paint_repeaty_outside();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_paint_repeaty_outside");
+ }
+ try {
+ test_2d_pattern_repeat_case();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_repeat_case");
+ }
+ try {
+ test_2d_pattern_repeat_empty();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_repeat_empty");
+ }
+ try {
+ test_2d_pattern_repeat_null();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_repeat_null");
+ }
+ try {
+ test_2d_pattern_repeat_nullsuffix();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_repeat_nullsuffix");
+ }
+ try {
+ test_2d_pattern_repeat_undefined();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_repeat_undefined");
+ }
+ try {
+ test_2d_pattern_repeat_unrecognised();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_pattern_repeat_unrecognised");
+ }
+ try {
+ test_2d_scaled();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_scaled");
+ }
+ try {
+ test_2d_shadow_alpha_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_alpha_1");
+ }
+ try {
+ test_2d_shadow_alpha_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_alpha_2");
+ }
+ try {
+ test_2d_shadow_alpha_3();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_alpha_3");
+ }
+ try {
+ test_2d_shadow_alpha_4();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_alpha_4");
+ }
+ try {
+ test_2d_shadow_alpha_5();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_alpha_5");
+ }
+ try {
+ test_2d_shadow_attributes_shadowBlur_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_attributes_shadowBlur_1");
+ }
+ try {
+ test_2d_shadow_attributes_shadowBlur_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_attributes_shadowBlur_2");
+ }
+ try {
+ test_2d_shadow_attributes_shadowColor_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_attributes_shadowColor_1");
+ }
+ try {
+ test_2d_shadow_attributes_shadowColor_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_attributes_shadowColor_2");
+ }
+ try {
+ test_2d_shadow_attributes_shadowOffset_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_attributes_shadowOffset_1");
+ }
+ try {
+ test_2d_shadow_attributes_shadowOffset_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_attributes_shadowOffset_2");
+ }
+ try {
+ test_2d_shadow_basic_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_basic_1");
+ }
+ try {
+ test_2d_shadow_basic_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_basic_2");
+ }
+ try {
+ test_2d_shadow_blur_high();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_blur_high");
+ }
+ try {
+ test_2d_shadow_blur_low();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_blur_low");
+ }
+ try {
+ test_2d_shadow_canvas_alpha();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_canvas_alpha");
+ }
+ try {
+ test_2d_shadow_canvas_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_canvas_basic");
+ }
+ try {
+ test_2d_shadow_canvas_transparent_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_canvas_transparent_1");
+ }
+ try {
+ test_2d_shadow_canvas_transparent_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_canvas_transparent_2");
+ }
+ try {
+ test_2d_shadow_clip_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_clip_1");
+ }
+ try {
+ test_2d_shadow_clip_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_clip_2");
+ }
+ try {
+ test_2d_shadow_clip_3();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_clip_3");
+ }
+ try {
+ test_2d_shadow_composite_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_composite_1");
+ }
+ try {
+ test_2d_shadow_composite_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_composite_2");
+ }
+ try {
+ test_2d_shadow_gradient_alpha();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_gradient_alpha");
+ }
+ try {
+ test_2d_shadow_gradient_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_gradient_basic");
+ }
+ try {
+ test_2d_shadow_gradient_transparent_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_gradient_transparent_1");
+ }
+ try {
+ test_2d_shadow_gradient_transparent_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_gradient_transparent_2");
+ }
+ try {
+ test_2d_shadow_image_alpha();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_image_alpha");
+ }
+ try {
+ test_2d_shadow_image_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_image_basic");
+ }
+ try {
+ test_2d_shadow_image_scale();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_image_scale");
+ }
+ try {
+ test_2d_shadow_image_section();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_image_section");
+ }
+ try {
+ test_2d_shadow_image_transparent_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_image_transparent_1");
+ }
+ try {
+ test_2d_shadow_image_transparent_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_image_transparent_2");
+ }
+ try {
+ test_2d_shadow_offset_negativeX();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_offset_negativeX");
+ }
+ try {
+ test_2d_shadow_offset_negativeY();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_offset_negativeY");
+ }
+ try {
+ test_2d_shadow_offset_positiveX();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_offset_positiveX");
+ }
+ try {
+ test_2d_shadow_offset_positiveY();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_offset_positiveY");
+ }
+ try {
+ test_2d_shadow_outside();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_outside");
+ }
+ try {
+ test_2d_shadow_pattern_alpha();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_pattern_alpha");
+ }
+ try {
+ test_2d_shadow_pattern_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_pattern_basic");
+ }
+ try {
+ test_2d_shadow_pattern_transparent_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_pattern_transparent_1");
+ }
+ try {
+ test_2d_shadow_pattern_transparent_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_pattern_transparent_2");
+ }
+ try {
+ test_2d_shadow_stroke_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_stroke_basic");
+ }
+ try {
+ test_2d_shadow_stroke_cap_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_stroke_cap_1");
+ }
+ try {
+ test_2d_shadow_stroke_cap_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_stroke_cap_2");
+ }
+ try {
+ test_2d_shadow_stroke_join_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_stroke_join_1");
+ }
+ try {
+ test_2d_shadow_stroke_join_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_stroke_join_2");
+ }
+ try {
+ test_2d_shadow_stroke_join_3();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_stroke_join_3");
+ }
+ try {
+ test_2d_shadow_transform_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_transform_1");
+ }
+ try {
+ test_2d_shadow_transform_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_shadow_transform_2");
+ }
+ try {
+ test_2d_state_saverestore_bitmap();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_state_saverestore_bitmap");
+ }
+ try {
+ test_2d_state_saverestore_clip();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_state_saverestore_clip");
+ }
+ try {
+ test_2d_state_saverestore_fillStyle();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_state_saverestore_fillStyle");
+ }
+ try {
+ test_2d_state_saverestore_globalAlpha();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_state_saverestore_globalAlpha");
+ }
+ try {
+ test_2d_state_saverestore_globalCompositeOperation();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_state_saverestore_globalCompositeOperation");
+ }
+ try {
+ test_2d_state_saverestore_lineCap();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_state_saverestore_lineCap");
+ }
+ try {
+ test_2d_state_saverestore_lineJoin();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_state_saverestore_lineJoin");
+ }
+ try {
+ test_2d_state_saverestore_lineWidth();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_state_saverestore_lineWidth");
+ }
+ try {
+ test_2d_state_saverestore_miterLimit();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_state_saverestore_miterLimit");
+ }
+ try {
+ test_2d_state_saverestore_path();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_state_saverestore_path");
+ }
+ try {
+ test_2d_state_saverestore_shadowBlur();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_state_saverestore_shadowBlur");
+ }
+ try {
+ test_2d_state_saverestore_shadowColor();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_state_saverestore_shadowColor");
+ }
+ try {
+ test_2d_state_saverestore_shadowOffsetX();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_state_saverestore_shadowOffsetX");
+ }
+ try {
+ test_2d_state_saverestore_shadowOffsetY();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_state_saverestore_shadowOffsetY");
+ }
+ try {
+ test_2d_state_saverestore_stack();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_state_saverestore_stack");
+ }
+ try {
+ test_2d_state_saverestore_stackdepth();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_state_saverestore_stackdepth");
+ }
+ try {
+ test_2d_state_saverestore_strokeStyle();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_state_saverestore_strokeStyle");
+ }
+ try {
+ test_2d_state_saverestore_transformation();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_state_saverestore_transformation");
+ }
+ try {
+ test_2d_state_saverestore_underflow();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_state_saverestore_underflow");
+ }
+ try {
+ test_2d_strokeRect_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_strokeRect_basic");
+ }
+ try {
+ test_2d_strokeRect_clip();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_strokeRect_clip");
+ }
+ try {
+ test_2d_strokeRect_globalalpha();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_strokeRect_globalalpha");
+ }
+ try {
+ test_2d_strokeRect_globalcomposite();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_strokeRect_globalcomposite");
+ }
+ try {
+ test_2d_strokeRect_negative();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_strokeRect_negative");
+ }
+ try {
+ test_2d_strokeRect_nonfinite();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_strokeRect_nonfinite");
+ }
+ try {
+ test_2d_strokeRect_path();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_strokeRect_path");
+ }
+ try {
+ test_2d_strokeRect_shadow();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_strokeRect_shadow");
+ }
+ try {
+ test_2d_strokeRect_transform();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_strokeRect_transform");
+ }
+ try {
+ test_2d_strokeRect_zero_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_strokeRect_zero_1");
+ }
+ try {
+ test_2d_strokeRect_zero_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_strokeRect_zero_2");
+ }
+ try {
+ test_2d_strokeRect_zero_3();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_strokeRect_zero_3");
+ }
+ try {
+ test_2d_strokeRect_zero_4();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_strokeRect_zero_4");
+ }
+ try {
+ test_2d_strokeStyle_default();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_strokeStyle_default");
+ }
+ try {
+ test_2d_text_align_default();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_text_align_default");
+ }
+ try {
+ test_2d_text_align_invalid();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_text_align_invalid");
+ }
+ try {
+ test_2d_text_baseline_default();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_text_baseline_default");
+ }
+ try {
+ test_2d_text_baseline_invalid();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_text_baseline_invalid");
+ }
+ try {
+ test_2d_transformation_order();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_transformation_order");
+ }
+ try {
+ test_2d_transformation_rotate_direction();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_transformation_rotate_direction");
+ }
+ try {
+ test_2d_transformation_rotate_nonfinite();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_transformation_rotate_nonfinite");
+ }
+ try {
+ test_2d_transformation_rotate_radians();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_transformation_rotate_radians");
+ }
+ try {
+ test_2d_transformation_rotate_wrap();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_transformation_rotate_wrap");
+ }
+ try {
+ test_2d_transformation_rotate_wrapnegative();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_transformation_rotate_wrapnegative");
+ }
+ try {
+ test_2d_transformation_rotate_zero();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_transformation_rotate_zero");
+ }
+ try {
+ test_2d_transformation_scale_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_transformation_scale_basic");
+ }
+ try {
+ test_2d_transformation_scale_large();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_transformation_scale_large");
+ }
+ try {
+ test_2d_transformation_scale_multiple();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_transformation_scale_multiple");
+ }
+ try {
+ test_2d_transformation_scale_negative();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_transformation_scale_negative");
+ }
+ try {
+ test_2d_transformation_scale_nonfinite();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_transformation_scale_nonfinite");
+ }
+ try {
+ test_2d_transformation_scale_zero();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_transformation_scale_zero");
+ }
+ try {
+ test_2d_transformation_setTransform_multiple();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_transformation_setTransform_multiple");
+ }
+ try {
+ test_2d_transformation_setTransform_nonfinite();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_transformation_setTransform_nonfinite");
+ }
+ try {
+ test_2d_transformation_setTransform_skewed();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_transformation_setTransform_skewed");
+ }
+ try {
+ test_2d_transformation_transform_identity();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_transformation_transform_identity");
+ }
+ try {
+ test_2d_transformation_transform_multiply();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_transformation_transform_multiply");
+ }
+ try {
+ test_2d_transformation_transform_nonfinite();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_transformation_transform_nonfinite");
+ }
+ try {
+ test_2d_transformation_transform_skewed();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_transformation_transform_skewed");
+ }
+ try {
+ test_2d_transformation_translate_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_transformation_translate_basic");
+ }
+ try {
+ test_2d_transformation_translate_nonfinite();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_transformation_translate_nonfinite");
+ }
+ try {
+ test_2d_type_exists();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_type_exists");
+ }
+ try {
+ test_2d_type_extend();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_type_extend");
+ }
+ try {
+ test_2d_type_prototype();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_type_prototype");
+ }
+ try {
+ test_2d_type_replace();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_type_replace");
+ }
+ try {
+ test_2d_voidreturn();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_voidreturn");
+ }
+ try {
+ test_bug397524();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_bug397524");
+ }
+ try {
+ test_bug405982();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_bug405982");
+ }
+ try {
+ test_context_arguments_extra();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_context_arguments_extra");
+ }
+ try {
+ test_context_arguments_missing();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_context_arguments_missing");
+ }
+ try {
+ test_context_casesensitive();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_context_casesensitive");
+ }
+ try {
+ test_context_emptystring();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_context_emptystring");
+ }
+ try {
+ test_context_unrecognised_badname();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_context_unrecognised_badname");
+ }
+ try {
+ test_context_unrecognised_badsuffix();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_context_unrecognised_badsuffix");
+ }
+ try {
+ test_context_unrecognised_nullsuffix();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_context_unrecognised_nullsuffix");
+ }
+ try {
+ test_context_unrecognised_unicode();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_context_unrecognised_unicode");
+ }
+ try {
+ test_fallback_basic();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_fallback_basic");
+ }
+ try {
+ test_fallback_multiple();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_fallback_multiple");
+ }
+ try {
+ test_fallback_nested();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_fallback_nested");
+ }
+ try {
+ test_initial_colour();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_initial_colour");
+ }
+ try {
+ test_initial_reset_2dstate();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_initial_reset_2dstate");
+ }
+ try {
+ test_initial_reset_clip();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_initial_reset_clip");
+ }
+ try {
+ test_initial_reset_different();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_initial_reset_different");
+ }
+ try {
+ test_initial_reset_gradient();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_initial_reset_gradient");
+ }
+ try {
+ test_initial_reset_path();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_initial_reset_path");
+ }
+ try {
+ test_initial_reset_pattern();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_initial_reset_pattern");
+ }
+ try {
+ test_initial_reset_same();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_initial_reset_same");
+ }
+ try {
+ test_initial_reset_transform();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_initial_reset_transform");
+ }
+ try {
+ test_size_attributes_default();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_size_attributes_default");
+ }
+ try {
+ test_size_attributes();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_size_attributes");
+ }
+ try {
+ test_size_attributes_parse_badsuffix();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_size_attributes_parse_badsuffix");
+ }
+ try {
+ test_size_attributes_parse_floatsuffix();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_size_attributes_parse_floatsuffix");
+ }
+ try {
+ test_size_attributes_parse_negative();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_size_attributes_parse_negative");
+ }
+ try {
+ test_size_attributes_parse_nonnumber();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_size_attributes_parse_nonnumber");
+ }
+ try {
+ test_size_attributes_parse_percentsuffix();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_size_attributes_parse_percentsuffix");
+ }
+ try {
+ test_size_attributes_parse_whitespace();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_size_attributes_parse_whitespace");
+ }
+ try {
+ test_size_attributes_parse_zero();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_size_attributes_parse_zero");
+ }
+ try {
+ test_size_attributes_parse_zerosuffix();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_size_attributes_parse_zerosuffix");
+ }
+ try {
+ test_size_attributes_reflect_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_size_attributes_reflect_1");
+ }
+ try {
+ test_size_attributes_reflect_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_size_attributes_reflect_2");
+ }
+ try {
+ test_size_attributes_removed();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_size_attributes_removed");
+ }
+ try {
+ test_size_attributes_setAttribute_badsuffix();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_size_attributes_setAttribute_badsuffix");
+ }
+ try {
+ test_size_attributes_setAttribute_floatsuffix();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_size_attributes_setAttribute_floatsuffix");
+ }
+ try {
+ test_size_attributes_setAttribute_negative();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_size_attributes_setAttribute_negative");
+ }
+ try {
+ test_size_attributes_setAttribute_nonnumber();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_size_attributes_setAttribute_nonnumber");
+ }
+ try {
+ test_size_attributes_setAttribute_percentsuffix();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_size_attributes_setAttribute_percentsuffix");
+ }
+ try {
+ test_size_attributes_setAttribute_whitespace();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_size_attributes_setAttribute_whitespace");
+ }
+ try {
+ test_size_attributes_setAttribute_zero();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_size_attributes_setAttribute_zero");
+ }
+ try {
+ test_size_attributes_setAttribute_zerosuffix();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_size_attributes_setAttribute_zerosuffix");
+ }
+ try {
+ test_size_attributes_style();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_size_attributes_style");
+ }
+ try {
+ test_size_attributes_type_get();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_size_attributes_type_get");
+ }
+ try {
+ test_size_attributes_type_set();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_size_attributes_type_set");
+ }
+ try {
+ test_text_font();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_text_font");
+ }
+ try {
+ test_text_measure();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_text_measure");
+ }
+ try {
+ test_text_space_replace();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_text_space_replace");
+ }
+ try {
+ test_text_textAlign();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_text_textAlign");
+ }
+ try {
+ test_text_textBaseline();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_text_textBaseline");
+ }
+ try {
+ test_toDataURL_arguments_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_toDataURL_arguments_1");
+ }
+ try {
+ test_toDataURL_arguments_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_toDataURL_arguments_2");
+ }
+ try {
+ test_toDataURL_arguments_3();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_toDataURL_arguments_3");
+ }
+ try {
+ test_toDataURL_complexcolours();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_toDataURL_complexcolours");
+ }
+ try {
+ test_toDataURL_default();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_toDataURL_default");
+ }
+ try {
+ test_toDataURL_lowercase();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_toDataURL_lowercase");
+ }
+ try {
+ test_toDataURL_nocontext();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_toDataURL_nocontext");
+ }
+ try {
+ test_toDataURL_png();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_toDataURL_png");
+ }
+ try {
+ test_toDataURL_primarycolours();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_toDataURL_primarycolours");
+ }
+ try {
+ test_toDataURL_unrecognised();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_toDataURL_unrecognised");
+ }
+ try {
+ test_toDataURL_zerosize();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_toDataURL_zerosize");
+ }
+ try {
+ test_type_exists();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_type_exists");
+ }
+ try {
+ test_type_extend();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_type_extend");
+ }
+ try {
+ test_type_name();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_type_name");
+ }
+ try {
+ test_type_prototype();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_type_prototype");
+ }
+ try {
+ test_2d_imagedata_coercion();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imagedata_coercion");
+ }
+ try {
+ test_2d_imageSmoothing();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_imageSmoothing");
+ }
+ try {
+ test_zero_dimensions();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_zero_dimensions");
+ }
+ try {
+ test_zero_dimensions_imagedata();
+ } catch(e) {
+ ok(false, "unexpected exception thrown in: test_zero_dimensions_imagedata");
+ }
+ try {
+ test_getImageData_after_zero_canvas();
+ } catch(e) {
+ ok(false, "unexpected exception thrown in: test_getImageData_after_zero_canvas");
+ throw e;
+ }
+ try {
+ test_opaque();
+ } catch(e) {
+ ok(false, "unexpected exception thrown in: test_opaque");
+ throw e;
+ }
+ try {
+ test_2d_transformation_reset_transform();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_transformation_reset_transform");
+ }
+ try {
+ test_2d_path_ellipse_angle_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_ellipse_angle_1");
+ }
+ try {
+ test_2d_path_ellipse_angle_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_ellipse_angle_2");
+ }
+ try {
+ test_2d_path_ellipse_angle_3();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_ellipse_angle_3");
+ }
+ try {
+ test_2d_path_ellipse_angle_4();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_ellipse_angle_4");
+ }
+ try {
+ test_2d_path_ellipse_angle_5();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_ellipse_angle_5");
+ }
+ try {
+ test_2d_path_ellipse_angle_6();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_ellipse_angle_6");
+ }
+ try {
+ test_2d_path_ellipse_empty();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_ellipse_empty");
+ }
+ try {
+ test_2d_path_ellipse_end();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_ellipse_end");
+ }
+ try {
+ test_2d_path_ellipse_negative();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_ellipse_negative");
+ }
+ try {
+ test_2d_path_ellipse_nonempty();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_ellipse_nonempty");
+ }
+ try {
+ test_2d_path_ellipse_nonfinite();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_ellipse_nonfinite");
+ }
+ try {
+ test_2d_path_ellipse_scale_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_ellipse_scale_1");
+ }
+ try {
+ test_2d_path_ellipse_scale_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_ellipse_scale_2");
+ }
+ try {
+ test_2d_path_ellipse_selfintersect_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_ellipse_selfintersect_1");
+ }
+ try {
+ test_2d_path_ellipse_selfintersect_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_ellipse_selfintersect_2");
+ }
+ try {
+ test_2d_path_ellipse_shape_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_ellipse_shape_1");
+ }
+ try {
+ test_2d_path_ellipse_shape_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_ellipse_shape_2");
+ }
+ try {
+ test_2d_path_ellipse_shape_3();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_ellipse_shape_3");
+ }
+ try {
+ test_2d_path_ellipse_shape_4();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_ellipse_shape_4");
+ }
+ try {
+ test_2d_path_ellipse_twopie_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_ellipse_twopie_1");
+ }
+ try {
+ test_2d_path_ellipse_twopie_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_ellipse_twopie_2");
+ }
+ try {
+ test_2d_path_ellipse_twopie_3();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_ellipse_twopie_3");
+ }
+ try {
+ test_2d_path_ellipse_twopie_4();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_ellipse_twopie_4");
+ }
+ try {
+ test_2d_path_ellipse_zero_1();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_ellipse_zero_1");
+ }
+ try {
+ test_2d_path_ellipse_zero_2();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_ellipse_zero_2");
+ }
+ try {
+ test_2d_path_ellipse_zeroradius();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_ellipse_zeroradius");
+ }
+ try {
+ test_2d_path_ellipse_rotate();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_path_ellipse_rotate");
+ }
+ try {
+ // run this test last since it replaces the getContext method
+ test_type_replace();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_type_replace");
+ }
+ try {
+ test_2d_clearRect_testdoubleprecision();
+ } catch(e) {
+ ok(false, "unexpected exception thrown in: test_2d_clearRect_testdoubleprecision");
+ throw e;
+ }
+
+ //run the asynchronous tests
+ try {
+ test_2d_drawImage_animated_apng();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_animated_apng");
+ }
+ try {
+ test_2d_drawImage_animated_gif();
+ } catch (e) {
+ ok(false, "unexpected exception thrown in: test_2d_drawImage_animated_gif");
+ }
+
+ setTimeout(asyncTestsDone, 500);
+}
+
+addLoadEvent(runTests);
+
+</script>