content/canvas/test/test_canvas.html

Thu, 15 Jan 2015 21:03:48 +0100

author
Michael Schloh von Bennewitz <michael@schloh.com>
date
Thu, 15 Jan 2015 21:03:48 +0100
branch
TOR_BUG_9701
changeset 11
deefc01c0e14
permissions
-rw-r--r--

Integrate friendly tips from Tor colleagues to make (or not) 4.5 alpha 3;
This includes removal of overloaded (but unused) methods, and addition of
a overlooked call to DataStruct::SetData(nsISupports, uint32_t, bool.)

     1 <!DOCTYPE HTML>
     2 <title>Canvas Tests</title>
     3 <script src="/tests/SimpleTest/SimpleTest.js"></script>
     4 <link rel="stylesheet" href="/tests/SimpleTest/test.css">
     5 <body>
     6 <script>
     8 SimpleTest.waitForExplicitFinish();
     9 const Cc = SpecialPowers.Cc;
    10 const Cr = SpecialPowers.Cr;
    12 function IsD2DEnabled() {
    13     var enabled = false;
    15     try {
    16         enabled = Cc["@mozilla.org/gfx/info;1"].getService(SpecialPowers.Ci.nsIGfxInfo).D2DEnabled;
    17     } catch(e) {}
    19     return enabled;
    20 }
    22 function IsLinux() {
    23     var os = "";
    25     try {
    26         os = Cc["@mozilla.org/xre/app-info;1"]
    27           .getService(SpecialPowers.Ci.nsIXULRuntime).OS;
    28     } catch (e) {}
    30     return os.indexOf("Linux") == 0 &&
    31            navigator.appVersion.indexOf("Android") == -1;
    32 }
    34 function IsMacOSX10_5orOlder() {
    35     var is105orOlder = false;
    37     if (navigator.platform.indexOf("Mac") == 0) {
    38         var version = Cc["@mozilla.org/system-info;1"]
    39                         .getService(SpecialPowers.Ci.nsIPropertyBag2)
    40                         .getProperty("version");
    41         // the next line is correct: Mac OS 10.6 corresponds to Darwin version 10 !
    42         // Mac OS 10.5 would be Darwin version 9. the |version| string we've got here
    43         // is the Darwin version.
    44         is105orOlder = (parseFloat(version) < 10.0);
    45     }
    46     return is105orOlder;
    47 }
    50 function IsAzureSkia() {
    51   var enabled = false;
    53   try {
    54     var backend = Cc["@mozilla.org/gfx/info;1"].getService(SpecialPowers.Ci.nsIGfxInfo).getInfo().AzureCanvasBackend;
    55     enabled = (backend == "skia");
    56   } catch (e) { }
    58   return enabled;
    59 }
    61 function IsAcceleratedSkia() {
    62   var enabled = false;
    64   try {
    65     var props = Cc["@mozilla.org/gfx/info;1"].getService(SpecialPowers.Ci.nsIGfxInfo).getInfo();
    66     enabled = props.AzureCanvasBackend == "skia" && props.AzureSkiaAccelerated;
    67   } catch(e) { }
    69   return enabled;
    70 }
    72 function IsAzureCairo() {
    73   var enabled = false;
    75   try {
    76     var backend = Cc["@mozilla.org/gfx/info;1"].getService(SpecialPowers.Ci.nsIGfxInfo).getInfo().AzureCanvasBackend;
    77     enabled = (backend == "cairo");
    78   } catch (e) { }
    80   return enabled;
    81 }
    83 </script>
    84 <!-- Includes all the tests in the content/canvas/tests except for test_bug397524.html -->
    86 <!-- [[[ test_2d.canvas.readonly.html ]]] -->
    88 <p>Canvas test: 2d.canvas.readonly</p>
    89 <!-- Testing: CanvasRenderingContext2D.canvas is readonly -->
    90 <canvas id="c1" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
    91 <script>
    93 function test_2d_canvas_readonly() {
    95 var canvas = document.getElementById('c1');
    96 var ctx = canvas.getContext('2d');
    98 var c = document.createElement('canvas');
    99 var d = ctx.canvas;
   100 ok(c !== d, "c !== d");
   101 try { ctx.canvas = c; } catch (e) {} // not sure whether this should throw or not...
   102 ok(ctx.canvas === d, "ctx.canvas === d");
   105 }
   106 </script>
   108 <!-- [[[ test_2d.canvas.reference.html ]]] -->
   110 <p>Canvas test: 2d.canvas.reference</p>
   111 <!-- Testing: CanvasRenderingContext2D.canvas refers back to its canvas -->
   112 <canvas id="c2" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
   113 <script>
   115 function test_2d_canvas_reference() {
   117 var canvas = document.getElementById('c2');
   118 var ctx = canvas.getContext('2d');
   120 ok(ctx.canvas === canvas, "ctx.canvas === canvas");
   123 }
   124 </script>
   126 <!-- [[[ test_2d.clearRect.basic.html ]]] -->
   128 <p>Canvas test: 2d.clearRect.basic</p>
   129 <canvas id="c3" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
   130 <script>
   131 function isPixel(ctx, x,y, r,g,b,a, d) {
   132 	var pos = x + "," + y;
   133 	var colour = r + "," + g + "," + b + "," + a;
   134     var pixel = ctx.getImageData(x, y, 1, 1);
   135     var pr = pixel.data[0],
   136         pg = pixel.data[1],
   137         pb = pixel.data[2],
   138         pa = pixel.data[3];
   139     ok(r-d <= pr && pr <= r+d &&
   140        g-d <= pg && pg <= g+d &&
   141        b-d <= pb && pb <= b+d &&
   142        a-d <= pa && pa <= a+d,
   143        "pixel "+pos+" of "+ctx.canvas.id+" is "+pr+","+pg+","+pb+","+pa+"; expected "+colour+" +/- "+d);
   144 }
   146 function test_2d_clearRect_basic() {
   148 var canvas = document.getElementById('c3');
   149 var ctx = canvas.getContext('2d');
   151 ctx.fillStyle = '#f00';
   152 ctx.fillRect(0, 0, 100, 50);
   153 ctx.clearRect(0, 0, 100, 50);
   154 isPixel(ctx, 50,25, 0,0,0,0, 0);
   157 }
   158 </script>
   160 <!-- [[[ test_2d.clearRect.clip.html ]]] -->
   162 <p>Canvas test: 2d.clearRect.clip</p>
   163 <canvas id="c4" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
   164 <script>
   167 function test_2d_clearRect_clip() {
   169 var canvas = document.getElementById('c4');
   170 var ctx = canvas.getContext('2d');
   172 ctx.fillStyle = '#0f0';
   173 ctx.fillRect(0, 0, 100, 50);
   175 ctx.beginPath();
   176 ctx.rect(0, 0, 16, 16);
   177 ctx.clip();
   179 ctx.clearRect(0, 0, 100, 50);
   181 ctx.fillStyle = '#0f0';
   182 ctx.fillRect(0, 0, 16, 16);
   184 isPixel(ctx, 50,25, 0,255,0,255, 0);
   187 }
   188 </script>
   190 <!-- [[[ test_2d.clearRect.globalalpha.html ]]] -->
   192 <p>Canvas test: 2d.clearRect.globalalpha</p>
   193 <canvas id="c5" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
   194 <script>
   197 function test_2d_clearRect_globalalpha() {
   199 var canvas = document.getElementById('c5');
   200 var ctx = canvas.getContext('2d');
   202 ctx.fillStyle = '#f00';
   203 ctx.fillRect(0, 0, 100, 50);
   204 ctx.globalAlpha = 0.1;
   205 ctx.clearRect(0, 0, 100, 50);
   206 isPixel(ctx, 50,25, 0,0,0,0, 0);
   209 }
   210 </script>
   212 <!-- [[[ test_2d.clearRect.globalcomposite.html ]]] -->
   214 <p>Canvas test: 2d.clearRect.globalcomposite</p>
   215 <canvas id="c6" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
   216 <script>
   219 function test_2d_clearRect_globalcomposite() {
   221 var canvas = document.getElementById('c6');
   222 var ctx = canvas.getContext('2d');
   224 ctx.fillStyle = '#f00';
   225 ctx.fillRect(0, 0, 100, 50);
   226 ctx.globalCompositeOperation = 'destination-atop';
   227 ctx.clearRect(0, 0, 100, 50);
   228 isPixel(ctx, 50,25, 0,0,0,0, 0);
   231 }
   232 </script>
   234 <!-- [[[ test_2d.clearRect.negative.html ]]] -->
   236 <p>Canvas test: 2d.clearRect.negative</p>
   237 <canvas id="c7" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
   238 <script>
   241 function test_2d_clearRect_negative() {
   243 var canvas = document.getElementById('c7');
   244 var ctx = canvas.getContext('2d');
   246 ctx.fillStyle = '#f00';
   247 ctx.fillRect(0, 0, 100, 50);
   248 ctx.clearRect(0, 0, 50, 25);
   249 ctx.clearRect(100, 0, -50, 25);
   250 ctx.clearRect(0, 50, 50, -25);
   251 ctx.clearRect(100, 50, -50, -25);
   252 isPixel(ctx, 25,12, 0,0,0,0, 0);
   253 isPixel(ctx, 75,12, 0,0,0,0, 0);
   254 isPixel(ctx, 25,37, 0,0,0,0, 0);
   255 isPixel(ctx, 75,37, 0,0,0,0, 0);
   258 }
   259 </script>
   261 <!-- [[[ test_2d.clearRect.nonfinite.html ]]] -->
   263 <p>Canvas test: 2d.clearRect.nonfinite</p>
   264 <!-- Testing: clearRect() with Infinity/NaN is ignored -->
   265 <canvas id="c8" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
   266 <script>
   269 function test_2d_clearRect_nonfinite() {
   271 var canvas = document.getElementById('c8');
   272 var ctx = canvas.getContext('2d');
   274 var _thrown_outer = false;
   275 try {
   277 ctx.fillStyle = '#0f0';
   278 ctx.fillRect(0, 0, 100, 50);
   280 ctx.clearRect(Infinity, 0, 100, 50);
   281 ctx.clearRect(-Infinity, 0, 100, 50);
   282 ctx.clearRect(NaN, 0, 100, 50);
   283 ctx.clearRect(0, Infinity, 100, 50);
   284 ctx.clearRect(0, -Infinity, 100, 50);
   285 ctx.clearRect(0, NaN, 100, 50);
   286 ctx.clearRect(0, 0, Infinity, 50);
   287 ctx.clearRect(0, 0, -Infinity, 50);
   288 ctx.clearRect(0, 0, NaN, 50);
   289 ctx.clearRect(0, 0, 100, Infinity);
   290 ctx.clearRect(0, 0, 100, -Infinity);
   291 ctx.clearRect(0, 0, 100, NaN);
   292 ctx.clearRect(Infinity, Infinity, 100, 50);
   293 ctx.clearRect(Infinity, Infinity, Infinity, 50);
   294 ctx.clearRect(Infinity, Infinity, Infinity, Infinity);
   295 ctx.clearRect(Infinity, Infinity, 100, Infinity);
   296 ctx.clearRect(Infinity, 0, Infinity, 50);
   297 ctx.clearRect(Infinity, 0, Infinity, Infinity);
   298 ctx.clearRect(Infinity, 0, 100, Infinity);
   299 ctx.clearRect(0, Infinity, Infinity, 50);
   300 ctx.clearRect(0, Infinity, Infinity, Infinity);
   301 ctx.clearRect(0, Infinity, 100, Infinity);
   302 ctx.clearRect(0, 0, Infinity, Infinity);
   304 isPixel(ctx, 50,25, 0,255,0,255, 0);
   306 } catch (e) {
   307     _thrown_outer = true;
   308 }
   309 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
   312 }
   313 </script>
   315 <!-- [[[ test_2d.clearRect.path.html ]]] -->
   317 <p>Canvas test: 2d.clearRect.path</p>
   318 <canvas id="c9" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
   319 <script>
   322 function test_2d_clearRect_path() {
   324 var canvas = document.getElementById('c9');
   325 var ctx = canvas.getContext('2d');
   327 ctx.fillStyle = '#0f0';
   328 ctx.beginPath();
   329 ctx.rect(0, 0, 100, 50);
   330 ctx.clearRect(0, 0, 16, 16);
   331 ctx.fill();
   332 isPixel(ctx, 50,25, 0,255,0,255, 0);
   335 }
   336 </script>
   338 <!-- [[[ test_2d.clearRect.shadow.html ]]] -->
   340 <p>Canvas test: 2d.clearRect.shadow</p>
   341 <canvas id="c10" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
   342 <script>
   345 function test_2d_clearRect_shadow() {
   347 var canvas = document.getElementById('c10');
   348 var ctx = canvas.getContext('2d');
   350 ctx.fillStyle = '#0f0';
   351 ctx.fillRect(0, 0, 100, 50);
   352 ctx.shadowColor = '#f00';
   353 ctx.shadowBlur = 0;
   354 ctx.shadowOffsetX = 0;
   355 ctx.shadowOffsetY = 50;
   356 ctx.clearRect(0, -50, 100, 50);
   357 isPixel(ctx, 50,25, 0,255,0,255, 0);
   360 }
   361 </script>
   363 <!-- [[[ test_2d.clearRect.transform.html ]]] -->
   365 <p>Canvas test: 2d.clearRect.transform</p>
   366 <canvas id="c11" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
   367 <script>
   370 function test_2d_clearRect_transform() {
   372 var canvas = document.getElementById('c11');
   373 var ctx = canvas.getContext('2d');
   375 ctx.fillStyle = '#f00';
   376 ctx.fillRect(0, 0, 100, 50);
   377 ctx.scale(10, 10);
   378 ctx.translate(0, 5);
   379 ctx.clearRect(0, -5, 10, 5);
   380 isPixel(ctx, 50,25, 0,0,0,0, 0);
   383 }
   384 </script>
   386 <!-- [[[ test_2d.clearRect.zero.html ]]] -->
   388 <p>Canvas test: 2d.clearRect.zero</p>
   389 <canvas id="c12" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
   390 <script>
   393 function test_2d_clearRect_zero() {
   395 var canvas = document.getElementById('c12');
   396 var ctx = canvas.getContext('2d');
   398 ctx.fillStyle = '#0f0';
   399 ctx.fillRect(0, 0, 100, 50);
   400 ctx.clearRect(0, 0, 100, 0);
   401 ctx.clearRect(0, 0, 0, 50);
   402 ctx.clearRect(0, 0, 0, 0);
   403 isPixel(ctx, 50,25, 0,255,0,255, 0);
   406 }
   407 </script>
   409 <!-- [[[ test_2d.composite.canvas.copy.html ]]] -->
   411 <p>Canvas test: 2d.composite.canvas.copy</p>
   412 <canvas id="c13" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
   413 <script>
   416 function test_2d_composite_canvas_copy() {
   418 var canvas = document.getElementById('c13');
   419 var ctx = canvas.getContext('2d');
   422 var canvas2 = document.createElement('canvas');
   423 canvas2.width = canvas.width;
   424 canvas2.height = canvas.height;
   425 var ctx2 = canvas2.getContext('2d');
   426 ctx2.drawImage(document.getElementById('yellow75_1.png'), 0, 0);
   427 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
   428 ctx.fillRect(0, 0, 100, 50);
   429 ctx.globalCompositeOperation = 'copy';
   430 ctx.drawImage(canvas2, 0, 0);
   431 isPixel(ctx, 50,25, 255,255,0,191, 5);
   434 }
   435 </script>
   436 <img src="image_yellow75.png" id="yellow75_1.png" class="resource">
   438 <!-- [[[ test_2d.composite.canvas.destination-atop.html ]]] -->
   440 <p>Canvas test: 2d.composite.canvas.destination-atop</p>
   441 <canvas id="c14" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
   442 <script>
   445 function test_2d_composite_canvas_destination_atop() {
   447 var canvas = document.getElementById('c14');
   448 var ctx = canvas.getContext('2d');
   451 var canvas2 = document.createElement('canvas');
   452 canvas2.width = canvas.width;
   453 canvas2.height = canvas.height;
   454 var ctx2 = canvas2.getContext('2d');
   455 ctx2.drawImage(document.getElementById('yellow75_2.png'), 0, 0);
   456 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
   457 ctx.fillRect(0, 0, 100, 50);
   458 ctx.globalCompositeOperation = 'destination-atop';
   459 ctx.drawImage(canvas2, 0, 0);
   460 isPixel(ctx, 50,25, 127,255,127,191, 5);
   463 }
   464 </script>
   465 <img src="image_yellow75.png" id="yellow75_2.png" class="resource">
   467 <!-- [[[ test_2d.composite.canvas.destination-in.html ]]] -->
   469 <p>Canvas test: 2d.composite.canvas.destination-in</p>
   470 <canvas id="c15" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
   471 <script>
   474 function test_2d_composite_canvas_destination_in() {
   476 var canvas = document.getElementById('c15');
   477 var ctx = canvas.getContext('2d');
   480 var canvas2 = document.createElement('canvas');
   481 canvas2.width = canvas.width;
   482 canvas2.height = canvas.height;
   483 var ctx2 = canvas2.getContext('2d');
   484 ctx2.drawImage(document.getElementById('yellow75_3.png'), 0, 0);
   485 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
   486 ctx.fillRect(0, 0, 100, 50);
   487 ctx.globalCompositeOperation = 'destination-in';
   488 ctx.drawImage(canvas2, 0, 0);
   489 isPixel(ctx, 50,25, 0,255,255,95, 5);
   492 }
   493 </script>
   494 <img src="image_yellow75.png" id="yellow75_3.png" class="resource">
   496 <!-- [[[ test_2d.composite.canvas.destination-out.html ]]] -->
   498 <p>Canvas test: 2d.composite.canvas.destination-out</p>
   499 <canvas id="c16" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
   500 <script>
   503 function test_2d_composite_canvas_destination_out() {
   505 var canvas = document.getElementById('c16');
   506 var ctx = canvas.getContext('2d');
   509 var canvas2 = document.createElement('canvas');
   510 canvas2.width = canvas.width;
   511 canvas2.height = canvas.height;
   512 var ctx2 = canvas2.getContext('2d');
   513 ctx2.drawImage(document.getElementById('yellow75_4.png'), 0, 0);
   514 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
   515 ctx.fillRect(0, 0, 100, 50);
   516 ctx.globalCompositeOperation = 'destination-out';
   517 ctx.drawImage(canvas2, 0, 0);
   518 isPixel(ctx, 50,25, 0,255,255,31, 5);
   521 }
   522 </script>
   523 <img src="image_yellow75.png" id="yellow75_4.png" class="resource">
   525 <!-- [[[ test_2d.composite.canvas.destination-over.html ]]] -->
   527 <p>Canvas test: 2d.composite.canvas.destination-over</p>
   528 <canvas id="c17" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
   529 <script>
   532 function test_2d_composite_canvas_destination_over() {
   534 var canvas = document.getElementById('c17');
   535 var ctx = canvas.getContext('2d');
   538 var canvas2 = document.createElement('canvas');
   539 canvas2.width = canvas.width;
   540 canvas2.height = canvas.height;
   541 var ctx2 = canvas2.getContext('2d');
   542 ctx2.drawImage(document.getElementById('yellow75_5.png'), 0, 0);
   543 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
   544 ctx.fillRect(0, 0, 100, 50);
   545 ctx.globalCompositeOperation = 'destination-over';
   546 ctx.drawImage(canvas2, 0, 0);
   547 isPixel(ctx, 50,25, 109,255,145,223, 5);
   550 }
   551 </script>
   552 <img src="image_yellow75.png" id="yellow75_5.png" class="resource">
   554 <!-- [[[ test_2d.composite.canvas.lighter.html ]]] -->
   556 <p>Canvas test: 2d.composite.canvas.lighter</p>
   557 <canvas id="c18" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
   558 <script>
   561 function test_2d_composite_canvas_lighter() {
   563 var canvas = document.getElementById('c18');
   564 var ctx = canvas.getContext('2d');
   567 var canvas2 = document.createElement('canvas');
   568 canvas2.width = canvas.width;
   569 canvas2.height = canvas.height;
   570 var ctx2 = canvas2.getContext('2d');
   571 ctx2.drawImage(document.getElementById('yellow75_6.png'), 0, 0);
   572 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
   573 ctx.fillRect(0, 0, 100, 50);
   574 ctx.globalCompositeOperation = 'lighter';
   575 ctx.drawImage(canvas2, 0, 0);
   576 isPixel(ctx, 50,25, 191,255,127,255, 5);
   579 }
   580 </script>
   581 <img src="image_yellow75.png" id="yellow75_6.png" class="resource">
   583 <!-- [[[ test_2d.composite.canvas.source-atop.html ]]] -->
   585 <p>Canvas test: 2d.composite.canvas.source-atop</p>
   586 <canvas id="c19" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
   587 <script>
   590 function test_2d_composite_canvas_source_atop() {
   592 var canvas = document.getElementById('c19');
   593 var ctx = canvas.getContext('2d');
   596 var canvas2 = document.createElement('canvas');
   597 canvas2.width = canvas.width;
   598 canvas2.height = canvas.height;
   599 var ctx2 = canvas2.getContext('2d');
   600 ctx2.drawImage(document.getElementById('yellow75_7.png'), 0, 0);
   601 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
   602 ctx.fillRect(0, 0, 100, 50);
   603 ctx.globalCompositeOperation = 'source-atop';
   604 ctx.drawImage(canvas2, 0, 0);
   605 isPixel(ctx, 50,25, 191,255,63,127, 5);
   608 }
   609 </script>
   610 <img src="image_yellow75.png" id="yellow75_7.png" class="resource">
   612 <!-- [[[ test_2d.composite.canvas.source-in.html ]]] -->
   614 <p>Canvas test: 2d.composite.canvas.source-in</p>
   615 <canvas id="c20" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
   616 <script>
   619 function test_2d_composite_canvas_source_in() {
   621 var canvas = document.getElementById('c20');
   622 var ctx = canvas.getContext('2d');
   625 var canvas2 = document.createElement('canvas');
   626 canvas2.width = canvas.width;
   627 canvas2.height = canvas.height;
   628 var ctx2 = canvas2.getContext('2d');
   629 ctx2.drawImage(document.getElementById('yellow75_8.png'), 0, 0);
   630 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
   631 ctx.fillRect(0, 0, 100, 50);
   632 ctx.globalCompositeOperation = 'source-in';
   633 ctx.drawImage(canvas2, 0, 0);
   634 isPixel(ctx, 50,25, 255,255,0,95, 5);
   637 }
   638 </script>
   639 <img src="image_yellow75.png" id="yellow75_8.png" class="resource">
   641 <!-- [[[ test_2d.composite.canvas.source-out.html ]]] -->
   643 <p>Canvas test: 2d.composite.canvas.source-out</p>
   644 <canvas id="c21" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
   645 <script>
   648 function test_2d_composite_canvas_source_out() {
   650 var canvas = document.getElementById('c21');
   651 var ctx = canvas.getContext('2d');
   654 var canvas2 = document.createElement('canvas');
   655 canvas2.width = canvas.width;
   656 canvas2.height = canvas.height;
   657 var ctx2 = canvas2.getContext('2d');
   658 ctx2.drawImage(document.getElementById('yellow75_9.png'), 0, 0);
   659 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
   660 ctx.fillRect(0, 0, 100, 50);
   661 ctx.globalCompositeOperation = 'source-out';
   662 ctx.drawImage(canvas2, 0, 0);
   663 isPixel(ctx, 50,25, 255,255,0,95, 5);
   666 }
   667 </script>
   668 <img src="image_yellow75.png" id="yellow75_9.png" class="resource">
   670 <!-- [[[ test_2d.composite.canvas.source-over.html ]]] -->
   672 <p>Canvas test: 2d.composite.canvas.source-over</p>
   673 <canvas id="c22" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
   674 <script>
   677 function test_2d_composite_canvas_source_over() {
   679 var canvas = document.getElementById('c22');
   680 var ctx = canvas.getContext('2d');
   683 var canvas2 = document.createElement('canvas');
   684 canvas2.width = canvas.width;
   685 canvas2.height = canvas.height;
   686 var ctx2 = canvas2.getContext('2d');
   687 ctx2.drawImage(document.getElementById('yellow75_10.png'), 0, 0);
   688 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
   689 ctx.fillRect(0, 0, 100, 50);
   690 ctx.globalCompositeOperation = 'source-over';
   691 ctx.drawImage(canvas2, 0, 0);
   692 isPixel(ctx, 50,25, 218,255,36,223, 5);
   695 }
   696 </script>
   697 <img src="image_yellow75.png" id="yellow75_10.png" class="resource">
   699 <!-- [[[ test_2d.composite.canvas.xor.html ]]] -->
   701 <p>Canvas test: 2d.composite.canvas.xor</p>
   702 <canvas id="c23" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
   703 <script>
   706 function test_2d_composite_canvas_xor() {
   708 var canvas = document.getElementById('c23');
   709 var ctx = canvas.getContext('2d');
   712 var canvas2 = document.createElement('canvas');
   713 canvas2.width = canvas.width;
   714 canvas2.height = canvas.height;
   715 var ctx2 = canvas2.getContext('2d');
   716 ctx2.drawImage(document.getElementById('yellow75_11.png'), 0, 0);
   717 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
   718 ctx.fillRect(0, 0, 100, 50);
   719 ctx.globalCompositeOperation = 'xor';
   720 ctx.drawImage(canvas2, 0, 0);
   721 isPixel(ctx, 50,25, 191,255,63,127, 5);
   724 }
   725 </script>
   726 <img src="image_yellow75.png" id="yellow75_11.png" class="resource">
   728 <!-- [[[ test_2d.composite.clip.copy.html ]]] -->
   730 <p>Canvas test: 2d.composite.clip.copy</p>
   731 <!-- Testing: fill() does not affect pixels outside the clip region. -->
   732 <canvas id="c24" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
   733 <script>
   736 function test_2d_composite_clip_copy() {
   738 var canvas = document.getElementById('c24');
   739 var ctx = canvas.getContext('2d');
   742 ctx.fillStyle = '#0f0';
   743 ctx.fillRect(0, 0, 100, 50);
   744 ctx.globalCompositeOperation = 'copy';
   745 ctx.rect(-20, -20, 10, 10);
   746 ctx.clip();
   747 ctx.fillStyle = '#f00';
   748 ctx.fillRect(0, 0, 50, 50);
   749 isPixel(ctx, 25,25, 0,255,0,255, 0);
   750 isPixel(ctx, 75,25, 0,255,0,255, 0);
   753 }
   754 </script>
   756 <!-- [[[ test_2d.composite.clip.destination-atop.html ]]] -->
   758 <p>Canvas test: 2d.composite.clip.destination-atop</p>
   759 <!-- Testing: fill() does not affect pixels outside the clip region. -->
   760 <canvas id="c25" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
   761 <script>
   764 function test_2d_composite_clip_destination_atop() {
   766 var canvas = document.getElementById('c25');
   767 var ctx = canvas.getContext('2d');
   770 ctx.fillStyle = '#0f0';
   771 ctx.fillRect(0, 0, 100, 50);
   772 ctx.globalCompositeOperation = 'destination-atop';
   773 ctx.rect(-20, -20, 10, 10);
   774 ctx.clip();
   775 ctx.fillStyle = '#f00';
   776 ctx.fillRect(0, 0, 50, 50);
   777 isPixel(ctx, 25,25, 0,255,0,255, 0);
   778 isPixel(ctx, 75,25, 0,255,0,255, 0);
   781 }
   782 </script>
   784 <!-- [[[ test_2d.composite.clip.destination-in.html ]]] -->
   786 <p>Canvas test: 2d.composite.clip.destination-in</p>
   787 <!-- Testing: fill() does not affect pixels outside the clip region. -->
   788 <canvas id="c26" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
   789 <script>
   792 function test_2d_composite_clip_destination_in() {
   794 var canvas = document.getElementById('c26');
   795 var ctx = canvas.getContext('2d');
   798 ctx.fillStyle = '#0f0';
   799 ctx.fillRect(0, 0, 100, 50);
   800 ctx.globalCompositeOperation = 'destination-in';
   801 ctx.rect(-20, -20, 10, 10);
   802 ctx.clip();
   803 ctx.fillStyle = '#f00';
   804 ctx.fillRect(0, 0, 50, 50);
   805 isPixel(ctx, 25,25, 0,255,0,255, 0);
   806 isPixel(ctx, 75,25, 0,255,0,255, 0);
   809 }
   810 </script>
   812 <!-- [[[ test_2d.composite.clip.destination-out.html ]]] -->
   814 <p>Canvas test: 2d.composite.clip.destination-out</p>
   815 <!-- Testing: fill() does not affect pixels outside the clip region. -->
   816 <canvas id="c27" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
   817 <script>
   820 function test_2d_composite_clip_destination_out() {
   822 var canvas = document.getElementById('c27');
   823 var ctx = canvas.getContext('2d');
   826 ctx.fillStyle = '#0f0';
   827 ctx.fillRect(0, 0, 100, 50);
   828 ctx.globalCompositeOperation = 'destination-out';
   829 ctx.rect(-20, -20, 10, 10);
   830 ctx.clip();
   831 ctx.fillStyle = '#f00';
   832 ctx.fillRect(0, 0, 50, 50);
   833 isPixel(ctx, 25,25, 0,255,0,255, 0);
   834 isPixel(ctx, 75,25, 0,255,0,255, 0);
   837 }
   838 </script>
   840 <!-- [[[ test_2d.composite.clip.destination-over.html ]]] -->
   842 <p>Canvas test: 2d.composite.clip.destination-over</p>
   843 <!-- Testing: fill() does not affect pixels outside the clip region. -->
   844 <canvas id="c28" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
   845 <script>
   848 function test_2d_composite_clip_destination_over() {
   850 var canvas = document.getElementById('c28');
   851 var ctx = canvas.getContext('2d');
   854 ctx.fillStyle = '#0f0';
   855 ctx.fillRect(0, 0, 100, 50);
   856 ctx.globalCompositeOperation = 'destination-over';
   857 ctx.rect(-20, -20, 10, 10);
   858 ctx.clip();
   859 ctx.fillStyle = '#f00';
   860 ctx.fillRect(0, 0, 50, 50);
   861 isPixel(ctx, 25,25, 0,255,0,255, 0);
   862 isPixel(ctx, 75,25, 0,255,0,255, 0);
   865 }
   866 </script>
   868 <!-- [[[ test_2d.composite.clip.lighter.html ]]] -->
   870 <p>Canvas test: 2d.composite.clip.lighter</p>
   871 <!-- Testing: fill() does not affect pixels outside the clip region. -->
   872 <canvas id="c29" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
   873 <script>
   876 function test_2d_composite_clip_lighter() {
   878 var canvas = document.getElementById('c29');
   879 var ctx = canvas.getContext('2d');
   882 ctx.fillStyle = '#0f0';
   883 ctx.fillRect(0, 0, 100, 50);
   884 ctx.globalCompositeOperation = 'lighter';
   885 ctx.rect(-20, -20, 10, 10);
   886 ctx.clip();
   887 ctx.fillStyle = '#f00';
   888 ctx.fillRect(0, 0, 50, 50);
   889 isPixel(ctx, 25,25, 0,255,0,255, 0);
   890 isPixel(ctx, 75,25, 0,255,0,255, 0);
   893 }
   894 </script>
   896 <!-- [[[ test_2d.composite.clip.source-atop.html ]]] -->
   898 <p>Canvas test: 2d.composite.clip.source-atop</p>
   899 <!-- Testing: fill() does not affect pixels outside the clip region. -->
   900 <canvas id="c30" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
   901 <script>
   904 function test_2d_composite_clip_source_atop() {
   906 var canvas = document.getElementById('c30');
   907 var ctx = canvas.getContext('2d');
   910 ctx.fillStyle = '#0f0';
   911 ctx.fillRect(0, 0, 100, 50);
   912 ctx.globalCompositeOperation = 'source-atop';
   913 ctx.rect(-20, -20, 10, 10);
   914 ctx.clip();
   915 ctx.fillStyle = '#f00';
   916 ctx.fillRect(0, 0, 50, 50);
   917 isPixel(ctx, 25,25, 0,255,0,255, 0);
   918 isPixel(ctx, 75,25, 0,255,0,255, 0);
   921 }
   922 </script>
   924 <!-- [[[ test_2d.composite.clip.source-in.html ]]] -->
   926 <p>Canvas test: 2d.composite.clip.source-in</p>
   927 <!-- Testing: fill() does not affect pixels outside the clip region. -->
   928 <canvas id="c31" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
   929 <script>
   932 function test_2d_composite_clip_source_in() {
   934 var canvas = document.getElementById('c31');
   935 var ctx = canvas.getContext('2d');
   938 ctx.fillStyle = '#0f0';
   939 ctx.fillRect(0, 0, 100, 50);
   940 ctx.globalCompositeOperation = 'source-in';
   941 ctx.rect(-20, -20, 10, 10);
   942 ctx.clip();
   943 ctx.fillStyle = '#f00';
   944 ctx.fillRect(0, 0, 50, 50);
   945 isPixel(ctx, 25,25, 0,255,0,255, 0);
   946 isPixel(ctx, 75,25, 0,255,0,255, 0);
   949 }
   950 </script>
   952 <!-- [[[ test_2d.composite.clip.source-out.html ]]] -->
   954 <p>Canvas test: 2d.composite.clip.source-out</p>
   955 <!-- Testing: fill() does not affect pixels outside the clip region. -->
   956 <canvas id="c32" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
   957 <script>
   960 function test_2d_composite_clip_source_out() {
   962 var canvas = document.getElementById('c32');
   963 var ctx = canvas.getContext('2d');
   966 ctx.fillStyle = '#0f0';
   967 ctx.fillRect(0, 0, 100, 50);
   968 ctx.globalCompositeOperation = 'source-out';
   969 ctx.rect(-20, -20, 10, 10);
   970 ctx.clip();
   971 ctx.fillStyle = '#f00';
   972 ctx.fillRect(0, 0, 50, 50);
   973 isPixel(ctx, 25,25, 0,255,0,255, 0);
   974 isPixel(ctx, 75,25, 0,255,0,255, 0);
   977 }
   978 </script>
   980 <!-- [[[ test_2d.composite.clip.source-over.html ]]] -->
   982 <p>Canvas test: 2d.composite.clip.source-over</p>
   983 <!-- Testing: fill() does not affect pixels outside the clip region. -->
   984 <canvas id="c33" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
   985 <script>
   988 function test_2d_composite_clip_source_over() {
   990 var canvas = document.getElementById('c33');
   991 var ctx = canvas.getContext('2d');
   994 ctx.fillStyle = '#0f0';
   995 ctx.fillRect(0, 0, 100, 50);
   996 ctx.globalCompositeOperation = 'source-over';
   997 ctx.rect(-20, -20, 10, 10);
   998 ctx.clip();
   999 ctx.fillStyle = '#f00';
  1000 ctx.fillRect(0, 0, 50, 50);
  1001 isPixel(ctx, 25,25, 0,255,0,255, 0);
  1002 isPixel(ctx, 75,25, 0,255,0,255, 0);
  1006 </script>
  1008 <!-- [[[ test_2d.composite.clip.xor.html ]]] -->
  1010 <p>Canvas test: 2d.composite.clip.xor</p>
  1011 <!-- Testing: fill() does not affect pixels outside the clip region. -->
  1012 <canvas id="c34" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1013 <script>
  1016 function test_2d_composite_clip_xor() {
  1018 var canvas = document.getElementById('c34');
  1019 var ctx = canvas.getContext('2d');
  1022 ctx.fillStyle = '#0f0';
  1023 ctx.fillRect(0, 0, 100, 50);
  1024 ctx.globalCompositeOperation = 'xor';
  1025 ctx.rect(-20, -20, 10, 10);
  1026 ctx.clip();
  1027 ctx.fillStyle = '#f00';
  1028 ctx.fillRect(0, 0, 50, 50);
  1029 isPixel(ctx, 25,25, 0,255,0,255, 0);
  1030 isPixel(ctx, 75,25, 0,255,0,255, 0);
  1034 </script>
  1036 <!-- [[[ test_2d.composite.globalAlpha.canvas.html ]]] -->
  1038 <p>Canvas test: 2d.composite.globalAlpha.canvas</p>
  1039 <canvas id="c35" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1040 <script>
  1043 function test_2d_composite_globalAlpha_canvas() {
  1045 var canvas = document.getElementById('c35');
  1046 var ctx = canvas.getContext('2d');
  1048 var canvas2 = document.createElement('canvas');
  1049 canvas2.width = 100;
  1050 canvas2.height = 50;
  1051 var ctx2 = canvas2.getContext('2d');
  1052 ctx2.fillStyle = '#f00';
  1053 ctx2.fillRect(0, 0, 100, 50);
  1055 ctx.fillStyle = '#0f0';
  1056 ctx.fillRect(0, 0, 100, 50);
  1057 ctx.globalAlpha = 0.01; // avoid any potential alpha=0 optimisations
  1058 ctx.drawImage(canvas2, 0, 0);
  1059 isPixel(ctx, 50,25, 2,253,0,255, 2);
  1063 </script>
  1065 <!-- [[[ test_2d.composite.globalAlpha.canvaspattern.html ]]] -->
  1067 <p>Canvas test: 2d.composite.globalAlpha.canvaspattern - bug 401790</p>
  1068 <canvas id="c36" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1069 <script>
  1071 function todo_isPixel(ctx, x,y, r,g,b,a, d) {
  1072 	var pos = x + "," + y;
  1073 	var colour = r + "," + g + "," + b + "," + a;
  1074     var pixel = ctx.getImageData(x, y, 1, 1);
  1075     var pr = pixel.data[0],
  1076         pg = pixel.data[1],
  1077         pb = pixel.data[2],
  1078         pa = pixel.data[3];
  1079     todo(r-d <= pr && pr <= r+d &&
  1080        g-d <= pg && pg <= g+d &&
  1081        b-d <= pb && pb <= b+d &&
  1082        a-d <= pa && pa <= a+d,
  1083        "pixel "+pos+" of "+ctx.canvas.id+" is "+pr+","+pg+","+pb+","+pa+" (marked todo); expected "+colour+" +/- " + d);
  1086 function test_2d_composite_globalAlpha_canvaspattern() {
  1088 var canvas = document.getElementById('c36');
  1089 var ctx = canvas.getContext('2d');
  1091 var canvas2 = document.createElement('canvas');
  1092 canvas2.width = 100;
  1093 canvas2.height = 50;
  1094 var ctx2 = canvas2.getContext('2d');
  1095 ctx2.fillStyle = '#f00';
  1096 ctx2.fillRect(0, 0, 100, 50);
  1098 ctx.fillStyle = '#0f0';
  1099 ctx.fillRect(0, 0, 100, 50);
  1100 ctx.fillStyle = ctx.createPattern(canvas2, 'no-repeat');
  1101 ctx.globalAlpha = 0.01; // avoid any potential alpha=0 optimisations
  1102 ctx.fillRect(0, 0, 100, 50);
  1103 isPixel(ctx, 50,25, 2,253,0,255, 2);
  1107 </script>
  1109 <!-- [[[ test_2d.composite.globalAlpha.default.html ]]] -->
  1111 <p>Canvas test: 2d.composite.globalAlpha.default</p>
  1112 <canvas id="c37" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1113 <script>
  1115 function test_2d_composite_globalAlpha_default() {
  1117 var canvas = document.getElementById('c37');
  1118 var ctx = canvas.getContext('2d');
  1120 ok(ctx.globalAlpha === 1.0, "ctx.globalAlpha === 1.0");
  1124 </script>
  1126 <!-- [[[ test_2d.composite.globalAlpha.fill.html ]]] -->
  1128 <p>Canvas test: 2d.composite.globalAlpha.fill</p>
  1129 <canvas id="c38" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1130 <script>
  1133 function test_2d_composite_globalAlpha_fill() {
  1135 var canvas = document.getElementById('c38');
  1136 var ctx = canvas.getContext('2d');
  1138 ctx.fillStyle = '#0f0';
  1139 ctx.fillRect(0, 0, 100, 50);
  1140 ctx.globalAlpha = 0.01; // avoid any potential alpha=0 optimisations
  1141 ctx.fillStyle = '#f00';
  1142 ctx.fillRect(0, 0, 100, 50);
  1143 isPixel(ctx, 50,25, 2,253,0,255, 2);
  1147 </script>
  1149 <!-- [[[ test_2d.composite.globalAlpha.image.html ]]] -->
  1151 <p>Canvas test: 2d.composite.globalAlpha.image</p>
  1152 <canvas id="c39" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1153 <script>
  1156 function test_2d_composite_globalAlpha_image() {
  1158 var canvas = document.getElementById('c39');
  1159 var ctx = canvas.getContext('2d');
  1161 ctx.fillStyle = '#0f0';
  1162 ctx.fillRect(0, 0, 100, 50);
  1163 ctx.globalAlpha = 0.01; // avoid any potential alpha=0 optimisations
  1164 ctx.drawImage(document.getElementById('red_1.png'), 0, 0);
  1165 isPixel(ctx, 50,25, 2,253,0,255, 2);
  1169 </script>
  1170 <img src="image_red.png" id="red_1.png" class="resource">
  1172 <!-- [[[ test_2d.composite.globalAlpha.imagepattern.html ]]] -->
  1174 <p>Canvas test: 2d.composite.globalAlpha.imagepattern - bug 401790</p>
  1175 <canvas id="c40" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1176 <script>
  1180 function test_2d_composite_globalAlpha_imagepattern() {
  1182 var canvas = document.getElementById('c40');
  1183 var ctx = canvas.getContext('2d');
  1185 ctx.fillStyle = '#0f0';
  1186 ctx.fillRect(0, 0, 100, 50);
  1187 ctx.fillStyle = ctx.createPattern(document.getElementById('red_2.png'), 'no-repeat');
  1188 ctx.globalAlpha = 0.01; // avoid any potential alpha=0 optimisations
  1189 ctx.fillRect(0, 0, 100, 50);
  1190 isPixel(ctx, 50,25, 2,253,0,255, 2);
  1194 </script>
  1195 <img src="image_red.png" id="red_2.png" class="resource">
  1197 <!-- [[[ test_2d.composite.globalAlpha.invalid.html ]]] -->
  1199 <p>Canvas test: 2d.composite.globalAlpha.invalid</p>
  1200 <canvas id="c41" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1201 <script>
  1203 function test_2d_composite_globalAlpha_invalid() {
  1205 var canvas = document.getElementById('c41');
  1206 var ctx = canvas.getContext('2d');
  1208 ctx.globalAlpha = 0.5;
  1209 var a = ctx.globalAlpha; // might not be exactly 0.5, if it is rounded/quantised, so remember for future comparisons
  1210 ctx.globalAlpha = Infinity;
  1211 ok(ctx.globalAlpha === a, "ctx.globalAlpha === a");
  1212 ctx.globalAlpha = -Infinity;
  1213 ok(ctx.globalAlpha === a, "ctx.globalAlpha === a");
  1214 ctx.globalAlpha = NaN;
  1215 ok(ctx.globalAlpha === a, "ctx.globalAlpha === a");
  1218 </script>
  1220 <!-- [[[ test_2d.composite.globalAlpha.range.html ]]] -->
  1222 <p>Canvas test: 2d.composite.globalAlpha.range</p>
  1223 <canvas id="c42" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1224 <script>
  1226 function test_2d_composite_globalAlpha_range() {
  1228 var canvas = document.getElementById('c42');
  1229 var ctx = canvas.getContext('2d');
  1231 ctx.globalAlpha = 0.5;
  1232 var a = ctx.globalAlpha; // might not be exactly 0.5, if it is rounded/quantised, so remember for future comparisons
  1233 ctx.globalAlpha = 1.1;
  1234 ok(ctx.globalAlpha == a, "ctx.globalAlpha == a");
  1235 ctx.globalAlpha = -0.1;
  1236 ok(ctx.globalAlpha == a, "ctx.globalAlpha == a");
  1237 ctx.globalAlpha = 0;
  1238 ok(ctx.globalAlpha == 0, "ctx.globalAlpha == 0");
  1239 ctx.globalAlpha = 1;
  1240 ok(ctx.globalAlpha == 1, "ctx.globalAlpha == 1");
  1244 </script>
  1246 <!-- [[[ test_2d.composite.image.copy.html ]]] -->
  1248 <p>Canvas test: 2d.composite.image.copy</p>
  1249 <canvas id="c43" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1250 <script>
  1253 function test_2d_composite_image_copy() {
  1255 var canvas = document.getElementById('c43');
  1256 var ctx = canvas.getContext('2d');
  1259 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
  1260 ctx.fillRect(0, 0, 100, 50);
  1261 ctx.globalCompositeOperation = 'copy';
  1262 ctx.drawImage(document.getElementById('yellow75_12.png'), 0, 0);
  1263 isPixel(ctx, 50,25, 255,255,0,191, 5);
  1267 </script>
  1268 <img src="image_yellow75.png" id="yellow75_12.png" class="resource">
  1270 <!-- [[[ test_2d.composite.image.destination-atop.html ]]] -->
  1272 <p>Canvas test: 2d.composite.image.destination-atop</p>
  1273 <canvas id="c44" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1274 <script>
  1277 function test_2d_composite_image_destination_atop() {
  1279 var canvas = document.getElementById('c44');
  1280 var ctx = canvas.getContext('2d');
  1283 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
  1284 ctx.fillRect(0, 0, 100, 50);
  1285 ctx.globalCompositeOperation = 'destination-atop';
  1286 ctx.drawImage(document.getElementById('yellow75_13.png'), 0, 0);
  1287 isPixel(ctx, 50,25, 127,255,127,191, 5);
  1291 </script>
  1292 <img src="image_yellow75.png" id="yellow75_13.png" class="resource">
  1294 <!-- [[[ test_2d.composite.image.destination-in.html ]]] -->
  1296 <p>Canvas test: 2d.composite.image.destination-in</p>
  1297 <canvas id="c45" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1298 <script>
  1301 function test_2d_composite_image_destination_in() {
  1303 var canvas = document.getElementById('c45');
  1304 var ctx = canvas.getContext('2d');
  1307 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
  1308 ctx.fillRect(0, 0, 100, 50);
  1309 ctx.globalCompositeOperation = 'destination-in';
  1310 ctx.drawImage(document.getElementById('yellow75_14.png'), 0, 0);
  1311 isPixel(ctx, 50,25, 0,255,255,95, 5);
  1315 </script>
  1316 <img src="image_yellow75.png" id="yellow75_14.png" class="resource">
  1318 <!-- [[[ test_2d.composite.image.destination-out.html ]]] -->
  1320 <p>Canvas test: 2d.composite.image.destination-out</p>
  1321 <canvas id="c46" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1322 <script>
  1325 function test_2d_composite_image_destination_out() {
  1327 var canvas = document.getElementById('c46');
  1328 var ctx = canvas.getContext('2d');
  1331 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
  1332 ctx.fillRect(0, 0, 100, 50);
  1333 ctx.globalCompositeOperation = 'destination-out';
  1334 ctx.drawImage(document.getElementById('yellow75_15.png'), 0, 0);
  1335 isPixel(ctx, 50,25, 0,255,255,31, 5);
  1339 </script>
  1340 <img src="image_yellow75.png" id="yellow75_15.png" class="resource">
  1342 <!-- [[[ test_2d.composite.image.destination-over.html ]]] -->
  1344 <p>Canvas test: 2d.composite.image.destination-over</p>
  1345 <canvas id="c47" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1346 <script>
  1349 function test_2d_composite_image_destination_over() {
  1351 var canvas = document.getElementById('c47');
  1352 var ctx = canvas.getContext('2d');
  1355 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
  1356 ctx.fillRect(0, 0, 100, 50);
  1357 ctx.globalCompositeOperation = 'destination-over';
  1358 ctx.drawImage(document.getElementById('yellow75_16.png'), 0, 0);
  1359 isPixel(ctx, 50,25, 109,255,145,223, 5);
  1363 </script>
  1364 <img src="image_yellow75.png" id="yellow75_16.png" class="resource">
  1366 <!-- [[[ test_2d.composite.image.lighter.html ]]] -->
  1368 <p>Canvas test: 2d.composite.image.lighter</p>
  1369 <canvas id="c48" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1370 <script>
  1373 function test_2d_composite_image_lighter() {
  1375 var canvas = document.getElementById('c48');
  1376 var ctx = canvas.getContext('2d');
  1379 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
  1380 ctx.fillRect(0, 0, 100, 50);
  1381 ctx.globalCompositeOperation = 'lighter';
  1382 ctx.drawImage(document.getElementById('yellow75_17.png'), 0, 0);
  1383 isPixel(ctx, 50,25, 191,255,127,255, 5);
  1387 </script>
  1388 <img src="image_yellow75.png" id="yellow75_17.png" class="resource">
  1390 <!-- [[[ test_2d.composite.image.source-atop.html ]]] -->
  1392 <p>Canvas test: 2d.composite.image.source-atop</p>
  1393 <canvas id="c49" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1394 <script>
  1397 function test_2d_composite_image_source_atop() {
  1399 var canvas = document.getElementById('c49');
  1400 var ctx = canvas.getContext('2d');
  1403 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
  1404 ctx.fillRect(0, 0, 100, 50);
  1405 ctx.globalCompositeOperation = 'source-atop';
  1406 ctx.drawImage(document.getElementById('yellow75_18.png'), 0, 0);
  1407 isPixel(ctx, 50,25, 191,255,63,127, 5);
  1411 </script>
  1412 <img src="image_yellow75.png" id="yellow75_18.png" class="resource">
  1414 <!-- [[[ test_2d.composite.image.source-in.html ]]] -->
  1416 <p>Canvas test: 2d.composite.image.source-in</p>
  1417 <canvas id="c50" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1418 <script>
  1421 function test_2d_composite_image_source_in() {
  1423 var canvas = document.getElementById('c50');
  1424 var ctx = canvas.getContext('2d');
  1427 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
  1428 ctx.fillRect(0, 0, 100, 50);
  1429 ctx.globalCompositeOperation = 'source-in';
  1430 ctx.drawImage(document.getElementById('yellow75_19.png'), 0, 0);
  1431 isPixel(ctx, 50,25, 255,255,0,95, 5);
  1435 </script>
  1436 <img src="image_yellow75.png" id="yellow75_19.png" class="resource">
  1438 <!-- [[[ test_2d.composite.image.source-out.html ]]] -->
  1440 <p>Canvas test: 2d.composite.image.source-out</p>
  1441 <canvas id="c51" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1442 <script>
  1445 function test_2d_composite_image_source_out() {
  1447 var canvas = document.getElementById('c51');
  1448 var ctx = canvas.getContext('2d');
  1451 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
  1452 ctx.fillRect(0, 0, 100, 50);
  1453 ctx.globalCompositeOperation = 'source-out';
  1454 ctx.drawImage(document.getElementById('yellow75_20.png'), 0, 0);
  1455 isPixel(ctx, 50,25, 255,255,0,95, 5);
  1459 </script>
  1460 <img src="image_yellow75.png" id="yellow75_20.png" class="resource">
  1462 <!-- [[[ test_2d.composite.image.source-over.html ]]] -->
  1464 <p>Canvas test: 2d.composite.image.source-over</p>
  1465 <canvas id="c52" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1466 <script>
  1469 function test_2d_composite_image_source_over() {
  1471 var canvas = document.getElementById('c52');
  1472 var ctx = canvas.getContext('2d');
  1475 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
  1476 ctx.fillRect(0, 0, 100, 50);
  1477 ctx.globalCompositeOperation = 'source-over';
  1478 ctx.drawImage(document.getElementById('yellow75_21.png'), 0, 0);
  1479 isPixel(ctx, 50,25, 218,255,36,223, 5);
  1483 </script>
  1484 <img src="image_yellow75.png" id="yellow75_21.png" class="resource">
  1486 <!-- [[[ test_2d.composite.image.xor.html ]]] -->
  1488 <p>Canvas test: 2d.composite.image.xor</p>
  1489 <canvas id="c53" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1490 <script>
  1493 function test_2d_composite_image_xor() {
  1495 var canvas = document.getElementById('c53');
  1496 var ctx = canvas.getContext('2d');
  1499 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
  1500 ctx.fillRect(0, 0, 100, 50);
  1501 ctx.globalCompositeOperation = 'xor';
  1502 ctx.drawImage(document.getElementById('yellow75_22.png'), 0, 0);
  1503 isPixel(ctx, 50,25, 191,255,63,127, 5);
  1507 </script>
  1508 <img src="image_yellow75.png" id="yellow75_22.png" class="resource">
  1510 <!-- [[[ test_2d.composite.operation.casesensitive.html ]]] -->
  1512 <p>Canvas test: 2d.composite.operation.casesensitive - bug 401788</p>
  1513 <canvas id="c54" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1514 <script>
  1516 function test_2d_composite_operation_casesensitive() {
  1518 var canvas = document.getElementById('c54');
  1519 var ctx = canvas.getContext('2d');
  1521 var _thrown_outer = false;
  1522 try {
  1524 ctx.globalCompositeOperation = 'xor';
  1525 ctx.globalCompositeOperation = 'Source-over';
  1526 ok(ctx.globalCompositeOperation == 'xor', "ctx.globalCompositeOperation == 'xor'");
  1528 } catch (e) {
  1529     _thrown_outer = true;
  1531 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
  1535 </script>
  1537 <!-- [[[ test_2d.composite.operation.clear.html ]]] -->
  1539 <p>Canvas test: 2d.composite.operation.clear</p>
  1540 <canvas id="c55" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1541 <script>
  1543 function test_2d_composite_operation_clear() {
  1545 var canvas = document.getElementById('c55');
  1546 var ctx = canvas.getContext('2d');
  1548 ctx.globalCompositeOperation = 'xor';
  1549 ctx.globalCompositeOperation = 'clear';
  1550 ok(ctx.globalCompositeOperation == 'xor', "ctx.globalCompositeOperation == 'xor'");
  1554 </script>
  1556 <!-- [[[ test_2d.composite.operation.darker.html ]]] -->
  1558 <p>Canvas test: 2d.composite.operation.darker</p>
  1559 <canvas id="c56" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1560 <script>
  1562 function test_2d_composite_operation_darker() {
  1564 var canvas = document.getElementById('c56');
  1565 var ctx = canvas.getContext('2d');
  1567 ctx.globalCompositeOperation = 'xor';
  1568 ctx.globalCompositeOperation = 'darker';
  1569 ok(ctx.globalCompositeOperation == 'xor', "ctx.globalCompositeOperation == 'xor'");
  1573 </script>
  1575 <!-- [[[ test_2d.composite.operation.default.html ]]] -->
  1577 <p>Canvas test: 2d.composite.operation.default</p>
  1578 <canvas id="c57" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1579 <script>
  1581 function test_2d_composite_operation_default() {
  1583 var canvas = document.getElementById('c57');
  1584 var ctx = canvas.getContext('2d');
  1586 ok(ctx.globalCompositeOperation == 'source-over', "ctx.globalCompositeOperation == 'source-over'");
  1590 </script>
  1592 <!-- [[[ test_2d.composite.operation.get.html ]]] -->
  1594 <p>Canvas test: 2d.composite.operation.get</p>
  1595 <canvas id="c58" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1596 <script>
  1598 function test_2d_composite_operation_get() {
  1600 var canvas = document.getElementById('c58');
  1601 var ctx = canvas.getContext('2d');
  1603 var modes = ['source-atop', 'source-in', 'source-out', 'source-over',
  1604     'destination-atop', 'destination-in', 'destination-out', 'destination-over',
  1605     'lighter', 'copy', 'xor'];
  1606 for (var i = 0; i < modes.length; ++i)
  1608     ctx.globalCompositeOperation = modes[i];
  1609     ok(ctx.globalCompositeOperation == modes[i], "ctx.globalCompositeOperation == modes[\""+(i)+"\"]");
  1614 </script>
  1616 <!-- [[[ test_2d.composite.operation.highlight.html ]]] -->
  1618 <p>Canvas test: 2d.composite.operation.highlight - bug 401788</p>
  1619 <canvas id="c59" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1620 <script>
  1622 function test_2d_composite_operation_highlight() {
  1624 var canvas = document.getElementById('c59');
  1625 var ctx = canvas.getContext('2d');
  1627 var _thrown_outer = false;
  1628 try {
  1630 ctx.globalCompositeOperation = 'xor';
  1631 ctx.globalCompositeOperation = 'highlight';
  1632 ok(ctx.globalCompositeOperation == 'xor', "ctx.globalCompositeOperation == 'xor'");
  1634 } catch (e) {
  1635     _thrown_outer = true;
  1637 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
  1641 </script>
  1643 <!-- [[[ test_2d.composite.operation.nullsuffix.html ]]] -->
  1645 <p>Canvas test: 2d.composite.operation.nullsuffix - bug 401788</p>
  1646 <canvas id="c60" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1647 <script>
  1649 function test_2d_composite_operation_nullsuffix() {
  1651 var canvas = document.getElementById('c60');
  1652 var ctx = canvas.getContext('2d');
  1654 var _thrown_outer = false;
  1655 try {
  1657 ctx.globalCompositeOperation = 'xor';
  1658 ctx.globalCompositeOperation = 'source-over\0';
  1659 ok(ctx.globalCompositeOperation == 'xor', "ctx.globalCompositeOperation == 'xor'");
  1661 } catch (e) {
  1662     _thrown_outer = true;
  1664 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
  1668 </script>
  1670 <!-- [[[ test_2d.composite.operation.over.html ]]] -->
  1672 <p>Canvas test: 2d.composite.operation.over</p>
  1673 <canvas id="c61" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1674 <script>
  1676 function test_2d_composite_operation_over() {
  1678 var canvas = document.getElementById('c61');
  1679 var ctx = canvas.getContext('2d');
  1681 ctx.globalCompositeOperation = 'xor';
  1682 ctx.globalCompositeOperation = 'over';
  1683 ok(ctx.globalCompositeOperation == 'xor', "ctx.globalCompositeOperation == 'xor'");
  1687 </script>
  1689 <!-- [[[ test_2d.composite.operation.unrecognised.html ]]] -->
  1691 <p>Canvas test: 2d.composite.operation.unrecognised - bug 401788</p>
  1692 <canvas id="c62" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1693 <script>
  1695 function test_2d_composite_operation_unrecognised() {
  1697 var canvas = document.getElementById('c62');
  1698 var ctx = canvas.getContext('2d');
  1700 var _thrown_outer = false;
  1701 try {
  1703 ctx.globalCompositeOperation = 'xor';
  1704 ctx.globalCompositeOperation = 'nonexistent';
  1705 ok(ctx.globalCompositeOperation == 'xor', "ctx.globalCompositeOperation == 'xor'");
  1707 } catch (e) {
  1708     _thrown_outer = true;
  1710 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
  1714 </script>
  1716 <!-- [[[ test_2d.composite.solid.copy.html ]]] -->
  1718 <p>Canvas test: 2d.composite.solid.copy</p>
  1719 <canvas id="c63" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1720 <script>
  1723 function test_2d_composite_solid_copy() {
  1725 var canvas = document.getElementById('c63');
  1726 var ctx = canvas.getContext('2d');
  1729 ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
  1730 ctx.fillRect(0, 0, 100, 50);
  1731 ctx.globalCompositeOperation = 'copy';
  1732 ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
  1733 ctx.fillRect(0, 0, 100, 50);
  1734 isPixel(ctx, 50,25, 255,255,0,255, 5);
  1738 </script>
  1740 <!-- [[[ test_2d.composite.solid.destination-atop.html ]]] -->
  1742 <p>Canvas test: 2d.composite.solid.destination-atop</p>
  1743 <canvas id="c64" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1744 <script>
  1747 function test_2d_composite_solid_destination_atop() {
  1749 var canvas = document.getElementById('c64');
  1750 var ctx = canvas.getContext('2d');
  1753 ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
  1754 ctx.fillRect(0, 0, 100, 50);
  1755 ctx.globalCompositeOperation = 'destination-atop';
  1756 ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
  1757 ctx.fillRect(0, 0, 100, 50);
  1758 isPixel(ctx, 50,25, 0,255,255,255, 5);
  1762 </script>
  1764 <!-- [[[ test_2d.composite.solid.destination-in.html ]]] -->
  1766 <p>Canvas test: 2d.composite.solid.destination-in</p>
  1767 <canvas id="c65" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1768 <script>
  1771 function test_2d_composite_solid_destination_in() {
  1773 var canvas = document.getElementById('c65');
  1774 var ctx = canvas.getContext('2d');
  1777 ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
  1778 ctx.fillRect(0, 0, 100, 50);
  1779 ctx.globalCompositeOperation = 'destination-in';
  1780 ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
  1781 ctx.fillRect(0, 0, 100, 50);
  1782 isPixel(ctx, 50,25, 0,255,255,255, 5);
  1786 </script>
  1788 <!-- [[[ test_2d.composite.solid.destination-out.html ]]] -->
  1790 <p>Canvas test: 2d.composite.solid.destination-out</p>
  1791 <canvas id="c66" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1792 <script>
  1795 function test_2d_composite_solid_destination_out() {
  1797 var canvas = document.getElementById('c66');
  1798 var ctx = canvas.getContext('2d');
  1801 ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
  1802 ctx.fillRect(0, 0, 100, 50);
  1803 ctx.globalCompositeOperation = 'destination-out';
  1804 ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
  1805 ctx.fillRect(0, 0, 100, 50);
  1806 isPixel(ctx, 50,25, 0,0,0,0, 5);
  1810 </script>
  1812 <!-- [[[ test_2d.composite.solid.destination-over.html ]]] -->
  1814 <p>Canvas test: 2d.composite.solid.destination-over</p>
  1815 <canvas id="c67" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1816 <script>
  1819 function test_2d_composite_solid_destination_over() {
  1821 var canvas = document.getElementById('c67');
  1822 var ctx = canvas.getContext('2d');
  1825 ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
  1826 ctx.fillRect(0, 0, 100, 50);
  1827 ctx.globalCompositeOperation = 'destination-over';
  1828 ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
  1829 ctx.fillRect(0, 0, 100, 50);
  1830 isPixel(ctx, 50,25, 0,255,255,255, 5);
  1834 </script>
  1836 <!-- [[[ test_2d.composite.solid.lighter.html ]]] -->
  1838 <p>Canvas test: 2d.composite.solid.lighter</p>
  1839 <canvas id="c68" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1840 <script>
  1843 function test_2d_composite_solid_lighter() {
  1845 var canvas = document.getElementById('c68');
  1846 var ctx = canvas.getContext('2d');
  1849 ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
  1850 ctx.fillRect(0, 0, 100, 50);
  1851 ctx.globalCompositeOperation = 'lighter';
  1852 ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
  1853 ctx.fillRect(0, 0, 100, 50);
  1854 isPixel(ctx, 50,25, 255,255,255,255, 5);
  1858 </script>
  1860 <!-- [[[ test_2d.composite.solid.source-atop.html ]]] -->
  1862 <p>Canvas test: 2d.composite.solid.source-atop</p>
  1863 <canvas id="c69" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1864 <script>
  1867 function test_2d_composite_solid_source_atop() {
  1869 var canvas = document.getElementById('c69');
  1870 var ctx = canvas.getContext('2d');
  1873 ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
  1874 ctx.fillRect(0, 0, 100, 50);
  1875 ctx.globalCompositeOperation = 'source-atop';
  1876 ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
  1877 ctx.fillRect(0, 0, 100, 50);
  1878 isPixel(ctx, 50,25, 255,255,0,255, 5);
  1882 </script>
  1884 <!-- [[[ test_2d.composite.solid.source-in.html ]]] -->
  1886 <p>Canvas test: 2d.composite.solid.source-in</p>
  1887 <canvas id="c70" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1888 <script>
  1891 function test_2d_composite_solid_source_in() {
  1893 var canvas = document.getElementById('c70');
  1894 var ctx = canvas.getContext('2d');
  1897 ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
  1898 ctx.fillRect(0, 0, 100, 50);
  1899 ctx.globalCompositeOperation = 'source-in';
  1900 ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
  1901 ctx.fillRect(0, 0, 100, 50);
  1902 isPixel(ctx, 50,25, 255,255,0,255, 5);
  1906 </script>
  1908 <!-- [[[ test_2d.composite.solid.source-out.html ]]] -->
  1910 <p>Canvas test: 2d.composite.solid.source-out</p>
  1911 <canvas id="c71" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1912 <script>
  1915 function test_2d_composite_solid_source_out() {
  1917 var canvas = document.getElementById('c71');
  1918 var ctx = canvas.getContext('2d');
  1921 ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
  1922 ctx.fillRect(0, 0, 100, 50);
  1923 ctx.globalCompositeOperation = 'source-out';
  1924 ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
  1925 ctx.fillRect(0, 0, 100, 50);
  1926 isPixel(ctx, 50,25, 0,0,0,0, 5);
  1930 </script>
  1932 <!-- [[[ test_2d.composite.solid.source-over.html ]]] -->
  1934 <p>Canvas test: 2d.composite.solid.source-over</p>
  1935 <canvas id="c72" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1936 <script>
  1939 function test_2d_composite_solid_source_over() {
  1941 var canvas = document.getElementById('c72');
  1942 var ctx = canvas.getContext('2d');
  1945 ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
  1946 ctx.fillRect(0, 0, 100, 50);
  1947 ctx.globalCompositeOperation = 'source-over';
  1948 ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
  1949 ctx.fillRect(0, 0, 100, 50);
  1950 isPixel(ctx, 50,25, 255,255,0,255, 5);
  1954 </script>
  1956 <!-- [[[ test_2d.composite.solid.xor.html ]]] -->
  1958 <p>Canvas test: 2d.composite.solid.xor</p>
  1959 <canvas id="c73" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1960 <script>
  1963 function test_2d_composite_solid_xor() {
  1965 var canvas = document.getElementById('c73');
  1966 var ctx = canvas.getContext('2d');
  1969 ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
  1970 ctx.fillRect(0, 0, 100, 50);
  1971 ctx.globalCompositeOperation = 'xor';
  1972 ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
  1973 ctx.fillRect(0, 0, 100, 50);
  1974 isPixel(ctx, 50,25, 0,0,0,0, 5);
  1978 </script>
  1980 <!-- [[[ test_2d.composite.transparent.copy.html ]]] -->
  1982 <p>Canvas test: 2d.composite.transparent.copy</p>
  1983 <canvas id="c74" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  1984 <script>
  1987 function test_2d_composite_transparent_copy() {
  1989 var canvas = document.getElementById('c74');
  1990 var ctx = canvas.getContext('2d');
  1993 ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
  1994 ctx.fillRect(0, 0, 100, 50);
  1995 ctx.globalCompositeOperation = 'copy';
  1996 ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
  1997 ctx.fillRect(0, 0, 100, 50);
  1998 isPixel(ctx, 50,25, 0,0,255,191, 5);
  2002 </script>
  2004 <!-- [[[ test_2d.composite.transparent.destination-atop.html ]]] -->
  2006 <p>Canvas test: 2d.composite.transparent.destination-atop</p>
  2007 <canvas id="c75" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2008 <script>
  2011 function test_2d_composite_transparent_destination_atop() {
  2013 var canvas = document.getElementById('c75');
  2014 var ctx = canvas.getContext('2d');
  2017 ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
  2018 ctx.fillRect(0, 0, 100, 50);
  2019 ctx.globalCompositeOperation = 'destination-atop';
  2020 ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
  2021 ctx.fillRect(0, 0, 100, 50);
  2022 isPixel(ctx, 50,25, 0,127,127,191, 5);
  2026 </script>
  2028 <!-- [[[ test_2d.composite.transparent.destination-in.html ]]] -->
  2030 <p>Canvas test: 2d.composite.transparent.destination-in</p>
  2031 <canvas id="c76" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2032 <script>
  2035 function test_2d_composite_transparent_destination_in() {
  2037 var canvas = document.getElementById('c76');
  2038 var ctx = canvas.getContext('2d');
  2041 ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
  2042 ctx.fillRect(0, 0, 100, 50);
  2043 ctx.globalCompositeOperation = 'destination-in';
  2044 ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
  2045 ctx.fillRect(0, 0, 100, 50);
  2046 isPixel(ctx, 50,25, 0,255,0,95, 5);
  2050 </script>
  2052 <!-- [[[ test_2d.composite.transparent.destination-out.html ]]] -->
  2054 <p>Canvas test: 2d.composite.transparent.destination-out</p>
  2055 <canvas id="c77" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2056 <script>
  2059 function test_2d_composite_transparent_destination_out() {
  2061 var canvas = document.getElementById('c77');
  2062 var ctx = canvas.getContext('2d');
  2065 ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
  2066 ctx.fillRect(0, 0, 100, 50);
  2067 ctx.globalCompositeOperation = 'destination-out';
  2068 ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
  2069 ctx.fillRect(0, 0, 100, 50);
  2070 isPixel(ctx, 50,25, 0,255,0,31, 5);
  2074 </script>
  2076 <!-- [[[ test_2d.composite.transparent.destination-over.html ]]] -->
  2078 <p>Canvas test: 2d.composite.transparent.destination-over</p>
  2079 <canvas id="c78" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2080 <script>
  2083 function test_2d_composite_transparent_destination_over() {
  2085 var canvas = document.getElementById('c78');
  2086 var ctx = canvas.getContext('2d');
  2089 ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
  2090 ctx.fillRect(0, 0, 100, 50);
  2091 ctx.globalCompositeOperation = 'destination-over';
  2092 ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
  2093 ctx.fillRect(0, 0, 100, 50);
  2094 isPixel(ctx, 50,25, 0,145,109,223, 5);
  2098 </script>
  2100 <!-- [[[ test_2d.composite.transparent.lighter.html ]]] -->
  2102 <p>Canvas test: 2d.composite.transparent.lighter</p>
  2103 <canvas id="c79" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2104 <script>
  2107 function test_2d_composite_transparent_lighter() {
  2109 var canvas = document.getElementById('c79');
  2110 var ctx = canvas.getContext('2d');
  2113 ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
  2114 ctx.fillRect(0, 0, 100, 50);
  2115 ctx.globalCompositeOperation = 'lighter';
  2116 ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
  2117 ctx.fillRect(0, 0, 100, 50);
  2118 isPixel(ctx, 50,25, 0,127,191,255, 5);
  2122 </script>
  2124 <!-- [[[ test_2d.composite.transparent.source-atop.html ]]] -->
  2126 <p>Canvas test: 2d.composite.transparent.source-atop</p>
  2127 <canvas id="c80" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2128 <script>
  2131 function test_2d_composite_transparent_source_atop() {
  2133 var canvas = document.getElementById('c80');
  2134 var ctx = canvas.getContext('2d');
  2137 ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
  2138 ctx.fillRect(0, 0, 100, 50);
  2139 ctx.globalCompositeOperation = 'source-atop';
  2140 ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
  2141 ctx.fillRect(0, 0, 100, 50);
  2142 isPixel(ctx, 50,25, 0,63,191,127, 5);
  2146 </script>
  2148 <!-- [[[ test_2d.composite.transparent.source-in.html ]]] -->
  2150 <p>Canvas test: 2d.composite.transparent.source-in</p>
  2151 <canvas id="c81" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2152 <script>
  2155 function test_2d_composite_transparent_source_in() {
  2157 var canvas = document.getElementById('c81');
  2158 var ctx = canvas.getContext('2d');
  2161 ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
  2162 ctx.fillRect(0, 0, 100, 50);
  2163 ctx.globalCompositeOperation = 'source-in';
  2164 ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
  2165 ctx.fillRect(0, 0, 100, 50);
  2166 isPixel(ctx, 50,25, 0,0,255,95, 5);
  2170 </script>
  2172 <!-- [[[ test_2d.composite.transparent.source-out.html ]]] -->
  2174 <p>Canvas test: 2d.composite.transparent.source-out</p>
  2175 <canvas id="c82" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2176 <script>
  2179 function test_2d_composite_transparent_source_out() {
  2181 var canvas = document.getElementById('c82');
  2182 var ctx = canvas.getContext('2d');
  2185 ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
  2186 ctx.fillRect(0, 0, 100, 50);
  2187 ctx.globalCompositeOperation = 'source-out';
  2188 ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
  2189 ctx.fillRect(0, 0, 100, 50);
  2190 isPixel(ctx, 50,25, 0,0,255,95, 5);
  2194 </script>
  2196 <!-- [[[ test_2d.composite.transparent.source-over.html ]]] -->
  2198 <p>Canvas test: 2d.composite.transparent.source-over</p>
  2199 <canvas id="c83" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2200 <script>
  2203 function test_2d_composite_transparent_source_over() {
  2205 var canvas = document.getElementById('c83');
  2206 var ctx = canvas.getContext('2d');
  2209 ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
  2210 ctx.fillRect(0, 0, 100, 50);
  2211 ctx.globalCompositeOperation = 'source-over';
  2212 ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
  2213 ctx.fillRect(0, 0, 100, 50);
  2214 isPixel(ctx, 50,25, 0,36,218,223, 5);
  2218 </script>
  2220 <!-- [[[ test_2d.composite.transparent.xor.html ]]] -->
  2222 <p>Canvas test: 2d.composite.transparent.xor</p>
  2223 <canvas id="c84" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2224 <script>
  2227 function test_2d_composite_transparent_xor() {
  2229 var canvas = document.getElementById('c84');
  2230 var ctx = canvas.getContext('2d');
  2233 ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
  2234 ctx.fillRect(0, 0, 100, 50);
  2235 ctx.globalCompositeOperation = 'xor';
  2236 ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
  2237 ctx.fillRect(0, 0, 100, 50);
  2238 isPixel(ctx, 50,25, 0,63,191,127, 5);
  2242 </script>
  2244 <!-- [[[ test_2d.composite.uncovered.fill.copy.html ]]] -->
  2246 <p>Canvas test: 2d.composite.uncovered.fill.copy</p>
  2247 <!-- Testing: fill() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
  2248 <canvas id="c85" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2249 <script>
  2253 function test_2d_composite_uncovered_fill_copy() {
  2255 var canvas = document.getElementById('c85');
  2256 var ctx = canvas.getContext('2d');
  2259 ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
  2260 ctx.fillRect(0, 0, 100, 50);
  2261 ctx.globalCompositeOperation = 'copy';
  2262 ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
  2263 ctx.translate(0, 25);
  2264 ctx.fillRect(0, 50, 100, 50);
  2265 isPixel(ctx, 50,25, 0,0,0,0, 5);
  2269 </script>
  2271 <!-- [[[ test_2d.composite.uncovered.fill.destination-atop.html ]]] -->
  2273 <p>Canvas test: 2d.composite.uncovered.fill.destination-atop</p>
  2274 <!-- Testing: fill() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
  2275 <canvas id="c86" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2276 <script>
  2280 function test_2d_composite_uncovered_fill_destination_atop() {
  2282 var canvas = document.getElementById('c86');
  2283 var ctx = canvas.getContext('2d');
  2286 ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
  2287 ctx.fillRect(0, 0, 100, 50);
  2288 ctx.globalCompositeOperation = 'destination-atop';
  2289 ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
  2290 ctx.translate(0, 25);
  2291 ctx.fillRect(0, 50, 100, 50);
  2292 isPixel(ctx, 50,25, 0,0,0,0, 5);
  2296 </script>
  2298 <!-- [[[ test_2d.composite.uncovered.fill.destination-in.html ]]] -->
  2300 <p>Canvas test: 2d.composite.uncovered.fill.destination-in</p>
  2301 <!-- Testing: fill() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
  2302 <canvas id="c87" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2303 <script>
  2307 function test_2d_composite_uncovered_fill_destination_in() {
  2309 var canvas = document.getElementById('c87');
  2310 var ctx = canvas.getContext('2d');
  2313 ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
  2314 ctx.fillRect(0, 0, 100, 50);
  2315 ctx.globalCompositeOperation = 'destination-in';
  2316 ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
  2317 ctx.translate(0, 25);
  2318 ctx.fillRect(0, 50, 100, 50);
  2319 isPixel(ctx, 50,25, 0,0,0,0, 5);
  2323 </script>
  2325 <!-- [[[ test_2d.composite.uncovered.fill.source-in.html ]]] -->
  2327 <p>Canvas test: 2d.composite.uncovered.fill.source-in</p>
  2328 <!-- Testing: fill() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
  2329 <canvas id="c88" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2330 <script>
  2334 function test_2d_composite_uncovered_fill_source_in() {
  2336 var canvas = document.getElementById('c88');
  2337 var ctx = canvas.getContext('2d');
  2340 ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
  2341 ctx.fillRect(0, 0, 100, 50);
  2342 ctx.globalCompositeOperation = 'source-in';
  2343 ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
  2344 ctx.translate(0, 25);
  2345 ctx.fillRect(0, 50, 100, 50);
  2346 isPixel(ctx, 50,25, 0,0,0,0, 5);
  2350 </script>
  2352 <!-- [[[ test_2d.composite.uncovered.fill.source-out.html ]]] -->
  2354 <p>Canvas test: 2d.composite.uncovered.fill.source-out</p>
  2355 <!-- Testing: fill() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
  2356 <canvas id="c89" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2357 <script>
  2361 function test_2d_composite_uncovered_fill_source_out() {
  2363 var canvas = document.getElementById('c89');
  2364 var ctx = canvas.getContext('2d');
  2367 ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
  2368 ctx.fillRect(0, 0, 100, 50);
  2369 ctx.globalCompositeOperation = 'source-out';
  2370 ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
  2371 ctx.translate(0, 25);
  2372 ctx.fillRect(0, 50, 100, 50);
  2373 isPixel(ctx, 50,25, 0,0,0,0, 5);
  2377 </script>
  2379 <!-- [[[ test_2d.composite.uncovered.image.copy.html ]]] -->
  2381 <p>Canvas test: 2d.composite.uncovered.image.copy</p>
  2382 <!-- Testing: drawImage() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
  2383 <canvas id="c90" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2384 <script>
  2388 function test_2d_composite_uncovered_image_copy() {
  2390 var canvas = document.getElementById('c90');
  2391 var ctx = canvas.getContext('2d');
  2394 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
  2395 ctx.fillRect(0, 0, 100, 50);
  2396 ctx.globalCompositeOperation = 'copy';
  2397 ctx.drawImage(document.getElementById('yellow_1.png'), 40, 40, 10, 10, 40, 50, 10, 10);
  2398 isPixel(ctx, 15,15, 0,0,0,0, 5);
  2399 isPixel(ctx, 50,25, 0,0,0,0, 5);
  2403 </script>
  2404 <img src="image_yellow.png" id="yellow_1.png" class="resource">
  2406 <!-- [[[ test_2d.composite.uncovered.image.destination-atop.html ]]] -->
  2408 <p>Canvas test: 2d.composite.uncovered.image.destination-atop</p>
  2409 <!-- Testing: drawImage() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
  2410 <canvas id="c91" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2411 <script>
  2415 function test_2d_composite_uncovered_image_destination_atop() {
  2417 var canvas = document.getElementById('c91');
  2418 var ctx = canvas.getContext('2d');
  2421 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
  2422 ctx.fillRect(0, 0, 100, 50);
  2423 ctx.globalCompositeOperation = 'destination-atop';
  2424 ctx.drawImage(document.getElementById('yellow_2.png'), 40, 40, 10, 10, 40, 50, 10, 10);
  2425 isPixel(ctx, 15,15, 0,0,0,0, 5);
  2426 isPixel(ctx, 50,25, 0,0,0,0, 5);
  2430 </script>
  2431 <img src="image_yellow.png" id="yellow_2.png" class="resource">
  2433 <!-- [[[ test_2d.composite.uncovered.image.destination-in.html ]]] -->
  2435 <p>Canvas test: 2d.composite.uncovered.image.destination-in</p>
  2436 <!-- Testing: drawImage() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
  2437 <canvas id="c92" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2438 <script>
  2442 function test_2d_composite_uncovered_image_destination_in() {
  2444 var canvas = document.getElementById('c92');
  2445 var ctx = canvas.getContext('2d');
  2448 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
  2449 ctx.fillRect(0, 0, 100, 50);
  2450 ctx.globalCompositeOperation = 'destination-in';
  2451 ctx.drawImage(document.getElementById('yellow_3.png'), 40, 40, 10, 10, 40, 50, 10, 10);
  2452 isPixel(ctx, 15,15, 0,0,0,0, 5);
  2453 isPixel(ctx, 50,25, 0,0,0,0, 5);
  2457 </script>
  2458 <img src="image_yellow.png" id="yellow_3.png" class="resource">
  2460 <!-- [[[ test_2d.composite.uncovered.image.source-in.html ]]] -->
  2462 <p>Canvas test: 2d.composite.uncovered.image.source-in</p>
  2463 <!-- Testing: drawImage() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
  2464 <canvas id="c93" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2465 <script>
  2469 function test_2d_composite_uncovered_image_source_in() {
  2471 var canvas = document.getElementById('c93');
  2472 var ctx = canvas.getContext('2d');
  2475 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
  2476 ctx.fillRect(0, 0, 100, 50);
  2477 ctx.globalCompositeOperation = 'source-in';
  2478 ctx.drawImage(document.getElementById('yellow_4.png'), 40, 40, 10, 10, 40, 50, 10, 10);
  2479 isPixel(ctx, 15,15, 0,0,0,0, 5);
  2480 isPixel(ctx, 50,25, 0,0,0,0, 5);
  2484 </script>
  2485 <img src="image_yellow.png" id="yellow_4.png" class="resource">
  2487 <!-- [[[ test_2d.composite.uncovered.image.source-out.html ]]] -->
  2489 <p>Canvas test: 2d.composite.uncovered.image.source-out</p>
  2490 <!-- Testing: drawImage() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
  2491 <canvas id="c94" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2492 <script>
  2496 function test_2d_composite_uncovered_image_source_out() {
  2498 var canvas = document.getElementById('c94');
  2499 var ctx = canvas.getContext('2d');
  2502 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
  2503 ctx.fillRect(0, 0, 100, 50);
  2504 ctx.globalCompositeOperation = 'source-out';
  2505 ctx.drawImage(document.getElementById('yellow_5.png'), 40, 40, 10, 10, 40, 50, 10, 10);
  2506 isPixel(ctx, 15,15, 0,0,0,0, 5);
  2507 isPixel(ctx, 50,25, 0,0,0,0, 5);
  2511 </script>
  2512 <img src="image_yellow.png" id="yellow_5.png" class="resource">
  2514 <!-- [[[ test_2d.composite.uncovered.pattern.copy.html ]]] -->
  2516 <p>Canvas test: 2d.composite.uncovered.pattern.copy</p>
  2517 <!-- Testing: Pattern fill() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
  2518 <canvas id="c95" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2519 <script>
  2523 function test_2d_composite_uncovered_pattern_copy() {
  2525 var canvas = document.getElementById('c95');
  2526 var ctx = canvas.getContext('2d');
  2529 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
  2530 ctx.fillRect(0, 0, 100, 50);
  2531 ctx.globalCompositeOperation = 'copy';
  2532 ctx.fillStyle = ctx.createPattern(document.getElementById('yellow_6.png'), 'no-repeat');
  2533 ctx.fillRect(0, 50, 100, 50);
  2534 isPixel(ctx, 50,25, 0,0,0,0, 5);
  2538 </script>
  2539 <img src="image_yellow.png" id="yellow_6.png" class="resource">
  2541 <!-- [[[ test_2d.composite.uncovered.pattern.destination-atop.html ]]] -->
  2543 <p>Canvas test: 2d.composite.uncovered.pattern.destination-atop</p>
  2544 <!-- Testing: Pattern fill() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
  2545 <canvas id="c96" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2546 <script>
  2550 function test_2d_composite_uncovered_pattern_destination_atop() {
  2552 var canvas = document.getElementById('c96');
  2553 var ctx = canvas.getContext('2d');
  2556 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
  2557 ctx.fillRect(0, 0, 100, 50);
  2558 ctx.globalCompositeOperation = 'destination-atop';
  2559 ctx.fillStyle = ctx.createPattern(document.getElementById('yellow_7.png'), 'no-repeat');
  2560 ctx.fillRect(0, 50, 100, 50);
  2561 isPixel(ctx, 50,25, 0,0,0,0, 5);
  2565 </script>
  2566 <img src="image_yellow.png" id="yellow_7.png" class="resource">
  2568 <!-- [[[ test_2d.composite.uncovered.pattern.destination-in.html ]]] -->
  2570 <p>Canvas test: 2d.composite.uncovered.pattern.destination-in</p>
  2571 <!-- Testing: Pattern fill() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
  2572 <canvas id="c97" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2573 <script>
  2577 function test_2d_composite_uncovered_pattern_destination_in() {
  2579 var canvas = document.getElementById('c97');
  2580 var ctx = canvas.getContext('2d');
  2583 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
  2584 ctx.fillRect(0, 0, 100, 50);
  2585 ctx.globalCompositeOperation = 'destination-in';
  2586 ctx.fillStyle = ctx.createPattern(document.getElementById('yellow_8.png'), 'no-repeat');
  2587 ctx.fillRect(0, 50, 100, 50);
  2588 isPixel(ctx, 50,25, 0,0,0,0, 5);
  2592 </script>
  2593 <img src="image_yellow.png" id="yellow_8.png" class="resource">
  2595 <!-- [[[ test_2d.composite.uncovered.pattern.source-in.html ]]] -->
  2597 <p>Canvas test: 2d.composite.uncovered.pattern.source-in</p>
  2598 <!-- Testing: Pattern fill() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
  2599 <canvas id="c98" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2600 <script>
  2604 function test_2d_composite_uncovered_pattern_source_in() {
  2606 var canvas = document.getElementById('c98');
  2607 var ctx = canvas.getContext('2d');
  2610 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
  2611 ctx.fillRect(0, 0, 100, 50);
  2612 ctx.globalCompositeOperation = 'source-in';
  2613 ctx.fillStyle = ctx.createPattern(document.getElementById('yellow_9.png'), 'no-repeat');
  2614 ctx.fillRect(0, 50, 100, 50);
  2615 isPixel(ctx, 50,25, 0,0,0,0, 5);
  2619 </script>
  2620 <img src="image_yellow.png" id="yellow_9.png" class="resource">
  2622 <!-- [[[ test_2d.composite.uncovered.pattern.source-out.html ]]] -->
  2624 <p>Canvas test: 2d.composite.uncovered.pattern.source-out</p>
  2625 <!-- Testing: Pattern fill() draws pixels not covered by the source object as (0,0,0,0), and does not leave the pixels unchanged. -->
  2626 <canvas id="c99" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2627 <script>
  2631 function test_2d_composite_uncovered_pattern_source_out() {
  2633 var canvas = document.getElementById('c99');
  2634 var ctx = canvas.getContext('2d');
  2637 ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
  2638 ctx.fillRect(0, 0, 100, 50);
  2639 ctx.globalCompositeOperation = 'source-out';
  2640 ctx.fillStyle = ctx.createPattern(document.getElementById('yellow_10.png'), 'no-repeat');
  2641 ctx.fillRect(0, 50, 100, 50);
  2642 isPixel(ctx, 50,25, 0,0,0,0, 5);
  2646 </script>
  2647 <img src="image_yellow.png" id="yellow_10.png" class="resource">
  2649 <!-- [[[ test_2d.drawImage.3arg.html ]]] -->
  2651 <p>Canvas test: 2d.drawImage.3arg</p>
  2652 <canvas id="c100" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2653 <script>
  2656 function test_2d_drawImage_3arg() {
  2658 var canvas = document.getElementById('c100');
  2659 var ctx = canvas.getContext('2d');
  2661 ctx.drawImage(document.getElementById('green_1.png'), 0, 0);
  2662 ctx.drawImage(document.getElementById('red_3.png'), -100, 0);
  2663 ctx.drawImage(document.getElementById('red_3.png'), 100, 0);
  2664 ctx.drawImage(document.getElementById('red_3.png'), 0, -50);
  2665 ctx.drawImage(document.getElementById('red_3.png'), 0, 50);
  2667 isPixel(ctx, 0,0, 0,255,0,255, 2);
  2668 isPixel(ctx, 99,0, 0,255,0,255, 2);
  2669 isPixel(ctx, 0,49, 0,255,0,255, 2);
  2670 isPixel(ctx, 99,49, 0,255,0,255, 2);
  2674 </script>
  2675 <img src="image_red.png" id="red_3.png" class="resource">
  2676 <img src="image_green.png" id="green_1.png" class="resource">
  2678 <!-- [[[ test_2d.drawImage.5arg.html ]]] -->
  2680 <p>Canvas test: 2d.drawImage.5arg</p>
  2681 <canvas id="c101" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2682 <script>
  2685 function test_2d_drawImage_5arg() {
  2687 var canvas = document.getElementById('c101');
  2688 var ctx = canvas.getContext('2d');
  2690 ctx.fillStyle = '#f00';
  2691 ctx.fillRect(0, 0, 100, 50);
  2692 ctx.drawImage(document.getElementById('green_2.png'), 50, 0, 50, 50);
  2693 ctx.drawImage(document.getElementById('red_4.png'), 0, 0, 50, 50);
  2694 ctx.fillStyle = '#0f0';
  2695 ctx.fillRect(0, 0, 50, 50);
  2697 isPixel(ctx, 0,0, 0,255,0,255, 2);
  2698 isPixel(ctx, 99,0, 0,255,0,255, 2);
  2699 isPixel(ctx, 0,49, 0,255,0,255, 2);
  2700 isPixel(ctx, 99,49, 0,255,0,255, 2);
  2704 </script>
  2705 <img src="image_red.png" id="red_4.png" class="resource">
  2706 <img src="image_green.png" id="green_2.png" class="resource">
  2708 <!-- [[[ test_2d.drawImage.9arg.basic.html ]]] -->
  2710 <p>Canvas test: 2d.drawImage.9arg.basic</p>
  2711 <canvas id="c102" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2712 <script>
  2715 function test_2d_drawImage_9arg_basic() {
  2717 var canvas = document.getElementById('c102');
  2718 var ctx = canvas.getContext('2d');
  2720 ctx.fillStyle = '#f00';
  2721 ctx.fillRect(0, 0, 100, 50);
  2722 ctx.drawImage(document.getElementById('green_3.png'), 0, 0, 100, 50, 0, 0, 100, 50);
  2723 isPixel(ctx, 0,0, 0,255,0,255, 2);
  2724 isPixel(ctx, 99,0, 0,255,0,255, 2);
  2725 isPixel(ctx, 0,49, 0,255,0,255, 2);
  2726 isPixel(ctx, 99,49, 0,255,0,255, 2);
  2730 </script>
  2731 <img src="image_green.png" id="green_3.png" class="resource">
  2733 <!-- [[[ test_2d.drawImage.9arg.destpos.html ]]] -->
  2735 <p>Canvas test: 2d.drawImage.9arg.destpos</p>
  2736 <canvas id="c103" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2737 <script>
  2740 function test_2d_drawImage_9arg_destpos() {
  2742 var canvas = document.getElementById('c103');
  2743 var ctx = canvas.getContext('2d');
  2745 ctx.fillStyle = '#f00';
  2746 ctx.fillRect(0, 0, 100, 50);
  2747 ctx.drawImage(document.getElementById('green_4.png'), 0, 0, 100, 50, 0, 0, 100, 50);
  2748 ctx.drawImage(document.getElementById('red_5.png'), 0, 0, 100, 50, -100, 0, 100, 50);
  2749 ctx.drawImage(document.getElementById('red_5.png'), 0, 0, 100, 50, 100, 0, 100, 50);
  2750 ctx.drawImage(document.getElementById('red_5.png'), 0, 0, 100, 50, 0, -50, 100, 50);
  2751 ctx.drawImage(document.getElementById('red_5.png'), 0, 0, 100, 50, 0, 50, 100, 50);
  2752 isPixel(ctx, 0,0, 0,255,0,255, 2);
  2753 isPixel(ctx, 99,0, 0,255,0,255, 2);
  2754 isPixel(ctx, 0,49, 0,255,0,255, 2);
  2755 isPixel(ctx, 99,49, 0,255,0,255, 2);
  2759 </script>
  2760 <img src="image_red.png" id="red_5.png" class="resource">
  2761 <img src="image_green.png" id="green_4.png" class="resource">
  2763 <!-- [[[ test_2d.drawImage.9arg.destsize.html ]]] -->
  2765 <p>Canvas test: 2d.drawImage.9arg.destsize</p>
  2766 <canvas id="c104" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2767 <script>
  2770 function test_2d_drawImage_9arg_destsize() {
  2772 var canvas = document.getElementById('c104');
  2773 var ctx = canvas.getContext('2d');
  2775 ctx.fillStyle = '#f00';
  2776 ctx.fillRect(0, 0, 100, 50);
  2777 ctx.drawImage(document.getElementById('green_5.png'), 1, 1, 1, 1, 0, 0, 100, 50);
  2778 ctx.drawImage(document.getElementById('red_6.png'), 0, 0, 100, 50, -50, 0, 50, 50);
  2779 ctx.drawImage(document.getElementById('red_6.png'), 0, 0, 100, 50, 100, 0, 50, 50);
  2780 ctx.drawImage(document.getElementById('red_6.png'), 0, 0, 100, 50, 0, -25, 100, 25);
  2781 ctx.drawImage(document.getElementById('red_6.png'), 0, 0, 100, 50, 0, 50, 100, 25);
  2782 isPixel(ctx, 0,0, 0,255,0,255, 2);
  2783 isPixel(ctx, 99,0, 0,255,0,255, 2);
  2784 isPixel(ctx, 0,49, 0,255,0,255, 2);
  2785 isPixel(ctx, 99,49, 0,255,0,255, 2);
  2789 </script>
  2790 <img src="image_red.png" id="red_6.png" class="resource">
  2791 <img src="image_green.png" id="green_5.png" class="resource">
  2793 <!-- [[[ test_2d.drawImage.9arg.sourcepos.html ]]] -->
  2795 <p>Canvas test: 2d.drawImage.9arg.sourcepos</p>
  2796 <canvas id="c105" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2797 <script>
  2800 function test_2d_drawImage_9arg_sourcepos() {
  2802 var canvas = document.getElementById('c105');
  2803 var ctx = canvas.getContext('2d');
  2805 ctx.fillStyle = '#f00';
  2806 ctx.fillRect(0, 0, 100, 50);
  2807 ctx.drawImage(document.getElementById('rgrg-256x256_1.png'), 140, 20, 100, 50, 0, 0, 100, 50);
  2808 isPixel(ctx, 0,0, 0,255,0,255, 2);
  2809 isPixel(ctx, 99,0, 0,255,0,255, 2);
  2810 isPixel(ctx, 0,49, 0,255,0,255, 2);
  2811 isPixel(ctx, 99,49, 0,255,0,255, 2);
  2815 </script>
  2816 <img src="image_rgrg-256x256.png" id="rgrg-256x256_1.png" class="resource">
  2818 <!-- [[[ test_2d.drawImage.9arg.sourcesize.html ]]] -->
  2820 <p>Canvas test: 2d.drawImage.9arg.sourcesize</p>
  2821 <canvas id="c106" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2822 <script>
  2825 function test_2d_drawImage_9arg_sourcesize() {
  2827 var canvas = document.getElementById('c106');
  2828 var ctx = canvas.getContext('2d');
  2830 ctx.fillStyle = '#f00';
  2831 ctx.fillRect(0, 0, 100, 50);
  2832 ctx.drawImage(document.getElementById('rgrg-256x256_2.png'), 0, 0, 256, 256, 0, 0, 100, 50);
  2833 ctx.fillStyle = '#0f0';
  2834 ctx.fillRect(0, 0, 51, 26);
  2835 ctx.fillRect(49, 24, 51, 26);
  2836 isPixel(ctx, 0,0, 0,255,0,255, 3);
  2837 isPixel(ctx, 99,0, 0,255,0,255, 3);
  2838 isPixel(ctx, 0,49, 0,255,0,255, 3);
  2839 isPixel(ctx, 99,49, 0,255,0,255, 3);
  2840 isPixel(ctx, 20,20, 0,255,0,255, 3);
  2841 isPixel(ctx, 80,20, 0,255,0,255, 3);
  2842 isPixel(ctx, 20,30, 0,255,0,255, 3);
  2843 isPixel(ctx, 80,30, 0,255,0,255, 3);
  2847 </script>
  2848 <img src="image_rgrg-256x256.png" id="rgrg-256x256_2.png" class="resource">
  2850 <!-- [[[ test_2d.drawImage.alpha.html ]]] -->
  2852 <p>Canvas test: 2d.drawImage.alpha</p>
  2853 <canvas id="c107" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2854 <script>
  2857 function test_2d_drawImage_alpha() {
  2859 var canvas = document.getElementById('c107');
  2860 var ctx = canvas.getContext('2d');
  2862 ctx.fillStyle = '#0f0';
  2863 ctx.fillRect(0, 0, 100, 50);
  2864 ctx.globalAlpha = 0;
  2865 ctx.drawImage(document.getElementById('red_7.png'), 0, 0);
  2866 isPixel(ctx, 50,25, 0,255,0,255, 2);
  2870 </script>
  2871 <img src="image_red.png" id="red_7.png" class="resource">
  2873 <!-- [[[ test_2d.drawImage.animated.apng.html ]]] -->
  2875 <p>Canvas test: 2d.drawImage.animated.apng</p>
  2876 <!-- Testing: drawImage() of an APNG with no poster frame draws the first frame -->
  2877 <canvas id="c108" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2878 <script>
  2881 function deferTest() {
  2882     _deferred = true;
  2884 function wrapFunction(f) {
  2885     return function () {
  2886         f.apply(null, arguments);
  2887     };
  2890 var canvas108 = document.getElementById('c108');
  2891 var ctx108 = canvas108.getContext('2d');
  2892 var isDone_test_2d_drawImage_animated_apng = false;
  2894 function test_2d_drawImage_animated_apng() {
  2896 deferTest();
  2897 setTimeout(wrapFunction(function () {
  2898     ctx108.drawImage(document.getElementById('anim-gr_1.png'), 0, 0);
  2899     isPixel(ctx108, 50,25, 0,255,0,255, 2);
  2900 	isDone_test_2d_drawImage_animated_apng = true;
  2901 }), 5000);
  2905 </script>
  2906 <img src="image_anim-gr.png" id="anim-gr_1.png" class="resource">
  2908 <!-- [[[ test_2d.drawImage.animated.gif.html ]]] -->
  2910 <p>Canvas test: 2d.drawImage.animated.gif</p>
  2911 <!-- Testing: drawImage() of an animated GIF draws the first frame -->
  2912 <canvas id="c109" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2913 <script>
  2915 var canvas109 = document.getElementById('c109');
  2916 var ctx109 = canvas109.getContext('2d');
  2917 var isDone_test_2d_drawImage_animated_gif = false;
  2919 function test_2d_drawImage_animated_gif() {
  2921 deferTest();
  2922 setTimeout(wrapFunction(function () {
  2923     ctx109.drawImage(document.getElementById('anim-gr_1.gif'), 0, 0);
  2924     isPixel(ctx109, 50,25, 0,255,0,255, 2);
  2925 	isDone_test_2d_drawImage_animated_gif = true;
  2926 }), 5000);
  2930 </script>
  2931 <img src="image_anim-gr.gif" id="anim-gr_1.gif" class="resource">
  2933 <!-- [[[ test_2d.drawImage.animated.poster.html ]]] -->
  2935 <p>Canvas test: 2d.drawImage.animated.poster</p>
  2936 <!-- Testing: drawImage() of an APNG draws the poster frame -->
  2937 <canvas id="c110" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2938 <script>
  2940 var canvas110 = document.getElementById('c110');
  2941 var ctx110 = canvas110.getContext('2d');
  2944 function test_2d_drawImage_animated_poster() {
  2946 ctx110.drawImage(document.getElementById('anim-poster-gr_1.png'), 0, 0);
  2947 todo_isPixel(ctx110, 50,25, 0,255,0,255, 2);
  2951 </script>
  2952 <img src="image_anim-poster-gr.png" id="anim-poster-gr_1.png" class="resource">
  2954 <!-- [[[ test_2d.drawImage.broken.html ]]] -->
  2956 <p>Canvas test: 2d.drawImage.broken</p>
  2957 <canvas id="c111" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2958 <script>
  2960 function test_2d_drawImage_broken() {
  2962 var canvas = document.getElementById('c111');
  2963 var ctx = canvas.getContext('2d');
  2965 var img = document.getElementById('broken_1.png');
  2966 todo(img.complete === false, "img.complete === false");
  2967 var _thrown = undefined; try {
  2968   ctx.drawImage(img, 0, 0);
  2969 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "InvalidStateError" && _thrown.code == DOMException.INVALID_STATE_ERR, "should throw InvalidStateError");
  2973 </script>
  2974 <img src="image_broken.png" id="broken_1.png" class="resource">
  2976 <!-- [[[ test_2d.drawImage.canvas.html ]]] -->
  2978 <p>Canvas test: 2d.drawImage.canvas</p>
  2979 <canvas id="c112" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  2980 <script>
  2983 function test_2d_drawImage_canvas() {
  2985 var canvas = document.getElementById('c112');
  2986 var ctx = canvas.getContext('2d');
  2988 var canvas2 = document.createElement('canvas');
  2989 canvas2.width = 100;
  2990 canvas2.height = 50;
  2991 var ctx2 = canvas2.getContext('2d');
  2992 ctx2.fillStyle = '#0f0';
  2993 ctx2.fillRect(0, 0, 100, 50);
  2995 ctx.fillStyle = '#f00';
  2996 ctx.drawImage(canvas2, 0, 0);
  2998 isPixel(ctx, 0,0, 0,255,0,255, 2);
  2999 isPixel(ctx, 99,0, 0,255,0,255, 2);
  3000 isPixel(ctx, 0,49, 0,255,0,255, 2);
  3001 isPixel(ctx, 99,49, 0,255,0,255, 2);
  3005 </script>
  3007 <!-- [[[ test_2d.drawImage.clip.html ]]] -->
  3009 <p>Canvas test: 2d.drawImage.clip</p>
  3010 <canvas id="c113" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  3011 <script>
  3014 function test_2d_drawImage_clip() {
  3016 var canvas = document.getElementById('c113');
  3017 var ctx = canvas.getContext('2d');
  3019 ctx.fillStyle = '#0f0';
  3020 ctx.fillRect(0, 0, 100, 50);
  3021 ctx.rect(-10, -10, 1, 1);
  3022 ctx.clip();
  3023 ctx.drawImage(document.getElementById('red_8.png'), 0, 0);
  3024 isPixel(ctx, 50,25, 0,255,0,255, 2);
  3028 </script>
  3029 <img src="image_red.png" id="red_8.png" class="resource">
  3031 <!-- [[[ test_2d.drawImage.composite.html ]]] -->
  3033 <p>Canvas test: 2d.drawImage.composite</p>
  3034 <canvas id="c114" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  3035 <script>
  3038 function test_2d_drawImage_composite() {
  3040 var canvas = document.getElementById('c114');
  3041 var ctx = canvas.getContext('2d');
  3043 ctx.fillStyle = '#0f0';
  3044 ctx.fillRect(0, 0, 100, 50);
  3045 ctx.globalCompositeOperation = 'destination-over';
  3046 ctx.drawImage(document.getElementById('red_9.png'), 0, 0);
  3047 isPixel(ctx, 50,25, 0,255,0,255, 2);
  3051 </script>
  3052 <img src="image_red.png" id="red_9.png" class="resource">
  3054 <!-- [[[ test_2d.drawImage.floatsource.html ]]] -->
  3056 <p>Canvas test: 2d.drawImage.floatsource</p>
  3057 <canvas id="c115" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  3058 <script>
  3061 function test_2d_drawImage_floatsource() {
  3063 var canvas = document.getElementById('c115');
  3064 var ctx = canvas.getContext('2d');
  3066 ctx.drawImage(document.getElementById('green_6.png'), 10.1, 10.1, 0.1, 0.1, 0, 0, 100, 50);
  3067 isPixel(ctx, 50,25, 0,255,0,255, 2);
  3071 </script>
  3072 <img src="image_green.png" id="green_6.png" class="resource">
  3074 <!-- [[[ test_2d.drawImage.incomplete.html ]]] -->
  3076 <p>Canvas test: 2d.drawImage.incomplete</p>
  3077 <canvas id="c116" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  3078 <script>
  3080 function test_2d_drawImage_incomplete() {
  3082 var canvas = document.getElementById('c116');
  3083 var ctx = canvas.getContext('2d');
  3085 var img = new Image();
  3086 todo(img.complete === false, "img.complete === false");
  3087 var _thrown = undefined; try {
  3088   ctx.drawImage(img, 0, 0);
  3089 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "InvalidStateError" && _thrown.code == DOMException.INVALID_STATE_ERR, "should throw InvalidStateError");
  3093 </script>
  3095 <!-- [[[ test_2d.drawImage.negativedest.html ]]] -->
  3097 <p>Canvas test: 2d.drawImage.negativedest</p>
  3098 <canvas id="c117" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  3099 <script>
  3102 function test_2d_drawImage_negativedest() {
  3104 var canvas = document.getElementById('c117');
  3105 var ctx = canvas.getContext('2d');
  3107 var _thrown_outer = false;
  3108 try {
  3110 ctx.fillStyle = '#f00';
  3111 ctx.fillRect(0, 0, 100, 50);
  3112 ctx.drawImage(document.getElementById('ggrr-256x256_1.png'), 100, 78, 50, 50, 0, 50, 50, -50);
  3113 ctx.drawImage(document.getElementById('ggrr-256x256_1.png'), 100, 128, 50, -50, 100, 50, -50, -50);
  3114 isPixel(ctx, 1,1, 0,255,0,255, 2);
  3115 isPixel(ctx, 1,48, 0,255,0,255, 2);
  3116 isPixel(ctx, 98,1, 0,255,0,255, 2);
  3117 isPixel(ctx, 98,48, 0,255,0,255, 2);
  3118 isPixel(ctx, 48,1, 0,255,0,255, 2);
  3119 isPixel(ctx, 48,48, 0,255,0,255, 2);
  3120 isPixel(ctx, 51,1, 0,255,0,255, 2);
  3121 isPixel(ctx, 51,48, 0,255,0,255, 2);
  3122 isPixel(ctx, 25,25, 0,255,0,255, 2);
  3123 isPixel(ctx, 75,25, 0,255,0,255, 2);
  3125 } catch (e) {
  3126     _thrown_outer = true;
  3128 todo(!_thrown_outer, 'should not throw exception');
  3132 </script>
  3133 <img src="image_ggrr-256x256.png" id="ggrr-256x256_1.png" class="resource">
  3135 <!-- [[[ test_2d.drawImage.negativesource.html ]]] -->
  3137 <p>Canvas test: 2d.drawImage.negativesource</p>
  3138 <canvas id="c118" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  3139 <script>
  3142 function test_2d_drawImage_negativesource() {
  3144 var canvas = document.getElementById('c118');
  3145 var ctx = canvas.getContext('2d');
  3147 var _thrown_outer = false;
  3148 try {
  3150 ctx.fillStyle = '#f00';
  3151 ctx.fillRect(0, 0, 100, 50);
  3152 ctx.drawImage(document.getElementById('ggrr-256x256_2.png'), 100, 78, -100, 50, 0, 0, 50, 50);
  3153 ctx.drawImage(document.getElementById('ggrr-256x256_2.png'), 100, 128, -100, -50, 50, 0, 50, 50);
  3154 isPixel(ctx, 1,1, 0,255,0,255, 2);
  3155 isPixel(ctx, 1,48, 0,255,0,255, 2);
  3156 isPixel(ctx, 98,1, 0,255,0,255, 2);
  3157 isPixel(ctx, 98,48, 0,255,0,255, 2);
  3158 isPixel(ctx, 48,1, 0,255,0,255, 2);
  3159 isPixel(ctx, 48,48, 0,255,0,255, 2);
  3160 isPixel(ctx, 51,1, 0,255,0,255, 2);
  3161 isPixel(ctx, 51,48, 0,255,0,255, 2);
  3162 isPixel(ctx, 25,25, 0,255,0,255, 2);
  3163 isPixel(ctx, 75,25, 0,255,0,255, 2);
  3165 } catch (e) {
  3166     _thrown_outer = true;
  3168 todo(!_thrown_outer, 'should not throw exception');
  3172 </script>
  3173 <img src="image_ggrr-256x256.png" id="ggrr-256x256_2.png" class="resource">
  3175 <!-- [[[ test_2d.drawImage.nonfinite.html ]]] -->
  3177 <p>Canvas test: 2d.drawImage.nonfinite</p>
  3178 <!-- Testing: drawImage() with Infinity/NaN is ignored -->
  3179 <canvas id="c119" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  3180 <script>
  3183 function test_2d_drawImage_nonfinite() {
  3185 var canvas = document.getElementById('c119');
  3186 var ctx = canvas.getContext('2d');
  3188 var _thrown_outer = false;
  3190 try {
  3192 ctx.fillStyle = '#0f0';
  3193 ctx.fillRect(0, 0, 100, 50);
  3194 var red = document.getElementById('red_10.png');
  3195 ctx.drawImage(red, Infinity, 0);
  3196 ctx.drawImage(red, -Infinity, 0);
  3197 ctx.drawImage(red, NaN, 0);
  3198 ctx.drawImage(red, 0, Infinity);
  3199 ctx.drawImage(red, 0, -Infinity);
  3200 ctx.drawImage(red, 0, NaN);
  3201 ctx.drawImage(red, Infinity, Infinity);
  3202 ctx.drawImage(red, Infinity, 0, 100, 50);
  3203 ctx.drawImage(red, -Infinity, 0, 100, 50);
  3204 ctx.drawImage(red, NaN, 0, 100, 50);
  3205 ctx.drawImage(red, 0, Infinity, 100, 50);
  3206 ctx.drawImage(red, 0, -Infinity, 100, 50);
  3207 ctx.drawImage(red, 0, NaN, 100, 50);
  3208 ctx.drawImage(red, 0, 0, Infinity, 50);
  3209 ctx.drawImage(red, 0, 0, -Infinity, 50);
  3210 ctx.drawImage(red, 0, 0, NaN, 50);
  3211 ctx.drawImage(red, 0, 0, 100, Infinity);
  3212 ctx.drawImage(red, 0, 0, 100, -Infinity);
  3213 ctx.drawImage(red, 0, 0, 100, NaN);
  3214 ctx.drawImage(red, Infinity, Infinity, 100, 50);
  3215 ctx.drawImage(red, Infinity, Infinity, Infinity, 50);
  3216 ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity);
  3217 ctx.drawImage(red, Infinity, Infinity, 100, Infinity);
  3218 ctx.drawImage(red, Infinity, 0, Infinity, 50);
  3219 ctx.drawImage(red, Infinity, 0, Infinity, Infinity);
  3220 ctx.drawImage(red, Infinity, 0, 100, Infinity);
  3221 ctx.drawImage(red, 0, Infinity, Infinity, 50);
  3222 ctx.drawImage(red, 0, Infinity, Infinity, Infinity);
  3223 ctx.drawImage(red, 0, Infinity, 100, Infinity);
  3224 ctx.drawImage(red, 0, 0, Infinity, Infinity);
  3225 ctx.drawImage(red, Infinity, 0, 100, 50, 0, 0, 100, 50);
  3226 ctx.drawImage(red, -Infinity, 0, 100, 50, 0, 0, 100, 50);
  3227 ctx.drawImage(red, NaN, 0, 100, 50, 0, 0, 100, 50);
  3228 ctx.drawImage(red, 0, Infinity, 100, 50, 0, 0, 100, 50);
  3229 ctx.drawImage(red, 0, -Infinity, 100, 50, 0, 0, 100, 50);
  3230 ctx.drawImage(red, 0, NaN, 100, 50, 0, 0, 100, 50);
  3231 ctx.drawImage(red, 0, 0, Infinity, 50, 0, 0, 100, 50);
  3232 ctx.drawImage(red, 0, 0, -Infinity, 50, 0, 0, 100, 50);
  3233 ctx.drawImage(red, 0, 0, NaN, 50, 0, 0, 100, 50);
  3234 ctx.drawImage(red, 0, 0, 100, Infinity, 0, 0, 100, 50);
  3235 ctx.drawImage(red, 0, 0, 100, -Infinity, 0, 0, 100, 50);
  3236 ctx.drawImage(red, 0, 0, 100, NaN, 0, 0, 100, 50);
  3237 ctx.drawImage(red, 0, 0, 100, 50, Infinity, 0, 100, 50);
  3238 ctx.drawImage(red, 0, 0, 100, 50, -Infinity, 0, 100, 50);
  3239 ctx.drawImage(red, 0, 0, 100, 50, NaN, 0, 100, 50);
  3240 ctx.drawImage(red, 0, 0, 100, 50, 0, Infinity, 100, 50);
  3241 ctx.drawImage(red, 0, 0, 100, 50, 0, -Infinity, 100, 50);
  3242 ctx.drawImage(red, 0, 0, 100, 50, 0, NaN, 100, 50);
  3243 ctx.drawImage(red, 0, 0, 100, 50, 0, 0, Infinity, 50);
  3244 ctx.drawImage(red, 0, 0, 100, 50, 0, 0, -Infinity, 50);
  3245 ctx.drawImage(red, 0, 0, 100, 50, 0, 0, NaN, 50);
  3246 ctx.drawImage(red, 0, 0, 100, 50, 0, 0, 100, Infinity);
  3247 ctx.drawImage(red, 0, 0, 100, 50, 0, 0, 100, -Infinity);
  3248 ctx.drawImage(red, 0, 0, 100, 50, 0, 0, 100, NaN);
  3249 ctx.drawImage(red, Infinity, Infinity, 100, 50, 0, 0, 100, 50);
  3250 ctx.drawImage(red, Infinity, Infinity, Infinity, 50, 0, 0, 100, 50);
  3251 ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, 0, 0, 100, 50);
  3252 ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, Infinity, 0, 100, 50);
  3253 ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity, 100, 50);
  3254 ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity, 50);
  3255 ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity);
  3256 ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity, 100, Infinity);
  3257 ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, Infinity, 0, Infinity, 50);
  3258 ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, Infinity, 0, Infinity, Infinity);
  3259 ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, Infinity, 0, 100, Infinity);
  3260 ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, 0, Infinity, 100, 50);
  3261 ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, 0, Infinity, Infinity, 50);
  3262 ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, 0, Infinity, Infinity, Infinity);
  3263 ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, 0, Infinity, 100, Infinity);
  3264 ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, 0, 0, Infinity, 50);
  3265 ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, 0, 0, Infinity, Infinity);
  3266 ctx.drawImage(red, Infinity, Infinity, Infinity, Infinity, 0, 0, 100, Infinity);
  3267 ctx.drawImage(red, Infinity, Infinity, Infinity, 50, Infinity, 0, 100, 50);
  3268 ctx.drawImage(red, Infinity, Infinity, Infinity, 50, Infinity, Infinity, 100, 50);
  3269 ctx.drawImage(red, Infinity, Infinity, Infinity, 50, Infinity, Infinity, Infinity, 50);
  3270 ctx.drawImage(red, Infinity, Infinity, Infinity, 50, Infinity, Infinity, Infinity, Infinity);
  3271 ctx.drawImage(red, Infinity, Infinity, Infinity, 50, Infinity, Infinity, 100, Infinity);
  3272 ctx.drawImage(red, Infinity, Infinity, Infinity, 50, Infinity, 0, Infinity, 50);
  3273 ctx.drawImage(red, Infinity, Infinity, Infinity, 50, Infinity, 0, Infinity, Infinity);
  3274 ctx.drawImage(red, Infinity, Infinity, Infinity, 50, Infinity, 0, 100, Infinity);
  3275 ctx.drawImage(red, Infinity, Infinity, Infinity, 50, 0, Infinity, 100, 50);
  3276 ctx.drawImage(red, Infinity, Infinity, Infinity, 50, 0, Infinity, Infinity, 50);
  3277 ctx.drawImage(red, Infinity, Infinity, Infinity, 50, 0, Infinity, Infinity, Infinity);
  3278 ctx.drawImage(red, Infinity, Infinity, Infinity, 50, 0, Infinity, 100, Infinity);
  3279 ctx.drawImage(red, Infinity, Infinity, Infinity, 50, 0, 0, Infinity, 50);
  3280 ctx.drawImage(red, Infinity, Infinity, Infinity, 50, 0, 0, Infinity, Infinity);
  3281 ctx.drawImage(red, Infinity, Infinity, Infinity, 50, 0, 0, 100, Infinity);
  3282 ctx.drawImage(red, Infinity, Infinity, 100, Infinity, 0, 0, 100, 50);
  3283 ctx.drawImage(red, Infinity, Infinity, 100, Infinity, Infinity, 0, 100, 50);
  3284 ctx.drawImage(red, Infinity, Infinity, 100, Infinity, Infinity, Infinity, 100, 50);
  3285 ctx.drawImage(red, Infinity, Infinity, 100, Infinity, Infinity, Infinity, Infinity, 50);
  3286 ctx.drawImage(red, Infinity, Infinity, 100, Infinity, Infinity, Infinity, Infinity, Infinity);
  3287 ctx.drawImage(red, Infinity, Infinity, 100, Infinity, Infinity, Infinity, 100, Infinity);
  3288 ctx.drawImage(red, Infinity, Infinity, 100, Infinity, Infinity, 0, Infinity, 50);
  3289 ctx.drawImage(red, Infinity, Infinity, 100, Infinity, Infinity, 0, Infinity, Infinity);
  3290 ctx.drawImage(red, Infinity, Infinity, 100, Infinity, Infinity, 0, 100, Infinity);
  3291 ctx.drawImage(red, Infinity, Infinity, 100, Infinity, 0, Infinity, 100, 50);
  3292 ctx.drawImage(red, Infinity, Infinity, 100, Infinity, 0, Infinity, Infinity, 50);
  3293 ctx.drawImage(red, Infinity, Infinity, 100, Infinity, 0, Infinity, Infinity, Infinity);
  3294 ctx.drawImage(red, Infinity, Infinity, 100, Infinity, 0, Infinity, 100, Infinity);
  3295 ctx.drawImage(red, Infinity, Infinity, 100, Infinity, 0, 0, Infinity, 50);
  3296 ctx.drawImage(red, Infinity, Infinity, 100, Infinity, 0, 0, Infinity, Infinity);
  3297 ctx.drawImage(red, Infinity, Infinity, 100, Infinity, 0, 0, 100, Infinity);
  3298 ctx.drawImage(red, Infinity, Infinity, 100, 50, Infinity, 0, 100, 50);
  3299 ctx.drawImage(red, Infinity, Infinity, 100, 50, Infinity, Infinity, 100, 50);
  3300 ctx.drawImage(red, Infinity, Infinity, 100, 50, Infinity, Infinity, Infinity, 50);
  3301 ctx.drawImage(red, Infinity, Infinity, 100, 50, Infinity, Infinity, Infinity, Infinity);
  3302 ctx.drawImage(red, Infinity, Infinity, 100, 50, Infinity, Infinity, 100, Infinity);
  3303 ctx.drawImage(red, Infinity, Infinity, 100, 50, Infinity, 0, Infinity, 50);
  3304 ctx.drawImage(red, Infinity, Infinity, 100, 50, Infinity, 0, Infinity, Infinity);
  3305 ctx.drawImage(red, Infinity, Infinity, 100, 50, Infinity, 0, 100, Infinity);
  3306 ctx.drawImage(red, Infinity, Infinity, 100, 50, 0, Infinity, 100, 50);
  3307 ctx.drawImage(red, Infinity, Infinity, 100, 50, 0, Infinity, Infinity, 50);
  3308 ctx.drawImage(red, Infinity, Infinity, 100, 50, 0, Infinity, Infinity, Infinity);
  3309 ctx.drawImage(red, Infinity, Infinity, 100, 50, 0, Infinity, 100, Infinity);
  3310 ctx.drawImage(red, Infinity, Infinity, 100, 50, 0, 0, Infinity, 50);
  3311 ctx.drawImage(red, Infinity, Infinity, 100, 50, 0, 0, Infinity, Infinity);
  3312 ctx.drawImage(red, Infinity, Infinity, 100, 50, 0, 0, 100, Infinity);
  3313 ctx.drawImage(red, Infinity, 0, Infinity, 50, 0, 0, 100, 50);
  3314 ctx.drawImage(red, Infinity, 0, Infinity, Infinity, 0, 0, 100, 50);
  3315 ctx.drawImage(red, Infinity, 0, Infinity, Infinity, Infinity, 0, 100, 50);
  3316 ctx.drawImage(red, Infinity, 0, Infinity, Infinity, Infinity, Infinity, 100, 50);
  3317 ctx.drawImage(red, Infinity, 0, Infinity, Infinity, Infinity, Infinity, Infinity, 50);
  3318 ctx.drawImage(red, Infinity, 0, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity);
  3319 ctx.drawImage(red, Infinity, 0, Infinity, Infinity, Infinity, Infinity, 100, Infinity);
  3320 ctx.drawImage(red, Infinity, 0, Infinity, Infinity, Infinity, 0, Infinity, 50);
  3321 ctx.drawImage(red, Infinity, 0, Infinity, Infinity, Infinity, 0, Infinity, Infinity);
  3322 ctx.drawImage(red, Infinity, 0, Infinity, Infinity, Infinity, 0, 100, Infinity);
  3323 ctx.drawImage(red, Infinity, 0, Infinity, Infinity, 0, Infinity, 100, 50);
  3324 ctx.drawImage(red, Infinity, 0, Infinity, Infinity, 0, Infinity, Infinity, 50);
  3325 ctx.drawImage(red, Infinity, 0, Infinity, Infinity, 0, Infinity, Infinity, Infinity);
  3326 ctx.drawImage(red, Infinity, 0, Infinity, Infinity, 0, Infinity, 100, Infinity);
  3327 ctx.drawImage(red, Infinity, 0, Infinity, Infinity, 0, 0, Infinity, 50);
  3328 ctx.drawImage(red, Infinity, 0, Infinity, Infinity, 0, 0, Infinity, Infinity);
  3329 ctx.drawImage(red, Infinity, 0, Infinity, Infinity, 0, 0, 100, Infinity);
  3330 ctx.drawImage(red, Infinity, 0, Infinity, 50, Infinity, 0, 100, 50);
  3331 ctx.drawImage(red, Infinity, 0, Infinity, 50, Infinity, Infinity, 100, 50);
  3332 ctx.drawImage(red, Infinity, 0, Infinity, 50, Infinity, Infinity, Infinity, 50);
  3333 ctx.drawImage(red, Infinity, 0, Infinity, 50, Infinity, Infinity, Infinity, Infinity);
  3334 ctx.drawImage(red, Infinity, 0, Infinity, 50, Infinity, Infinity, 100, Infinity);
  3335 ctx.drawImage(red, Infinity, 0, Infinity, 50, Infinity, 0, Infinity, 50);
  3336 ctx.drawImage(red, Infinity, 0, Infinity, 50, Infinity, 0, Infinity, Infinity);
  3337 ctx.drawImage(red, Infinity, 0, Infinity, 50, Infinity, 0, 100, Infinity);
  3338 ctx.drawImage(red, Infinity, 0, Infinity, 50, 0, Infinity, 100, 50);
  3339 ctx.drawImage(red, Infinity, 0, Infinity, 50, 0, Infinity, Infinity, 50);
  3340 ctx.drawImage(red, Infinity, 0, Infinity, 50, 0, Infinity, Infinity, Infinity);
  3341 ctx.drawImage(red, Infinity, 0, Infinity, 50, 0, Infinity, 100, Infinity);
  3342 ctx.drawImage(red, Infinity, 0, Infinity, 50, 0, 0, Infinity, 50);
  3343 ctx.drawImage(red, Infinity, 0, Infinity, 50, 0, 0, Infinity, Infinity);
  3344 ctx.drawImage(red, Infinity, 0, Infinity, 50, 0, 0, 100, Infinity);
  3345 ctx.drawImage(red, Infinity, 0, 100, Infinity, 0, 0, 100, 50);
  3346 ctx.drawImage(red, Infinity, 0, 100, Infinity, Infinity, 0, 100, 50);
  3347 ctx.drawImage(red, Infinity, 0, 100, Infinity, Infinity, Infinity, 100, 50);
  3348 ctx.drawImage(red, Infinity, 0, 100, Infinity, Infinity, Infinity, Infinity, 50);
  3349 ctx.drawImage(red, Infinity, 0, 100, Infinity, Infinity, Infinity, Infinity, Infinity);
  3350 ctx.drawImage(red, Infinity, 0, 100, Infinity, Infinity, Infinity, 100, Infinity);
  3351 ctx.drawImage(red, Infinity, 0, 100, Infinity, Infinity, 0, Infinity, 50);
  3352 ctx.drawImage(red, Infinity, 0, 100, Infinity, Infinity, 0, Infinity, Infinity);
  3353 ctx.drawImage(red, Infinity, 0, 100, Infinity, Infinity, 0, 100, Infinity);
  3354 ctx.drawImage(red, Infinity, 0, 100, Infinity, 0, Infinity, 100, 50);
  3355 ctx.drawImage(red, Infinity, 0, 100, Infinity, 0, Infinity, Infinity, 50);
  3356 ctx.drawImage(red, Infinity, 0, 100, Infinity, 0, Infinity, Infinity, Infinity);
  3357 ctx.drawImage(red, Infinity, 0, 100, Infinity, 0, Infinity, 100, Infinity);
  3358 ctx.drawImage(red, Infinity, 0, 100, Infinity, 0, 0, Infinity, 50);
  3359 ctx.drawImage(red, Infinity, 0, 100, Infinity, 0, 0, Infinity, Infinity);
  3360 ctx.drawImage(red, Infinity, 0, 100, Infinity, 0, 0, 100, Infinity);
  3361 ctx.drawImage(red, Infinity, 0, 100, 50, Infinity, 0, 100, 50);
  3362 ctx.drawImage(red, Infinity, 0, 100, 50, Infinity, Infinity, 100, 50);
  3363 ctx.drawImage(red, Infinity, 0, 100, 50, Infinity, Infinity, Infinity, 50);
  3364 ctx.drawImage(red, Infinity, 0, 100, 50, Infinity, Infinity, Infinity, Infinity);
  3365 ctx.drawImage(red, Infinity, 0, 100, 50, Infinity, Infinity, 100, Infinity);
  3366 ctx.drawImage(red, Infinity, 0, 100, 50, Infinity, 0, Infinity, 50);
  3367 ctx.drawImage(red, Infinity, 0, 100, 50, Infinity, 0, Infinity, Infinity);
  3368 ctx.drawImage(red, Infinity, 0, 100, 50, Infinity, 0, 100, Infinity);
  3369 ctx.drawImage(red, Infinity, 0, 100, 50, 0, Infinity, 100, 50);
  3370 ctx.drawImage(red, Infinity, 0, 100, 50, 0, Infinity, Infinity, 50);
  3371 ctx.drawImage(red, Infinity, 0, 100, 50, 0, Infinity, Infinity, Infinity);
  3372 ctx.drawImage(red, Infinity, 0, 100, 50, 0, Infinity, 100, Infinity);
  3373 ctx.drawImage(red, Infinity, 0, 100, 50, 0, 0, Infinity, 50);
  3374 ctx.drawImage(red, Infinity, 0, 100, 50, 0, 0, Infinity, Infinity);
  3375 ctx.drawImage(red, Infinity, 0, 100, 50, 0, 0, 100, Infinity);
  3376 ctx.drawImage(red, 0, Infinity, Infinity, 50, 0, 0, 100, 50);
  3377 ctx.drawImage(red, 0, Infinity, Infinity, Infinity, 0, 0, 100, 50);
  3378 ctx.drawImage(red, 0, Infinity, Infinity, Infinity, Infinity, 0, 100, 50);
  3379 ctx.drawImage(red, 0, Infinity, Infinity, Infinity, Infinity, Infinity, 100, 50);
  3380 ctx.drawImage(red, 0, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity, 50);
  3381 ctx.drawImage(red, 0, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity);
  3382 ctx.drawImage(red, 0, Infinity, Infinity, Infinity, Infinity, Infinity, 100, Infinity);
  3383 ctx.drawImage(red, 0, Infinity, Infinity, Infinity, Infinity, 0, Infinity, 50);
  3384 ctx.drawImage(red, 0, Infinity, Infinity, Infinity, Infinity, 0, Infinity, Infinity);
  3385 ctx.drawImage(red, 0, Infinity, Infinity, Infinity, Infinity, 0, 100, Infinity);
  3386 ctx.drawImage(red, 0, Infinity, Infinity, Infinity, 0, Infinity, 100, 50);
  3387 ctx.drawImage(red, 0, Infinity, Infinity, Infinity, 0, Infinity, Infinity, 50);
  3388 ctx.drawImage(red, 0, Infinity, Infinity, Infinity, 0, Infinity, Infinity, Infinity);
  3389 ctx.drawImage(red, 0, Infinity, Infinity, Infinity, 0, Infinity, 100, Infinity);
  3390 ctx.drawImage(red, 0, Infinity, Infinity, Infinity, 0, 0, Infinity, 50);
  3391 ctx.drawImage(red, 0, Infinity, Infinity, Infinity, 0, 0, Infinity, Infinity);
  3392 ctx.drawImage(red, 0, Infinity, Infinity, Infinity, 0, 0, 100, Infinity);
  3393 ctx.drawImage(red, 0, Infinity, Infinity, 50, Infinity, 0, 100, 50);
  3394 ctx.drawImage(red, 0, Infinity, Infinity, 50, Infinity, Infinity, 100, 50);
  3395 ctx.drawImage(red, 0, Infinity, Infinity, 50, Infinity, Infinity, Infinity, 50);
  3396 ctx.drawImage(red, 0, Infinity, Infinity, 50, Infinity, Infinity, Infinity, Infinity);
  3397 ctx.drawImage(red, 0, Infinity, Infinity, 50, Infinity, Infinity, 100, Infinity);
  3398 ctx.drawImage(red, 0, Infinity, Infinity, 50, Infinity, 0, Infinity, 50);
  3399 ctx.drawImage(red, 0, Infinity, Infinity, 50, Infinity, 0, Infinity, Infinity);
  3400 ctx.drawImage(red, 0, Infinity, Infinity, 50, Infinity, 0, 100, Infinity);
  3401 ctx.drawImage(red, 0, Infinity, Infinity, 50, 0, Infinity, 100, 50);
  3402 ctx.drawImage(red, 0, Infinity, Infinity, 50, 0, Infinity, Infinity, 50);
  3403 ctx.drawImage(red, 0, Infinity, Infinity, 50, 0, Infinity, Infinity, Infinity);
  3404 ctx.drawImage(red, 0, Infinity, Infinity, 50, 0, Infinity, 100, Infinity);
  3405 ctx.drawImage(red, 0, Infinity, Infinity, 50, 0, 0, Infinity, 50);
  3406 ctx.drawImage(red, 0, Infinity, Infinity, 50, 0, 0, Infinity, Infinity);
  3407 ctx.drawImage(red, 0, Infinity, Infinity, 50, 0, 0, 100, Infinity);
  3408 ctx.drawImage(red, 0, Infinity, 100, Infinity, 0, 0, 100, 50);
  3409 ctx.drawImage(red, 0, Infinity, 100, Infinity, Infinity, 0, 100, 50);
  3410 ctx.drawImage(red, 0, Infinity, 100, Infinity, Infinity, Infinity, 100, 50);
  3411 ctx.drawImage(red, 0, Infinity, 100, Infinity, Infinity, Infinity, Infinity, 50);
  3412 ctx.drawImage(red, 0, Infinity, 100, Infinity, Infinity, Infinity, Infinity, Infinity);
  3413 ctx.drawImage(red, 0, Infinity, 100, Infinity, Infinity, Infinity, 100, Infinity);
  3414 ctx.drawImage(red, 0, Infinity, 100, Infinity, Infinity, 0, Infinity, 50);
  3415 ctx.drawImage(red, 0, Infinity, 100, Infinity, Infinity, 0, Infinity, Infinity);
  3416 ctx.drawImage(red, 0, Infinity, 100, Infinity, Infinity, 0, 100, Infinity);
  3417 ctx.drawImage(red, 0, Infinity, 100, Infinity, 0, Infinity, 100, 50);
  3418 ctx.drawImage(red, 0, Infinity, 100, Infinity, 0, Infinity, Infinity, 50);
  3419 ctx.drawImage(red, 0, Infinity, 100, Infinity, 0, Infinity, Infinity, Infinity);
  3420 ctx.drawImage(red, 0, Infinity, 100, Infinity, 0, Infinity, 100, Infinity);
  3421 ctx.drawImage(red, 0, Infinity, 100, Infinity, 0, 0, Infinity, 50);
  3422 ctx.drawImage(red, 0, Infinity, 100, Infinity, 0, 0, Infinity, Infinity);
  3423 ctx.drawImage(red, 0, Infinity, 100, Infinity, 0, 0, 100, Infinity);
  3424 ctx.drawImage(red, 0, Infinity, 100, 50, Infinity, 0, 100, 50);
  3425 ctx.drawImage(red, 0, Infinity, 100, 50, Infinity, Infinity, 100, 50);
  3426 ctx.drawImage(red, 0, Infinity, 100, 50, Infinity, Infinity, Infinity, 50);
  3427 ctx.drawImage(red, 0, Infinity, 100, 50, Infinity, Infinity, Infinity, Infinity);
  3428 ctx.drawImage(red, 0, Infinity, 100, 50, Infinity, Infinity, 100, Infinity);
  3429 ctx.drawImage(red, 0, Infinity, 100, 50, Infinity, 0, Infinity, 50);
  3430 ctx.drawImage(red, 0, Infinity, 100, 50, Infinity, 0, Infinity, Infinity);
  3431 ctx.drawImage(red, 0, Infinity, 100, 50, Infinity, 0, 100, Infinity);
  3432 ctx.drawImage(red, 0, Infinity, 100, 50, 0, Infinity, 100, 50);
  3433 ctx.drawImage(red, 0, Infinity, 100, 50, 0, Infinity, Infinity, 50);
  3434 ctx.drawImage(red, 0, Infinity, 100, 50, 0, Infinity, Infinity, Infinity);
  3435 ctx.drawImage(red, 0, Infinity, 100, 50, 0, Infinity, 100, Infinity);
  3436 ctx.drawImage(red, 0, Infinity, 100, 50, 0, 0, Infinity, 50);
  3437 ctx.drawImage(red, 0, Infinity, 100, 50, 0, 0, Infinity, Infinity);
  3438 ctx.drawImage(red, 0, Infinity, 100, 50, 0, 0, 100, Infinity);
  3439 ctx.drawImage(red, 0, 0, Infinity, Infinity, 0, 0, 100, 50);
  3440 ctx.drawImage(red, 0, 0, Infinity, Infinity, Infinity, 0, 100, 50);
  3441 ctx.drawImage(red, 0, 0, Infinity, Infinity, Infinity, Infinity, 100, 50);
  3442 ctx.drawImage(red, 0, 0, Infinity, Infinity, Infinity, Infinity, Infinity, 50);
  3443 ctx.drawImage(red, 0, 0, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity);
  3444 ctx.drawImage(red, 0, 0, Infinity, Infinity, Infinity, Infinity, 100, Infinity);
  3445 ctx.drawImage(red, 0, 0, Infinity, Infinity, Infinity, 0, Infinity, 50);
  3446 ctx.drawImage(red, 0, 0, Infinity, Infinity, Infinity, 0, Infinity, Infinity);
  3447 ctx.drawImage(red, 0, 0, Infinity, Infinity, Infinity, 0, 100, Infinity);
  3448 ctx.drawImage(red, 0, 0, Infinity, Infinity, 0, Infinity, 100, 50);
  3449 ctx.drawImage(red, 0, 0, Infinity, Infinity, 0, Infinity, Infinity, 50);
  3450 ctx.drawImage(red, 0, 0, Infinity, Infinity, 0, Infinity, Infinity, Infinity);
  3451 ctx.drawImage(red, 0, 0, Infinity, Infinity, 0, Infinity, 100, Infinity);
  3452 ctx.drawImage(red, 0, 0, Infinity, Infinity, 0, 0, Infinity, 50);
  3453 ctx.drawImage(red, 0, 0, Infinity, Infinity, 0, 0, Infinity, Infinity);
  3454 ctx.drawImage(red, 0, 0, Infinity, Infinity, 0, 0, 100, Infinity);
  3455 ctx.drawImage(red, 0, 0, Infinity, 50, Infinity, 0, 100, 50);
  3456 ctx.drawImage(red, 0, 0, Infinity, 50, Infinity, Infinity, 100, 50);
  3457 ctx.drawImage(red, 0, 0, Infinity, 50, Infinity, Infinity, Infinity, 50);
  3458 ctx.drawImage(red, 0, 0, Infinity, 50, Infinity, Infinity, Infinity, Infinity);
  3459 ctx.drawImage(red, 0, 0, Infinity, 50, Infinity, Infinity, 100, Infinity);
  3460 ctx.drawImage(red, 0, 0, Infinity, 50, Infinity, 0, Infinity, 50);
  3461 ctx.drawImage(red, 0, 0, Infinity, 50, Infinity, 0, Infinity, Infinity);
  3462 ctx.drawImage(red, 0, 0, Infinity, 50, Infinity, 0, 100, Infinity);
  3463 ctx.drawImage(red, 0, 0, Infinity, 50, 0, Infinity, 100, 50);
  3464 ctx.drawImage(red, 0, 0, Infinity, 50, 0, Infinity, Infinity, 50);
  3465 ctx.drawImage(red, 0, 0, Infinity, 50, 0, Infinity, Infinity, Infinity);
  3466 ctx.drawImage(red, 0, 0, Infinity, 50, 0, Infinity, 100, Infinity);
  3467 ctx.drawImage(red, 0, 0, Infinity, 50, 0, 0, Infinity, 50);
  3468 ctx.drawImage(red, 0, 0, Infinity, 50, 0, 0, Infinity, Infinity);
  3469 ctx.drawImage(red, 0, 0, Infinity, 50, 0, 0, 100, Infinity);
  3470 ctx.drawImage(red, 0, 0, 100, Infinity, Infinity, 0, 100, 50);
  3471 ctx.drawImage(red, 0, 0, 100, Infinity, Infinity, Infinity, 100, 50);
  3472 ctx.drawImage(red, 0, 0, 100, Infinity, Infinity, Infinity, Infinity, 50);
  3473 ctx.drawImage(red, 0, 0, 100, Infinity, Infinity, Infinity, Infinity, Infinity);
  3474 ctx.drawImage(red, 0, 0, 100, Infinity, Infinity, Infinity, 100, Infinity);
  3475 ctx.drawImage(red, 0, 0, 100, Infinity, Infinity, 0, Infinity, 50);
  3476 ctx.drawImage(red, 0, 0, 100, Infinity, Infinity, 0, Infinity, Infinity);
  3477 ctx.drawImage(red, 0, 0, 100, Infinity, Infinity, 0, 100, Infinity);
  3478 ctx.drawImage(red, 0, 0, 100, Infinity, 0, Infinity, 100, 50);
  3479 ctx.drawImage(red, 0, 0, 100, Infinity, 0, Infinity, Infinity, 50);
  3480 ctx.drawImage(red, 0, 0, 100, Infinity, 0, Infinity, Infinity, Infinity);
  3481 ctx.drawImage(red, 0, 0, 100, Infinity, 0, Infinity, 100, Infinity);
  3482 ctx.drawImage(red, 0, 0, 100, Infinity, 0, 0, Infinity, 50);
  3483 ctx.drawImage(red, 0, 0, 100, Infinity, 0, 0, Infinity, Infinity);
  3484 ctx.drawImage(red, 0, 0, 100, Infinity, 0, 0, 100, Infinity);
  3485 ctx.drawImage(red, 0, 0, 100, 50, Infinity, Infinity, 100, 50);
  3486 ctx.drawImage(red, 0, 0, 100, 50, Infinity, Infinity, Infinity, 50);
  3487 ctx.drawImage(red, 0, 0, 100, 50, Infinity, Infinity, Infinity, Infinity);
  3488 ctx.drawImage(red, 0, 0, 100, 50, Infinity, Infinity, 100, Infinity);
  3489 ctx.drawImage(red, 0, 0, 100, 50, Infinity, 0, Infinity, 50);
  3490 ctx.drawImage(red, 0, 0, 100, 50, Infinity, 0, Infinity, Infinity);
  3491 ctx.drawImage(red, 0, 0, 100, 50, Infinity, 0, 100, Infinity);
  3492 ctx.drawImage(red, 0, 0, 100, 50, 0, Infinity, Infinity, 50);
  3493 ctx.drawImage(red, 0, 0, 100, 50, 0, Infinity, Infinity, Infinity);
  3494 ctx.drawImage(red, 0, 0, 100, 50, 0, Infinity, 100, Infinity);
  3495 ctx.drawImage(red, 0, 0, 100, 50, 0, 0, Infinity, Infinity);
  3496 isPixel(ctx, 50,25, 0,255,0,255, 0);
  3498 } catch (e) {
  3499     _thrown_outer = true;
  3501 ok(!_thrown_outer, 'should not throw exception');
  3505 </script>
  3506 <img src="image_red.png" id="red_10.png" class="resource">
  3508 <!-- [[[ test_2d.drawImage.nowrap.html ]]] -->
  3510 <p>Canvas test: 2d.drawImage.nowrap</p>
  3511 <!-- Testing: Stretched images do not get pixels wrapping around the edges -->
  3512 <canvas id="c120" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  3513 <script>
  3516 function test_2d_drawImage_nowrap() {
  3518 var canvas = document.getElementById('c120');
  3519 var ctx = canvas.getContext('2d');
  3521 ctx.fillStyle = '#0f0';
  3522 ctx.fillRect(0, 0, 100, 50);
  3523 ctx.drawImage(document.getElementById('redtransparent_1.png'), -1950, 0, 2000, 50);
  3524 isPixel(ctx, 45,25, 0,255,0,255, 2);
  3525 isPixel(ctx, 50,25, 0,255,0,255, 2);
  3526 isPixel(ctx, 55,25, 0,255,0,255, 2);
  3530 </script>
  3531 <img src="image_redtransparent.png" id="redtransparent_1.png" class="resource">
  3533 <!-- [[[ test_2d.drawImage.null.html ]]] -->
  3535 <p>Canvas test: 2d.drawImage.null</p>
  3536 <canvas id="c121" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  3537 <script>
  3539 function test_2d_drawImage_null() {
  3541 var canvas = document.getElementById('c121');
  3542 var ctx = canvas.getContext('2d');
  3544 var _thrown = undefined; try {
  3545   ctx.drawImage(null, 0, 0);
  3546 } catch (e) { _thrown = e };
  3548 ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
  3551 </script>
  3553 <!-- [[[ test_2d.drawImage.outsidesource.html ]]] -->
  3555 <p>Canvas test: 2d.drawImage.outsidesource</p>
  3556 <canvas id="c122" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  3557 <script>
  3561 function test_2d_drawImage_outsidesource() {
  3563 var canvas = document.getElementById('c122');
  3564 var ctx = canvas.getContext('2d');
  3566 var _thrown_outer = false;
  3567 try {
  3569 ctx.drawImage(document.getElementById('green_7.png'), 10.5, 10.5, 89.5, 39.5, 0, 0, 100, 50);
  3570 ctx.drawImage(document.getElementById('green_7.png'), 5.5, 5.5, -5.5, -5.5, 0, 0, 100, 50);
  3571 ctx.drawImage(document.getElementById('green_7.png'), 100, 50, -5, -5, 0, 0, 100, 50);
  3572 var _thrown = undefined; try {
  3573   ctx.drawImage(document.getElementById('red_11.png'), -0.001, 0, 100, 50, 0, 0, 100, 50);
  3574 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
  3575 var _thrown = undefined; try {
  3576   ctx.drawImage(document.getElementById('red_11.png'), 0, -0.001, 100, 50, 0, 0, 100, 50);
  3577 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
  3578 var _thrown = undefined; try {
  3579   ctx.drawImage(document.getElementById('red_11.png'), 0, 0, 100.001, 50, 0, 0, 100, 50);
  3580 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
  3581 var _thrown = undefined; try {
  3582   ctx.drawImage(document.getElementById('red_11.png'), 0, 0, 100, 50.001, 0, 0, 100, 50);
  3583 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
  3584 var _thrown = undefined; try {
  3585   ctx.drawImage(document.getElementById('red_11.png'), 50, 0, 50.001, 50, 0, 0, 100, 50);
  3586 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
  3587 var _thrown = undefined; try {
  3588   ctx.drawImage(document.getElementById('red_11.png'), 0, 0, -5, 5, 0, 0, 100, 50);
  3589 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
  3590 var _thrown = undefined; try {
  3591   ctx.drawImage(document.getElementById('red_11.png'), 0, 0, 5, -5, 0, 0, 100, 50);
  3592 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
  3593 var _thrown = undefined; try {
  3594   ctx.drawImage(document.getElementById('red_11.png'), 110, 60, -20, -20, 0, 0, 100, 50);
  3595 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
  3596 todo_isPixel(ctx, 50,25, 0,255,0,255, 2);
  3598 } catch (e) {
  3599     _thrown_outer = true;
  3601 todo(!_thrown_outer, 'should not throw exception');
  3605 </script>
  3606 <img src="image_green.png" id="green_7.png" class="resource">
  3607 <img src="image_red.png" id="red_11.png" class="resource">
  3609 <!-- [[[ test_2d.drawImage.path.html ]]] -->
  3611 <p>Canvas test: 2d.drawImage.path</p>
  3612 <canvas id="c123" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  3613 <script>
  3616 function test_2d_drawImage_path() {
  3618 var canvas = document.getElementById('c123');
  3619 var ctx = canvas.getContext('2d');
  3621 ctx.fillStyle = '#0f0';
  3622 ctx.rect(0, 0, 100, 50);
  3623 ctx.drawImage(document.getElementById('red_12.png'), 0, 0);
  3624 ctx.fill();
  3625 isPixel(ctx, 50,25, 0,255,0,255, 2);
  3629 </script>
  3630 <img src="image_red.png" id="red_12.png" class="resource">
  3632 <!-- [[[ test_2d.drawImage.self.1.html ]]] -->
  3634 <p>Canvas test: 2d.drawImage.self.1 - bug 433235</p>
  3635 <canvas id="c124" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  3636 <script>
  3639 function test_2d_drawImage_self_1() {
  3641 var canvas = document.getElementById('c124');
  3642 var ctx = canvas.getContext('2d');
  3644 ctx.fillStyle = '#0f0';
  3645 ctx.fillRect(0, 0, 50, 50);
  3646 ctx.fillStyle = '#f00';
  3647 ctx.fillRect(50, 0, 50, 50);
  3648 ctx.drawImage(canvas, 50, 0);
  3650 isPixel(ctx, 0,0, 0,255,0,255, 2);
  3651 isPixel(ctx, 99,0, 0,255,0,255, 2);
  3652 isPixel(ctx, 0,49, 0,255,0,255, 2);
  3653 isPixel(ctx, 99,49, 0,255,0,255, 2);
  3657 </script>
  3659 <!-- [[[ test_2d.drawImage.self.2.html ]]] -->
  3661 <p>Canvas test: 2d.drawImage.self.2 - bug 433235</p>
  3662 <canvas id="c125" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  3663 <script>
  3666 function test_2d_drawImage_self_2() {
  3668 var canvas = document.getElementById('c125');
  3669 var ctx = canvas.getContext('2d');
  3671 ctx.fillStyle = '#0f0';
  3672 ctx.fillRect(0, 1, 100, 49);
  3673 ctx.fillStyle = '#f00';
  3674 ctx.fillRect(0, 0, 100, 1);
  3675 ctx.drawImage(canvas, 0, 1);
  3676 ctx.fillStyle = '#0f0';
  3677 ctx.fillRect(0, 0, 100, 2);
  3679 isPixel(ctx, 0,0, 0,255,0,255, 2);
  3680 isPixel(ctx, 99,0, 0,255,0,255, 2);
  3681 isPixel(ctx, 0,49, 0,255,0,255, 2);
  3682 isPixel(ctx, 99,49, 0,255,0,255, 2);
  3686 </script>
  3688 <!-- [[[ test_2d.drawImage.transform.html ]]] -->
  3690 <p>Canvas test: 2d.drawImage.transform</p>
  3691 <canvas id="c126" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  3692 <script>
  3695 function test_2d_drawImage_transform() {
  3697 var canvas = document.getElementById('c126');
  3698 var ctx = canvas.getContext('2d');
  3700 ctx.fillStyle = '#0f0';
  3701 ctx.fillRect(0, 0, 100, 50);
  3702 ctx.translate(100, 0);
  3703 ctx.drawImage(document.getElementById('red_13.png'), 0, 0);
  3704 isPixel(ctx, 50,25, 0,255,0,255, 2);
  3708 </script>
  3709 <img src="image_red.png" id="red_13.png" class="resource">
  3711 <!-- [[[ test_2d.drawImage.wrongtype.html ]]] -->
  3713 <p>Canvas test: 2d.drawImage.wrongtype</p>
  3714 <canvas id="c127" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  3715 <script>
  3717 function test_2d_drawImage_wrongtype() {
  3719 var canvas = document.getElementById('c127');
  3720 var ctx = canvas.getContext('2d');
  3722 var _thrown = undefined; try {
  3723   ctx.drawImage(undefined, 0, 0);
  3724 } catch (e) { _thrown = e }; 
  3725 ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
  3727 var _thrown = undefined; try {
  3728   ctx.drawImage(0, 0, 0);
  3729 } catch (e) { _thrown = e };
  3730 ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
  3732 var _thrown = undefined; try {
  3733   ctx.drawImage("", 0, 0);
  3734 } catch (e) { _thrown = e };
  3735 ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
  3737 var _thrown = undefined; try {
  3738   ctx.drawImage(document.createElement('p'), 0, 0);
  3739 } catch (e) { _thrown = e };
  3740 ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
  3743 </script>
  3745 <!-- [[[ test_2d.drawImage.zerosource.html ]]] -->
  3747 <p>Canvas test: 2d.drawImage.zerosource</p>
  3748 <!-- Testing: drawImage with zero-sized source rectangle throws INDEX_SIZE_ERR -->
  3749 <canvas id="c128" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  3750 <script>
  3753 function test_2d_drawImage_zerosource() {
  3755 var canvas = document.getElementById('c128');
  3756 var ctx = canvas.getContext('2d');
  3758 ctx.fillStyle = '#0f0';
  3759 ctx.fillRect(0, 0, 100, 50);
  3760 var _thrown = undefined; try {
  3761   ctx.drawImage(document.getElementById('red_14.png'), 10, 10, 0, 1, 0, 0, 100, 50);
  3762 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
  3763 var _thrown = undefined; try {
  3764   ctx.drawImage(document.getElementById('red_14.png'), 10, 10, 1, 0, 0, 0, 100, 50);
  3765 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
  3766 var _thrown = undefined; try {
  3767   ctx.drawImage(document.getElementById('red_14.png'), 10, 10, 0, 0, 0, 0, 100, 50);
  3768 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
  3769 isPixel(ctx, 50,25, 0,255,0,255, 2);
  3773 </script>
  3774 <img src="image_red.png" id="red_14.png" class="resource">
  3776 <!-- [[[ test_2d.fillRect.basic.html ]]] -->
  3778 <p>Canvas test: 2d.fillRect.basic</p>
  3779 <canvas id="c129" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
  3780 <script>
  3783 function test_2d_fillRect_basic() {
  3785 var canvas = document.getElementById('c129');
  3786 var ctx = canvas.getContext('2d');
  3788 ctx.fillStyle = '#0f0';
  3789 ctx.fillRect(0, 0, 100, 50);
  3790 isPixel(ctx, 50,25, 0,255,0,255, 0);
  3794 </script>
  3796 <!-- [[[ test_2d.fillRect.clip.html ]]] -->
  3798 <p>Canvas test: 2d.fillRect.clip</p>
  3799 <canvas id="c130" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  3800 <script>
  3803 function test_2d_fillRect_clip() {
  3805 var canvas = document.getElementById('c130');
  3806 var ctx = canvas.getContext('2d');
  3808 ctx.fillStyle = '#0f0';
  3809 ctx.fillRect(0, 0, 100, 50);
  3811 ctx.beginPath();
  3812 ctx.rect(0, 0, 16, 16);
  3813 ctx.clip();
  3815 ctx.fillStyle = '#f00';
  3816 ctx.fillRect(0, 0, 100, 50);
  3818 ctx.fillStyle = '#0f0';
  3819 ctx.fillRect(0, 0, 16, 16);
  3821 isPixel(ctx, 50,25, 0,255,0,255, 0);
  3825 </script>
  3827 <!-- [[[ test_2d.fillRect.negative.html ]]] -->
  3829 <p>Canvas test: 2d.fillRect.negative</p>
  3830 <canvas id="c131" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  3831 <script>
  3834 function test_2d_fillRect_negative() {
  3836 var canvas = document.getElementById('c131');
  3837 var ctx = canvas.getContext('2d');
  3839 ctx.fillStyle = '#f00';
  3840 ctx.fillRect(0, 0, 100, 50);
  3841 ctx.fillStyle = '#0f0';
  3842 ctx.fillRect(0, 0, 50, 25);
  3843 ctx.fillRect(100, 0, -50, 25);
  3844 ctx.fillRect(0, 50, 50, -25);
  3845 ctx.fillRect(100, 50, -50, -25);
  3846 isPixel(ctx, 25,12, 0,255,0,255, 0);
  3847 isPixel(ctx, 75,12, 0,255,0,255, 0);
  3848 isPixel(ctx, 25,37, 0,255,0,255, 0);
  3849 isPixel(ctx, 75,37, 0,255,0,255, 0);
  3853 </script>
  3855 <!-- [[[ test_2d.fillRect.nonfinite.html ]]] -->
  3857 <p>Canvas test: 2d.fillRect.nonfinite</p>
  3858 <!-- Testing: fillRect() with Infinity/NaN is ignored -->
  3859 <canvas id="c132" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  3860 <script>
  3863 function test_2d_fillRect_nonfinite() {
  3865 var canvas = document.getElementById('c132');
  3866 var ctx = canvas.getContext('2d');
  3868 var _thrown_outer = false;
  3869 try {
  3871 ctx.fillStyle = '#0f0';
  3872 ctx.fillRect(0, 0, 100, 50);
  3874 ctx.fillStyle = '#f00';
  3875 ctx.fillRect(Infinity, 0, 100, 50);
  3876 ctx.fillRect(-Infinity, 0, 100, 50);
  3877 ctx.fillRect(NaN, 0, 100, 50);
  3878 ctx.fillRect(0, Infinity, 100, 50);
  3879 ctx.fillRect(0, -Infinity, 100, 50);
  3880 ctx.fillRect(0, NaN, 100, 50);
  3881 ctx.fillRect(0, 0, Infinity, 50);
  3882 ctx.fillRect(0, 0, -Infinity, 50);
  3883 ctx.fillRect(0, 0, NaN, 50);
  3884 ctx.fillRect(0, 0, 100, Infinity);
  3885 ctx.fillRect(0, 0, 100, -Infinity);
  3886 ctx.fillRect(0, 0, 100, NaN);
  3887 ctx.fillRect(Infinity, Infinity, 100, 50);
  3888 ctx.fillRect(Infinity, Infinity, Infinity, 50);
  3889 ctx.fillRect(Infinity, Infinity, Infinity, Infinity);
  3890 ctx.fillRect(Infinity, Infinity, 100, Infinity);
  3891 ctx.fillRect(Infinity, 0, Infinity, 50);
  3892 ctx.fillRect(Infinity, 0, Infinity, Infinity);
  3893 ctx.fillRect(Infinity, 0, 100, Infinity);
  3894 ctx.fillRect(0, Infinity, Infinity, 50);
  3895 ctx.fillRect(0, Infinity, Infinity, Infinity);
  3896 ctx.fillRect(0, Infinity, 100, Infinity);
  3897 ctx.fillRect(0, 0, Infinity, Infinity);
  3899 isPixel(ctx, 50,25, 0,255,0,255, 0);
  3901 } catch (e) {
  3902     _thrown_outer = true;
  3904 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
  3908 </script>
  3910 <!-- [[[ test_2d.fillRect.path.html ]]] -->
  3912 <p>Canvas test: 2d.fillRect.path</p>
  3913 <canvas id="c133" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
  3914 <script>
  3917 function test_2d_fillRect_path() {
  3919 var canvas = document.getElementById('c133');
  3920 var ctx = canvas.getContext('2d');
  3922 ctx.beginPath();
  3923 ctx.rect(0, 0, 100, 50);
  3924 ctx.fillStyle = '#f00';
  3925 ctx.fillRect(0, 0, 16, 16);
  3926 ctx.fillStyle = '#0f0';
  3927 ctx.fill();
  3928 isPixel(ctx, 50,25, 0,255,0,255, 0);
  3932 </script>
  3934 <!-- [[[ test_2d.fillRect.shadow.html ]]] -->
  3936 <p>Canvas test: 2d.fillRect.shadow</p>
  3937 <canvas id="c134" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  3938 <script>
  3941 function test_2d_fillRect_shadow() {
  3943 var canvas = document.getElementById('c134');
  3944 var ctx = canvas.getContext('2d');
  3946 ctx.fillStyle = '#0f0';
  3947 ctx.fillRect(0, 0, 100, 50);
  3949 ctx.fillStyle = '#f00';
  3950 ctx.shadowBlur = 0;
  3951 ctx.shadowOffsetX = 0;
  3952 ctx.shadowOffsetY = 50;
  3954 // Shadows are optional, so just test that if they apply to fill() then they apply to fillRect() too
  3955 ctx.beginPath();
  3956 ctx.rect(0, -50, 100, 50);
  3957 ctx.shadowColor = '#f00';
  3958 ctx.fill();
  3960 ctx.shadowColor = '#0f0';
  3961 ctx.fillRect(0, -50, 100, 50);
  3963 isPixel(ctx, 50,25, 0,255,0,255, 0);
  3967 </script>
  3969 <!-- [[[ test_2d.fillRect.transform.html ]]] -->
  3971 <p>Canvas test: 2d.fillRect.transform</p>
  3972 <canvas id="c135" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
  3973 <script>
  3976 function test_2d_fillRect_transform() {
  3978 var canvas = document.getElementById('c135');
  3979 var ctx = canvas.getContext('2d');
  3981 ctx.scale(10, 10);
  3982 ctx.translate(0, 5);
  3983 ctx.fillStyle = '#0f0';
  3984 ctx.fillRect(0, -5, 10, 5);
  3985 isPixel(ctx, 50,25, 0,255,0,255, 0);
  3989 </script>
  3991 <!-- [[[ test_2d.fillRect.zero.html ]]] -->
  3993 <p>Canvas test: 2d.fillRect.zero</p>
  3994 <canvas id="c136" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  3995 <script>
  3998 function test_2d_fillRect_zero() {
  4000 var canvas = document.getElementById('c136');
  4001 var ctx = canvas.getContext('2d');
  4003 ctx.fillStyle = '#0f0';
  4004 ctx.fillRect(0, 0, 100, 50);
  4005 ctx.fillStyle = '#f00';
  4006 ctx.fillRect(0, 0, 100, 0);
  4007 ctx.fillRect(0, 0, 0, 50);
  4008 ctx.fillRect(0, 0, 0, 0);
  4009 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4013 </script>
  4015 <!-- [[[ test_2d.fillStyle.default.html ]]] -->
  4017 <p>Canvas test: 2d.fillStyle.default</p>
  4018 <canvas id="c137" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4019 <script>
  4021 function test_2d_fillStyle_default() {
  4023 var canvas = document.getElementById('c137');
  4024 var ctx = canvas.getContext('2d');
  4026 ok(ctx.fillStyle == '#000000', "ctx.fillStyle == '#000000'");
  4030 </script>
  4032 <!-- [[[ test_2d.fillStyle.get.semitransparent.html ]]] -->
  4034 <p>Canvas test: 2d.fillStyle.get.semitransparent</p>
  4035 <canvas id="c138" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4036 <script>
  4038 function test_2d_fillStyle_get_semitransparent() {
  4040 var canvas = document.getElementById('c138');
  4041 var ctx = canvas.getContext('2d');
  4043 ctx.fillStyle = 'rgba(255,255,255,0.45)';
  4044 ok(/^rgba\(255, 255, 255, 0\.4\d+\)$/.test(ctx.fillStyle), "ctx.fillStyle =~ /^rgba\\(255, 255, 255, 0\\.4\\d+\\)$/");
  4048 </script>
  4050 <!-- [[[ test_2d.fillStyle.get.solid.html ]]] -->
  4052 <p>Canvas test: 2d.fillStyle.get.solid</p>
  4053 <canvas id="c139" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4054 <script>
  4056 function test_2d_fillStyle_get_solid() {
  4058 var canvas = document.getElementById('c139');
  4059 var ctx = canvas.getContext('2d');
  4061 ctx.fillStyle = '#fa0';
  4062 ok(ctx.fillStyle === '#ffaa00', "ctx.fillStyle === '#ffaa00'");
  4066 </script>
  4068 <!-- [[[ test_2d.fillStyle.get.transparent.html ]]] -->
  4070 <p>Canvas test: 2d.fillStyle.get.transparent</p>
  4071 <canvas id="c140" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4072 <script>
  4074 function test_2d_fillStyle_get_transparent() {
  4076 var canvas = document.getElementById('c140');
  4077 var ctx = canvas.getContext('2d');
  4079 ctx.fillStyle = 'rgba(0,0,0,0)';
  4080 is(ctx.fillStyle, 'rgba(0, 0, 0, 0)', "ctx.fillStyle should be what we set it to");
  4084 </script>
  4086 <!-- [[[ test_2d.fillStyle.invalidstring.html ]]] -->
  4088 <p>Canvas test: 2d.fillStyle.invalidstring</p>
  4089 <canvas id="c141" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4090 <script>
  4093 function test_2d_fillStyle_invalidstring() {
  4095 var canvas = document.getElementById('c141');
  4096 var ctx = canvas.getContext('2d');
  4098 ctx.fillStyle = '#f00';
  4099 ctx.fillRect(0, 0, 100, 50);
  4100 ctx.fillStyle = '#0f0';
  4101 ctx.fillStyle = 'invalid';
  4102 ctx.fillRect(0, 0, 100, 50);
  4103 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4107 </script>
  4109 <!-- [[[ test_2d.fillStyle.invalidtype.html ]]] -->
  4111 <p>Canvas test: 2d.fillStyle.invalidtype</p>
  4112 <canvas id="c142" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4113 <script>
  4116 function test_2d_fillStyle_invalidtype() {
  4118 var canvas = document.getElementById('c142');
  4119 var ctx = canvas.getContext('2d');
  4121 ctx.fillStyle = '#f00';
  4122 ctx.fillRect(0, 0, 100, 50);
  4123 ctx.fillStyle = '#0f0';
  4124 ctx.fillStyle = null;
  4125 ctx.fillRect(0, 0, 100, 50);
  4126 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4130 </script>
  4132 <!-- [[[ test_2d.fillStyle.parse.current.basic.html ]]] -->
  4134 <p>Canvas test: 2d.fillStyle.parse.current.basic</p>
  4135 <!-- Testing: currentColor is computed from the canvas element -->
  4136 <canvas id="c143" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4137 <script>
  4141 function test_2d_fillStyle_parse_current_basic() {
  4143 var canvas = document.getElementById('c143');
  4144 var ctx = canvas.getContext('2d');
  4146 canvas.setAttribute('style', 'color: #0f0');
  4147 ctx.fillStyle = '#f00';
  4148 ctx.fillStyle = 'currentColor';
  4149 ctx.fillRect(0, 0, 100, 50);
  4150 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4154 </script>
  4156 <!-- [[[ test_2d.fillStyle.parse.current.changed.html ]]] -->
  4158 <p>Canvas test: 2d.fillStyle.parse.current.changed</p>
  4159 <!-- Testing: currentColor is computed when the attribute is set, not when it is painted -->
  4160 <canvas id="c144" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4161 <script>
  4165 function test_2d_fillStyle_parse_current_changed() {
  4167 var canvas = document.getElementById('c144');
  4168 var ctx = canvas.getContext('2d');
  4170 canvas.setAttribute('style', 'color: #0f0');
  4171 ctx.fillStyle = '#f00';
  4172 ctx.fillStyle = 'currentColor';
  4173 canvas.setAttribute('style', 'color: #f00');
  4174 ctx.fillRect(0, 0, 100, 50);
  4175 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4179 </script>
  4181 <!-- [[[ test_2d.fillStyle.parse.current.removed.html ]]] -->
  4183 <p>Canvas test: 2d.fillStyle.parse.current.removed</p>
  4184 <!-- Testing: currentColor is solid black when the canvas element is not in a document -->
  4185 <canvas id="c145" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4186 <script>
  4190 function test_2d_fillStyle_parse_current_removed() {
  4192 var canvas = document.getElementById('c145');
  4193 var ctx = canvas.getContext('2d');
  4195 // Try not to let it undetectably incorrectly pick up opaque-black
  4196 // from other parts of the document:
  4197 document.body.parentNode.setAttribute('style', 'color: #f00');
  4198 document.body.setAttribute('style', 'color: #f00');
  4199 canvas.setAttribute('style', 'color: #f00');
  4201 var canvas2 = document.createElement('canvas');
  4202 var ctx2 = canvas2.getContext('2d');
  4203 ctx2.fillStyle = '#f00';
  4204 ctx2.fillStyle = 'currentColor';
  4205 ctx2.fillRect(0, 0, 100, 50);
  4206 ctx.drawImage(canvas2, 0, 0);
  4208 document.body.parentNode.removeAttribute('style');
  4209 document.body.removeAttribute('style');
  4211 isPixel(ctx, 50,25, 0,0,0,255, 0);
  4215 </script>
  4217 <!-- [[[ test_2d.fillStyle.parse.hex3.html ]]] -->
  4219 <p>Canvas test: 2d.fillStyle.parse.hex3</p>
  4220 <canvas id="c146" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4221 <script>
  4224 function test_2d_fillStyle_parse_hex3() {
  4226 var canvas = document.getElementById('c146');
  4227 var ctx = canvas.getContext('2d');
  4230 ctx.fillStyle = '#f00';
  4231 ctx.fillStyle = '#0f0';
  4232 ctx.fillRect(0, 0, 100, 50);
  4233 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4237 </script>
  4239 <!-- [[[ test_2d.fillStyle.parse.hex6.html ]]] -->
  4241 <p>Canvas test: 2d.fillStyle.parse.hex6</p>
  4242 <canvas id="c147" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4243 <script>
  4246 function test_2d_fillStyle_parse_hex6() {
  4248 var canvas = document.getElementById('c147');
  4249 var ctx = canvas.getContext('2d');
  4252 ctx.fillStyle = '#f00';
  4253 ctx.fillStyle = '#00fF00';
  4254 ctx.fillRect(0, 0, 100, 50);
  4255 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4259 </script>
  4261 <!-- [[[ test_2d.fillStyle.parse.hsl-1.html ]]] -->
  4263 <p>Canvas test: 2d.fillStyle.parse.hsl-1</p>
  4264 <canvas id="c148" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4265 <script>
  4268 function test_2d_fillStyle_parse_hsl_1() {
  4270 var canvas = document.getElementById('c148');
  4271 var ctx = canvas.getContext('2d');
  4274 ctx.fillStyle = '#f00';
  4275 ctx.fillStyle = 'hsl(120, 100%, 50%)';
  4276 ctx.fillRect(0, 0, 100, 50);
  4277 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4281 </script>
  4283 <!-- [[[ test_2d.fillStyle.parse.hsl-2.html ]]] -->
  4285 <p>Canvas test: 2d.fillStyle.parse.hsl-2</p>
  4286 <canvas id="c149" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4287 <script>
  4290 function test_2d_fillStyle_parse_hsl_2() {
  4292 var canvas = document.getElementById('c149');
  4293 var ctx = canvas.getContext('2d');
  4296 ctx.fillStyle = '#f00';
  4297 ctx.fillStyle = 'hsl( -240 , 100% , 50% )';
  4298 ctx.fillRect(0, 0, 100, 50);
  4299 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4303 </script>
  4305 <!-- [[[ test_2d.fillStyle.parse.hsl-3.html ]]] -->
  4307 <p>Canvas test: 2d.fillStyle.parse.hsl-3</p>
  4308 <canvas id="c150" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4309 <script>
  4312 function test_2d_fillStyle_parse_hsl_3() {
  4314 var canvas = document.getElementById('c150');
  4315 var ctx = canvas.getContext('2d');
  4318 ctx.fillStyle = '#f00';
  4319 ctx.fillStyle = 'hsl(360120, 100%, 50%)';
  4320 ctx.fillRect(0, 0, 100, 50);
  4321 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4325 </script>
  4327 <!-- [[[ test_2d.fillStyle.parse.hsl-4.html ]]] -->
  4329 <p>Canvas test: 2d.fillStyle.parse.hsl-4</p>
  4330 <canvas id="c151" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4331 <script>
  4334 function test_2d_fillStyle_parse_hsl_4() {
  4336 var canvas = document.getElementById('c151');
  4337 var ctx = canvas.getContext('2d');
  4340 ctx.fillStyle = '#f00';
  4341 ctx.fillStyle = 'hsl(-360240, 100%, 50%)';
  4342 ctx.fillRect(0, 0, 100, 50);
  4343 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4347 </script>
  4349 <!-- [[[ test_2d.fillStyle.parse.hsl-5.html ]]] -->
  4351 <p>Canvas test: 2d.fillStyle.parse.hsl-5</p>
  4352 <canvas id="c152" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4353 <script>
  4356 function test_2d_fillStyle_parse_hsl_5() {
  4358 var canvas = document.getElementById('c152');
  4359 var ctx = canvas.getContext('2d');
  4362 ctx.fillStyle = '#f00';
  4363 ctx.fillStyle = 'hsl(120.0, 100.0%, 50.0%)';
  4364 ctx.fillRect(0, 0, 100, 50);
  4365 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4369 </script>
  4371 <!-- [[[ test_2d.fillStyle.parse.hsl-clamp-1.html ]]] -->
  4373 <p>Canvas test: 2d.fillStyle.parse.hsl-clamp-1</p>
  4374 <canvas id="c153" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4375 <script>
  4378 function test_2d_fillStyle_parse_hsl_clamp_1() {
  4380 var canvas = document.getElementById('c153');
  4381 var ctx = canvas.getContext('2d');
  4384 ctx.fillStyle = '#f00';
  4385 ctx.fillStyle = 'hsl(120, 200%, 50%)';
  4386 ctx.fillRect(0, 0, 100, 50);
  4387 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4391 </script>
  4393 <!-- [[[ test_2d.fillStyle.parse.hsl-clamp-2.html ]]] -->
  4395 <p>Canvas test: 2d.fillStyle.parse.hsl-clamp-2</p>
  4396 <canvas id="c154" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4397 <script>
  4400 function test_2d_fillStyle_parse_hsl_clamp_2() {
  4402 var canvas = document.getElementById('c154');
  4403 var ctx = canvas.getContext('2d');
  4406 ctx.fillStyle = '#f00';
  4407 ctx.fillStyle = 'hsl(120, -200%, 49.9%)';
  4408 ctx.fillRect(0, 0, 100, 50);
  4409 isPixel(ctx, 50,25, 127,127,127,255, 0);
  4413 </script>
  4415 <!-- [[[ test_2d.fillStyle.parse.hsl-clamp-3.html ]]] -->
  4417 <p>Canvas test: 2d.fillStyle.parse.hsl-clamp-3</p>
  4418 <canvas id="c155" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4419 <script>
  4422 function test_2d_fillStyle_parse_hsl_clamp_3() {
  4424 var canvas = document.getElementById('c155');
  4425 var ctx = canvas.getContext('2d');
  4428 ctx.fillStyle = '#f00';
  4429 ctx.fillStyle = 'hsl(120, 100%, 200%)';
  4430 ctx.fillRect(0, 0, 100, 50);
  4431 isPixel(ctx, 50,25, 255,255,255,255, 0);
  4435 </script>
  4437 <!-- [[[ test_2d.fillStyle.parse.hsl-clamp-4.html ]]] -->
  4439 <p>Canvas test: 2d.fillStyle.parse.hsl-clamp-4</p>
  4440 <canvas id="c156" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4441 <script>
  4444 function test_2d_fillStyle_parse_hsl_clamp_4() {
  4446 var canvas = document.getElementById('c156');
  4447 var ctx = canvas.getContext('2d');
  4450 ctx.fillStyle = '#f00';
  4451 ctx.fillStyle = 'hsl(120, 100%, -200%)';
  4452 ctx.fillRect(0, 0, 100, 50);
  4453 isPixel(ctx, 50,25, 0,0,0,255, 0);
  4457 </script>
  4459 <!-- [[[ test_2d.fillStyle.parse.hsla-1.html ]]] -->
  4461 <p>Canvas test: 2d.fillStyle.parse.hsla-1</p>
  4462 <canvas id="c157" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4463 <script>
  4466 function test_2d_fillStyle_parse_hsla_1() {
  4468 var canvas = document.getElementById('c157');
  4469 var ctx = canvas.getContext('2d');
  4472 ctx.fillStyle = '#f00';
  4473 ctx.fillStyle = 'hsla(120, 100%, 50%, 0.499)';
  4474 ctx.fillRect(0, 0, 100, 50);
  4475 isPixel(ctx, 50,25, 0,255,0,127, 0);
  4479 </script>
  4481 <!-- [[[ test_2d.fillStyle.parse.hsla-2.html ]]] -->
  4483 <p>Canvas test: 2d.fillStyle.parse.hsla-2</p>
  4484 <canvas id="c158" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4485 <script>
  4488 function test_2d_fillStyle_parse_hsla_2() {
  4490 var canvas = document.getElementById('c158');
  4491 var ctx = canvas.getContext('2d');
  4494 ctx.fillStyle = '#f00';
  4495 ctx.fillStyle = 'hsla( 120.0 , 100.0% , 50.0% , 1 )';
  4496 ctx.fillRect(0, 0, 100, 50);
  4497 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4501 </script>
  4503 <!-- [[[ test_2d.fillStyle.parse.hsla-clamp-1.html ]]] -->
  4505 <p>Canvas test: 2d.fillStyle.parse.hsla-clamp-1</p>
  4506 <canvas id="c159" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4507 <script>
  4510 function test_2d_fillStyle_parse_hsla_clamp_1() {
  4512 var canvas = document.getElementById('c159');
  4513 var ctx = canvas.getContext('2d');
  4516 ctx.fillStyle = '#f00';
  4517 ctx.fillStyle = 'hsla(120, 200%, 50%, 1)';
  4518 ctx.fillRect(0, 0, 100, 50);
  4519 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4523 </script>
  4525 <!-- [[[ test_2d.fillStyle.parse.hsla-clamp-2.html ]]] -->
  4527 <p>Canvas test: 2d.fillStyle.parse.hsla-clamp-2</p>
  4528 <canvas id="c160" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4529 <script>
  4532 function test_2d_fillStyle_parse_hsla_clamp_2() {
  4534 var canvas = document.getElementById('c160');
  4535 var ctx = canvas.getContext('2d');
  4538 ctx.fillStyle = '#f00';
  4539 ctx.fillStyle = 'hsla(120, -200%, 49.9%, 1)';
  4540 ctx.fillRect(0, 0, 100, 50);
  4541 isPixel(ctx, 50,25, 127,127,127,255, 0);
  4545 </script>
  4547 <!-- [[[ test_2d.fillStyle.parse.hsla-clamp-3.html ]]] -->
  4549 <p>Canvas test: 2d.fillStyle.parse.hsla-clamp-3</p>
  4550 <canvas id="c161" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4551 <script>
  4554 function test_2d_fillStyle_parse_hsla_clamp_3() {
  4556 var canvas = document.getElementById('c161');
  4557 var ctx = canvas.getContext('2d');
  4560 ctx.fillStyle = '#f00';
  4561 ctx.fillStyle = 'hsla(120, 100%, 200%, 1)';
  4562 ctx.fillRect(0, 0, 100, 50);
  4563 isPixel(ctx, 50,25, 255,255,255,255, 0);
  4567 </script>
  4569 <!-- [[[ test_2d.fillStyle.parse.hsla-clamp-4.html ]]] -->
  4571 <p>Canvas test: 2d.fillStyle.parse.hsla-clamp-4</p>
  4572 <canvas id="c162" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4573 <script>
  4576 function test_2d_fillStyle_parse_hsla_clamp_4() {
  4578 var canvas = document.getElementById('c162');
  4579 var ctx = canvas.getContext('2d');
  4582 ctx.fillStyle = '#f00';
  4583 ctx.fillStyle = 'hsla(120, 100%, -200%, 1)';
  4584 ctx.fillRect(0, 0, 100, 50);
  4585 isPixel(ctx, 50,25, 0,0,0,255, 0);
  4589 </script>
  4591 <!-- [[[ test_2d.fillStyle.parse.hsla-clamp-5.html ]]] -->
  4593 <p>Canvas test: 2d.fillStyle.parse.hsla-clamp-5</p>
  4594 <canvas id="c163" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4595 <script>
  4598 function test_2d_fillStyle_parse_hsla_clamp_5() {
  4600 var canvas = document.getElementById('c163');
  4601 var ctx = canvas.getContext('2d');
  4604 ctx.fillStyle = '#f00';
  4605 ctx.fillStyle = 'hsla(120, 100%, 50%, 2)';
  4606 ctx.fillRect(0, 0, 100, 50);
  4607 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4611 </script>
  4613 <!-- [[[ test_2d.fillStyle.parse.hsla-clamp-6.html ]]] -->
  4615 <p>Canvas test: 2d.fillStyle.parse.hsla-clamp-6</p>
  4616 <canvas id="c164" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4617 <script>
  4620 function test_2d_fillStyle_parse_hsla_clamp_6() {
  4622 var canvas = document.getElementById('c164');
  4623 var ctx = canvas.getContext('2d');
  4626 ctx.fillStyle = '#f00';
  4627 ctx.fillStyle = 'hsla(120, 100%, 0%, -2)';
  4628 ctx.fillRect(0, 0, 100, 50);
  4629 isPixel(ctx, 50,25, 0,0,0,0, 0);
  4633 </script>
  4635 <!-- [[[ test_2d.fillStyle.parse.html4.html ]]] -->
  4637 <p>Canvas test: 2d.fillStyle.parse.html4</p>
  4638 <canvas id="c165" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4639 <script>
  4642 function test_2d_fillStyle_parse_html4() {
  4644 var canvas = document.getElementById('c165');
  4645 var ctx = canvas.getContext('2d');
  4648 ctx.fillStyle = '#f00';
  4649 ctx.fillStyle = 'limE';
  4650 ctx.fillRect(0, 0, 100, 50);
  4651 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4655 </script>
  4657 <!-- [[[ test_2d.fillStyle.parse.invalid.hex3.html ]]] -->
  4659 <p>Canvas test: 2d.fillStyle.parse.invalid.hex3</p>
  4660 <canvas id="c166" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4661 <script>
  4664 function test_2d_fillStyle_parse_invalid_hex3() {
  4666 var canvas = document.getElementById('c166');
  4667 var ctx = canvas.getContext('2d');
  4670 ctx.fillStyle = '#0f0';
  4671 try { ctx.fillStyle = '#g00'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
  4672 ctx.fillRect(0, 0, 100, 50);
  4673 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4677 </script>
  4679 <!-- [[[ test_2d.fillStyle.parse.invalid.hex6.html ]]] -->
  4681 <p>Canvas test: 2d.fillStyle.parse.invalid.hex6</p>
  4682 <canvas id="c167" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4683 <script>
  4686 function test_2d_fillStyle_parse_invalid_hex6() {
  4688 var canvas = document.getElementById('c167');
  4689 var ctx = canvas.getContext('2d');
  4692 ctx.fillStyle = '#0f0';
  4693 try { ctx.fillStyle = '#fg0000'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
  4694 ctx.fillRect(0, 0, 100, 50);
  4695 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4699 </script>
  4701 <!-- [[[ test_2d.fillStyle.parse.invalid.hsl-1.html ]]] -->
  4703 <p>Canvas test: 2d.fillStyle.parse.invalid.hsl-1</p>
  4704 <canvas id="c168" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4705 <script>
  4708 function test_2d_fillStyle_parse_invalid_hsl_1() {
  4710 var canvas = document.getElementById('c168');
  4711 var ctx = canvas.getContext('2d');
  4714 ctx.fillStyle = '#0f0';
  4715 try { ctx.fillStyle = 'hsl(0%, 100%, 50%)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
  4716 ctx.fillRect(0, 0, 100, 50);
  4717 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4721 </script>
  4723 <!-- [[[ test_2d.fillStyle.parse.invalid.hsl-2.html ]]] -->
  4725 <p>Canvas test: 2d.fillStyle.parse.invalid.hsl-2</p>
  4726 <canvas id="c169" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4727 <script>
  4730 function test_2d_fillStyle_parse_invalid_hsl_2() {
  4732 var canvas = document.getElementById('c169');
  4733 var ctx = canvas.getContext('2d');
  4736 ctx.fillStyle = '#0f0';
  4737 try { ctx.fillStyle = 'hsl(z, 100%, 50%)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
  4738 ctx.fillRect(0, 0, 100, 50);
  4739 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4743 </script>
  4745 <!-- [[[ test_2d.fillStyle.parse.invalid.hsl-3.html ]]] -->
  4747 <p>Canvas test: 2d.fillStyle.parse.invalid.hsl-3</p>
  4748 <canvas id="c170" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4749 <script>
  4752 function test_2d_fillStyle_parse_invalid_hsl_3() {
  4754 var canvas = document.getElementById('c170');
  4755 var ctx = canvas.getContext('2d');
  4758 ctx.fillStyle = '#0f0';
  4759 try { ctx.fillStyle = 'hsl(0, 0, 50%)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
  4760 ctx.fillRect(0, 0, 100, 50);
  4761 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4765 </script>
  4767 <!-- [[[ test_2d.fillStyle.parse.invalid.hsl-4.html ]]] -->
  4769 <p>Canvas test: 2d.fillStyle.parse.invalid.hsl-4</p>
  4770 <canvas id="c171" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4771 <script>
  4774 function test_2d_fillStyle_parse_invalid_hsl_4() {
  4776 var canvas = document.getElementById('c171');
  4777 var ctx = canvas.getContext('2d');
  4780 ctx.fillStyle = '#0f0';
  4781 try { ctx.fillStyle = 'hsl(0, 100%, 0)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
  4782 ctx.fillRect(0, 0, 100, 50);
  4783 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4787 </script>
  4789 <!-- [[[ test_2d.fillStyle.parse.invalid.hsl-5.html ]]] -->
  4791 <p>Canvas test: 2d.fillStyle.parse.invalid.hsl-5</p>
  4792 <canvas id="c172" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4793 <script>
  4796 function test_2d_fillStyle_parse_invalid_hsl_5() {
  4798 var canvas = document.getElementById('c172');
  4799 var ctx = canvas.getContext('2d');
  4802 ctx.fillStyle = '#0f0';
  4803 try { ctx.fillStyle = 'hsl(0, 100%, 100%, 1)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
  4804 ctx.fillRect(0, 0, 100, 50);
  4805 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4809 </script>
  4811 <!-- [[[ test_2d.fillStyle.parse.invalid.hsla-1.html ]]] -->
  4813 <p>Canvas test: 2d.fillStyle.parse.invalid.hsla-1</p>
  4814 <canvas id="c173" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4815 <script>
  4818 function test_2d_fillStyle_parse_invalid_hsla_1() {
  4820 var canvas = document.getElementById('c173');
  4821 var ctx = canvas.getContext('2d');
  4824 ctx.fillStyle = '#0f0';
  4825 try { ctx.fillStyle = 'hsla(0%, 100%, 50%, 1)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
  4826 ctx.fillRect(0, 0, 100, 50);
  4827 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4831 </script>
  4833 <!-- [[[ test_2d.fillStyle.parse.invalid.hsla-2.html ]]] -->
  4835 <p>Canvas test: 2d.fillStyle.parse.invalid.hsla-2</p>
  4836 <canvas id="c174" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4837 <script>
  4840 function test_2d_fillStyle_parse_invalid_hsla_2() {
  4842 var canvas = document.getElementById('c174');
  4843 var ctx = canvas.getContext('2d');
  4846 ctx.fillStyle = '#0f0';
  4847 try { ctx.fillStyle = 'hsla(0, 0, 50%, 1)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
  4848 ctx.fillRect(0, 0, 100, 50);
  4849 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4853 </script>
  4855 <!-- [[[ test_2d.fillStyle.parse.invalid.name-1.html ]]] -->
  4857 <p>Canvas test: 2d.fillStyle.parse.invalid.name-1</p>
  4858 <canvas id="c174a" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4859 <script>
  4862 function test_2d_fillStyle_parse_invalid_name_1() {
  4864 var canvas = document.getElementById('c174a');
  4865 var ctx = canvas.getContext('2d');
  4867 ctx.fillStyle = '#0f0';
  4868 try { ctx.fillStyle = 'darkbrown'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
  4869 ctx.fillRect(0, 0, 100, 50);
  4870 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4874 </script>
  4876 <!-- [[[ test_2d.fillStyle.parse.invalid.name-2.html ]]] -->
  4878 <p>Canvas test: 2d.fillStyle.parse.invalid.name-2</p>
  4879 <canvas id="c174b" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4880 <script>
  4883 function test_2d_fillStyle_parse_invalid_name_2() {
  4885 var canvas = document.getElementById('c174b');
  4886 var ctx = canvas.getContext('2d');
  4888 ctx.fillStyle = '#0f0';
  4889 try { ctx.fillStyle = 'firebrick1'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
  4890 ctx.fillRect(0, 0, 100, 50);
  4891 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4895 </script>
  4897 <!-- [[[ test_2d.fillStyle.parse.invalid.name-3.html ]]] -->
  4899 <p>Canvas test: 2d.fillStyle.parse.invalid.name-3</p>
  4900 <canvas id="c174c" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4901 <script>
  4904 function test_2d_fillStyle_parse_invalid_name_3() {
  4906 var canvas = document.getElementById('c174c');
  4907 var ctx = canvas.getContext('2d');
  4909 ctx.fillStyle = '#0f0';
  4910 try { ctx.fillStyle = 'red blue'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
  4911 ctx.fillRect(0, 0, 100, 50);
  4912 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4916 </script>
  4918 <!-- [[[ test_2d.fillStyle.parse.invalid.rgb-1.html ]]] -->
  4920 <p>Canvas test: 2d.fillStyle.parse.invalid.rgb-1</p>
  4921 <canvas id="c175" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4922 <script>
  4925 function test_2d_fillStyle_parse_invalid_rgb_1() {
  4927 var canvas = document.getElementById('c175');
  4928 var ctx = canvas.getContext('2d');
  4931 ctx.fillStyle = '#0f0';
  4932 try { ctx.fillStyle = 'rgb(255.0, 0, 0)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
  4933 ctx.fillRect(0, 0, 100, 50);
  4934 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4938 </script>
  4940 <!-- [[[ test_2d.fillStyle.parse.invalid.rgb-2.html ]]] -->
  4942 <p>Canvas test: 2d.fillStyle.parse.invalid.rgb-2</p>
  4943 <canvas id="c176" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4944 <script>
  4947 function test_2d_fillStyle_parse_invalid_rgb_2() {
  4949 var canvas = document.getElementById('c176');
  4950 var ctx = canvas.getContext('2d');
  4953 ctx.fillStyle = '#0f0';
  4954 try { ctx.fillStyle = 'rgb(255, 0.0, 0)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
  4955 ctx.fillRect(0, 0, 100, 50);
  4956 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4960 </script>
  4962 <!-- [[[ test_2d.fillStyle.parse.invalid.rgb-3.html ]]] -->
  4964 <p>Canvas test: 2d.fillStyle.parse.invalid.rgb-3</p>
  4965 <canvas id="c177" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4966 <script>
  4969 function test_2d_fillStyle_parse_invalid_rgb_3() {
  4971 var canvas = document.getElementById('c177');
  4972 var ctx = canvas.getContext('2d');
  4975 ctx.fillStyle = '#0f0';
  4976 try { ctx.fillStyle = 'rgb(255.0, 0, 0,)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
  4977 ctx.fillRect(0, 0, 100, 50);
  4978 isPixel(ctx, 50,25, 0,255,0,255, 0);
  4982 </script>
  4984 <!-- [[[ test_2d.fillStyle.parse.invalid.rgb-4.html ]]] -->
  4986 <p>Canvas test: 2d.fillStyle.parse.invalid.rgb-4</p>
  4987 <canvas id="c178" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  4988 <script>
  4991 function test_2d_fillStyle_parse_invalid_rgb_4() {
  4993 var canvas = document.getElementById('c178');
  4994 var ctx = canvas.getContext('2d');
  4997 ctx.fillStyle = '#0f0';
  4998 try { ctx.fillStyle = 'rgb(100%, 0, 0)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
  4999 ctx.fillRect(0, 0, 100, 50);
  5000 isPixel(ctx, 50,25, 0,255,0,255, 0);
  5004 </script>
  5006 <!-- [[[ test_2d.fillStyle.parse.invalid.rgb-5.html ]]] -->
  5008 <p>Canvas test: 2d.fillStyle.parse.invalid.rgb-5</p>
  5009 <canvas id="c179" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5010 <script>
  5013 function test_2d_fillStyle_parse_invalid_rgb_5() {
  5015 var canvas = document.getElementById('c179');
  5016 var ctx = canvas.getContext('2d');
  5019 ctx.fillStyle = '#0f0';
  5020 try { ctx.fillStyle = 'rgb(255 0 0)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
  5021 ctx.fillRect(0, 0, 100, 50);
  5022 isPixel(ctx, 50,25, 0,255,0,255, 0);
  5026 </script>
  5028 <!-- [[[ test_2d.fillStyle.parse.invalid.rgb-6.html ]]] -->
  5030 <p>Canvas test: 2d.fillStyle.parse.invalid.rgb-6</p>
  5031 <canvas id="c180" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5032 <script>
  5035 function test_2d_fillStyle_parse_invalid_rgb_6() {
  5037 var canvas = document.getElementById('c180');
  5038 var ctx = canvas.getContext('2d');
  5041 ctx.fillStyle = '#0f0';
  5042 try { ctx.fillStyle = 'rgb(255, - 1, 0)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
  5043 ctx.fillRect(0, 0, 100, 50);
  5044 isPixel(ctx, 50,25, 0,255,0,255, 0);
  5048 </script>
  5050 <!-- [[[ test_2d.fillStyle.parse.invalid.rgb-7.html ]]] -->
  5052 <p>Canvas test: 2d.fillStyle.parse.invalid.rgb-7</p>
  5053 <canvas id="c181" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5054 <script>
  5057 function test_2d_fillStyle_parse_invalid_rgb_7() {
  5059 var canvas = document.getElementById('c181');
  5060 var ctx = canvas.getContext('2d');
  5063 ctx.fillStyle = '#0f0';
  5064 try { ctx.fillStyle = 'rgb(255, 0, 0, 1)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
  5065 ctx.fillRect(0, 0, 100, 50);
  5066 isPixel(ctx, 50,25, 0,255,0,255, 0);
  5070 </script>
  5072 <!-- [[[ test_2d.fillStyle.parse.invalid.rgba-1.html ]]] -->
  5074 <p>Canvas test: 2d.fillStyle.parse.invalid.rgba-1</p>
  5075 <canvas id="c182" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5076 <script>
  5079 function test_2d_fillStyle_parse_invalid_rgba_1() {
  5081 var canvas = document.getElementById('c182');
  5082 var ctx = canvas.getContext('2d');
  5085 ctx.fillStyle = '#0f0';
  5086 try { ctx.fillStyle = 'rgba(255, 0, 0)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
  5087 ctx.fillRect(0, 0, 100, 50);
  5088 isPixel(ctx, 50,25, 0,255,0,255, 0);
  5092 </script>
  5094 <!-- [[[ test_2d.fillStyle.parse.invalid.rgba-2.html ]]] -->
  5096 <p>Canvas test: 2d.fillStyle.parse.invalid.rgba-2</p>
  5097 <canvas id="c183" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5098 <script>
  5101 function test_2d_fillStyle_parse_invalid_rgba_2() {
  5103 var canvas = document.getElementById('c183');
  5104 var ctx = canvas.getContext('2d');
  5107 ctx.fillStyle = '#0f0';
  5108 try { ctx.fillStyle = 'rgba(255.0, 0, 0, 1)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
  5109 ctx.fillRect(0, 0, 100, 50);
  5110 isPixel(ctx, 50,25, 0,255,0,255, 0);
  5114 </script>
  5116 <!-- [[[ test_2d.fillStyle.parse.invalid.rgba-3.html ]]] -->
  5118 <p>Canvas test: 2d.fillStyle.parse.invalid.rgba-3</p>
  5119 <canvas id="c184" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5120 <script>
  5123 function test_2d_fillStyle_parse_invalid_rgba_3() {
  5125 var canvas = document.getElementById('c184');
  5126 var ctx = canvas.getContext('2d');
  5129 ctx.fillStyle = '#0f0';
  5130 try { ctx.fillStyle = 'rgba(100%, 0, 0, 1)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
  5131 ctx.fillRect(0, 0, 100, 50);
  5132 isPixel(ctx, 50,25, 0,255,0,255, 0);
  5136 </script>
  5138 <!-- [[[ test_2d.fillStyle.parse.invalid.rgba-4.html ]]] -->
  5140 <p>Canvas test: 2d.fillStyle.parse.invalid.rgba-4</p>
  5141 <canvas id="c185" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5142 <script>
  5145 function test_2d_fillStyle_parse_invalid_rgba_4() {
  5147 var canvas = document.getElementById('c185');
  5148 var ctx = canvas.getContext('2d');
  5151 ctx.fillStyle = '#0f0';
  5152 try { ctx.fillStyle = 'rgba(255, 0, 0, 100%)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
  5153 ctx.fillRect(0, 0, 100, 50);
  5154 isPixel(ctx, 50,25, 0,255,0,255, 0);
  5158 </script>
  5160 <!-- [[[ test_2d.fillStyle.parse.invalid.rgba-5.html ]]] -->
  5162 <p>Canvas test: 2d.fillStyle.parse.invalid.rgba-5</p>
  5163 <canvas id="c186" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5164 <script>
  5167 function test_2d_fillStyle_parse_invalid_rgba_5() {
  5169 var canvas = document.getElementById('c186');
  5170 var ctx = canvas.getContext('2d');
  5173 ctx.fillStyle = '#0f0';
  5174 try { ctx.fillStyle = 'rgba(255, 0, 0, 1. 0)'; } catch (e) { } // this shouldn't throw, but it shouldn't matter here if it does
  5175 ctx.fillRect(0, 0, 100, 50);
  5176 isPixel(ctx, 50,25, 0,255,0,255, 0);
  5180 </script>
  5182 <!-- [[[ test_2d.fillStyle.parse.rgb-clamp-1.html ]]] -->
  5184 <p>Canvas test: 2d.fillStyle.parse.rgb-clamp-1</p>
  5185 <canvas id="c187" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5186 <script>
  5189 function test_2d_fillStyle_parse_rgb_clamp_1() {
  5191 var canvas = document.getElementById('c187');
  5192 var ctx = canvas.getContext('2d');
  5195 ctx.fillStyle = '#f00';
  5196 ctx.fillStyle = 'rgb(-1000, 1000, -1000)';
  5197 ctx.fillRect(0, 0, 100, 50);
  5198 isPixel(ctx, 50,25, 0,255,0,255, 0);
  5202 </script>
  5204 <!-- [[[ test_2d.fillStyle.parse.rgb-clamp-2.html ]]] -->
  5206 <p>Canvas test: 2d.fillStyle.parse.rgb-clamp-2</p>
  5207 <canvas id="c188" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5208 <script>
  5211 function test_2d_fillStyle_parse_rgb_clamp_2() {
  5213 var canvas = document.getElementById('c188');
  5214 var ctx = canvas.getContext('2d');
  5217 ctx.fillStyle = '#f00';
  5218 ctx.fillStyle = 'rgb(-200%, 200%, -200%)';
  5219 ctx.fillRect(0, 0, 100, 50);
  5220 isPixel(ctx, 50,25, 0,255,0,255, 0);
  5224 </script>
  5226 <!-- [[[ test_2d.fillStyle.parse.rgb-clamp-3.html ]]] -->
  5228 <p>Canvas test: 2d.fillStyle.parse.rgb-clamp-3</p>
  5229 <canvas id="c189" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5230 <script>
  5233 function test_2d_fillStyle_parse_rgb_clamp_3() {
  5235 var canvas = document.getElementById('c189');
  5236 var ctx = canvas.getContext('2d');
  5239 ctx.fillStyle = '#f00';
  5240 ctx.fillStyle = 'rgb(-2147483649, 4294967298, -18446744073709551619)';
  5241 ctx.fillRect(0, 0, 100, 50);
  5242 isPixel(ctx, 50,25, 0,255,0,255, 0);
  5246 </script>
  5248 <!-- [[[ test_2d.fillStyle.parse.rgb-clamp-4.html ]]] -->
  5250 <p>Canvas test: 2d.fillStyle.parse.rgb-clamp-4</p>
  5251 <canvas id="c190" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5252 <script>
  5255 function test_2d_fillStyle_parse_rgb_clamp_4() {
  5257 var canvas = document.getElementById('c190');
  5258 var ctx = canvas.getContext('2d');
  5261 ctx.fillStyle = '#f00';
  5262 ctx.fillStyle = 'rgb(-1000000000000000000000000000000000000000, 1000000000000000000000000000000000000000, -1000000000000000000000000000000000000000)';
  5263 ctx.fillRect(0, 0, 100, 50);
  5264 isPixel(ctx, 50,25, 0,255,0,255, 0);
  5268 </script>
  5270 <!-- [[[ test_2d.fillStyle.parse.rgb-clamp-5.html ]]] -->
  5272 <p>Canvas test: 2d.fillStyle.parse.rgb-clamp-5</p>
  5273 <canvas id="c191" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5274 <script>
  5277 function test_2d_fillStyle_parse_rgb_clamp_5() {
  5279 var canvas = document.getElementById('c191');
  5280 var ctx = canvas.getContext('2d');
  5283 ctx.fillStyle = '#f00';
  5284 ctx.fillStyle = 'rgb(-10000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000, 10000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000, -10000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000)';
  5285 ctx.fillRect(0, 0, 100, 50);
  5286 isPixel(ctx, 50,25, 0,255,0,255, 0);
  5290 </script>
  5292 <!-- [[[ test_2d.fillStyle.parse.rgb-num.html ]]] -->
  5294 <p>Canvas test: 2d.fillStyle.parse.rgb-num</p>
  5295 <canvas id="c192" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5296 <script>
  5299 function test_2d_fillStyle_parse_rgb_num() {
  5301 var canvas = document.getElementById('c192');
  5302 var ctx = canvas.getContext('2d');
  5305 ctx.fillStyle = '#f00';
  5306 ctx.fillStyle = 'rgb(0,255,0)';
  5307 ctx.fillRect(0, 0, 100, 50);
  5308 isPixel(ctx, 50,25, 0,255,0,255, 0);
  5312 </script>
  5314 <!-- [[[ test_2d.fillStyle.parse.rgb-percent.html ]]] -->
  5316 <p>Canvas test: 2d.fillStyle.parse.rgb-percent</p>
  5317 <canvas id="c193" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5318 <script>
  5321 function test_2d_fillStyle_parse_rgb_percent() {
  5323 var canvas = document.getElementById('c193');
  5324 var ctx = canvas.getContext('2d');
  5327 ctx.fillStyle = '#f00';
  5328 ctx.fillStyle = 'rgb(0% ,100% ,0%)';
  5329 ctx.fillRect(0, 0, 100, 50);
  5330 isPixel(ctx, 50,25, 0,255,0,255, 0);
  5334 </script>
  5336 <!-- [[[ test_2d.fillStyle.parse.rgba-clamp-1.html ]]] -->
  5338 <p>Canvas test: 2d.fillStyle.parse.rgba-clamp-1</p>
  5339 <canvas id="c194" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5340 <script>
  5343 function test_2d_fillStyle_parse_rgba_clamp_1() {
  5345 var canvas = document.getElementById('c194');
  5346 var ctx = canvas.getContext('2d');
  5349 ctx.fillStyle = '#f00';
  5350 ctx.fillStyle = 'rgba(0, 255, 0, -2)';
  5351 ctx.fillRect(0, 0, 100, 50);
  5352 isPixel(ctx, 50,25, 0,0,0,0, 0);
  5356 </script>
  5358 <!-- [[[ test_2d.fillStyle.parse.rgba-clamp-2.html ]]] -->
  5360 <p>Canvas test: 2d.fillStyle.parse.rgba-clamp-2</p>
  5361 <canvas id="c195" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5362 <script>
  5365 function test_2d_fillStyle_parse_rgba_clamp_2() {
  5367 var canvas = document.getElementById('c195');
  5368 var ctx = canvas.getContext('2d');
  5371 ctx.fillStyle = '#f00';
  5372 ctx.fillStyle = 'rgba(0, 255, 0, 2)';
  5373 ctx.fillRect(0, 0, 100, 50);
  5374 isPixel(ctx, 50,25, 0,255,0,255, 0);
  5378 </script>
  5380 <!-- [[[ test_2d.fillStyle.parse.rgba-num-1.html ]]] -->
  5382 <p>Canvas test: 2d.fillStyle.parse.rgba-num-1</p>
  5383 <canvas id="c196" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5384 <script>
  5387 function test_2d_fillStyle_parse_rgba_num_1() {
  5389 var canvas = document.getElementById('c196');
  5390 var ctx = canvas.getContext('2d');
  5393 ctx.fillStyle = '#f00';
  5394 ctx.fillStyle = 'rgba(  0  ,  255  ,  0  ,  .499  )';
  5395 ctx.fillRect(0, 0, 100, 50);
  5396 isPixel(ctx, 50,25, 0,255,0,127, 0);
  5400 </script>
  5402 <!-- [[[ test_2d.fillStyle.parse.rgba-num-2.html ]]] -->
  5404 <p>Canvas test: 2d.fillStyle.parse.rgba-num-2</p>
  5405 <canvas id="c197" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5406 <script>
  5409 function test_2d_fillStyle_parse_rgba_num_2() {
  5411 var canvas = document.getElementById('c197');
  5412 var ctx = canvas.getContext('2d');
  5415 ctx.fillStyle = '#f00';
  5416 ctx.fillStyle = 'rgba(  0  ,  255  ,  0  ,  0.499  )';
  5417 ctx.fillRect(0, 0, 100, 50);
  5418 isPixel(ctx, 50,25, 0,255,0,127, 0);
  5422 </script>
  5424 <!-- [[[ test_2d.fillStyle.parse.rgba-percent.html ]]] -->
  5426 <p>Canvas test: 2d.fillStyle.parse.rgba-percent</p>
  5427 <canvas id="c198" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5428 <script>
  5431 function test_2d_fillStyle_parse_rgba_percent() {
  5433 var canvas = document.getElementById('c198');
  5434 var ctx = canvas.getContext('2d');
  5437 ctx.fillStyle = '#f00';
  5438 ctx.fillStyle = 'rgba(0%,100%,0%,0.499)';
  5439 ctx.fillRect(0, 0, 100, 50);
  5440 isPixel(ctx, 50,25, 0,255,0,127, 0);
  5444 </script>
  5446 <!-- [[[ test_2d.fillStyle.parse.rgba-solid-1.html ]]] -->
  5448 <p>Canvas test: 2d.fillStyle.parse.rgba-solid-1</p>
  5449 <canvas id="c199" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5450 <script>
  5453 function test_2d_fillStyle_parse_rgba_solid_1() {
  5455 var canvas = document.getElementById('c199');
  5456 var ctx = canvas.getContext('2d');
  5459 ctx.fillStyle = '#f00';
  5460 ctx.fillStyle = 'rgba(  0  ,  255  ,  0  ,  1  )';
  5461 ctx.fillRect(0, 0, 100, 50);
  5462 isPixel(ctx, 50,25, 0,255,0,255, 0);
  5466 </script>
  5468 <!-- [[[ test_2d.fillStyle.parse.rgba-solid-2.html ]]] -->
  5470 <p>Canvas test: 2d.fillStyle.parse.rgba-solid-2</p>
  5471 <canvas id="c200" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5472 <script>
  5475 function test_2d_fillStyle_parse_rgba_solid_2() {
  5477 var canvas = document.getElementById('c200');
  5478 var ctx = canvas.getContext('2d');
  5481 ctx.fillStyle = '#f00';
  5482 ctx.fillStyle = 'rgba(  0  ,  255  ,  0  ,  1.0  )';
  5483 ctx.fillRect(0, 0, 100, 50);
  5484 isPixel(ctx, 50,25, 0,255,0,255, 0);
  5488 </script>
  5490 <!-- [[[ test_2d.fillStyle.parse.svg-1.html ]]] -->
  5492 <p>Canvas test: 2d.fillStyle.parse.svg-1</p>
  5493 <canvas id="c201" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5494 <script>
  5497 function test_2d_fillStyle_parse_svg_1() {
  5499 var canvas = document.getElementById('c201');
  5500 var ctx = canvas.getContext('2d');
  5503 ctx.fillStyle = '#f00';
  5504 ctx.fillStyle = 'gray';
  5505 ctx.fillRect(0, 0, 100, 50);
  5506 isPixel(ctx, 50,25, 128,128,128,255, 0);
  5510 </script>
  5512 <!-- [[[ test_2d.fillStyle.parse.svg-2.html ]]] -->
  5514 <p>Canvas test: 2d.fillStyle.parse.svg-2</p>
  5515 <canvas id="c202" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5516 <script>
  5519 function test_2d_fillStyle_parse_svg_2() {
  5521 var canvas = document.getElementById('c202');
  5522 var ctx = canvas.getContext('2d');
  5525 ctx.fillStyle = '#f00';
  5526 ctx.fillStyle = 'grey';
  5527 ctx.fillRect(0, 0, 100, 50);
  5528 isPixel(ctx, 50,25, 128,128,128,255, 0);
  5532 </script>
  5534 <!-- [[[ test_2d.fillStyle.parse.system.html ]]] -->
  5536 <p>Canvas test: 2d.fillStyle.parse.system</p>
  5537 <canvas id="c203" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5538 <script>
  5540 function test_2d_fillStyle_parse_system() {
  5542 var canvas = document.getElementById('c203');
  5543 var ctx = canvas.getContext('2d');
  5546 ctx.fillStyle = '#f00';
  5547 ctx.fillStyle = 'ThreeDDarkShadow';
  5548 ok(/^#(?!(FF0000|ff0000|f00)$)/.test(ctx.fillStyle), "ctx.fillStyle =~ /^#(?!(FF0000|ff0000|f00)$)/"); // test that it's not red
  5552 </script>
  5554 <!-- [[[ test_2d.fillStyle.parse.transparent-1.html ]]] -->
  5556 <p>Canvas test: 2d.fillStyle.parse.transparent-1</p>
  5557 <canvas id="c204" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5558 <script>
  5561 function test_2d_fillStyle_parse_transparent_1() {
  5563 var canvas = document.getElementById('c204');
  5564 var ctx = canvas.getContext('2d');
  5567 ctx.fillStyle = '#f00';
  5568 ctx.fillStyle = 'transparent';
  5569 ctx.fillRect(0, 0, 100, 50);
  5570 isPixel(ctx, 50,25, 0,0,0,0, 0);
  5574 </script>
  5576 <!-- [[[ test_2d.fillStyle.parse.transparent-2.html ]]] -->
  5578 <p>Canvas test: 2d.fillStyle.parse.transparent-2</p>
  5579 <canvas id="c205" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5580 <script>
  5583 function test_2d_fillStyle_parse_transparent_2() {
  5585 var canvas = document.getElementById('c205');
  5586 var ctx = canvas.getContext('2d');
  5589 ctx.fillStyle = '#f00';
  5590 ctx.fillStyle = 'TrAnSpArEnT';
  5591 ctx.fillRect(0, 0, 100, 50);
  5592 isPixel(ctx, 50,25, 0,0,0,0, 0);
  5596 </script>
  5598 <!-- [[[ test_2d.getcontext.exists.html ]]] -->
  5600 <p>Canvas test: 2d.getcontext.exists</p>
  5601 <!-- Testing: The 2D context is implemented -->
  5602 <canvas id="c206" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5603 <script>
  5605 function test_2d_getcontext_exists() {
  5607 var canvas = document.getElementById('c206');
  5608 var ctx = canvas.getContext('2d');
  5610 ok(canvas.getContext('2d') !== null, "canvas.getContext('2d') !== null");
  5614 </script>
  5616 <!-- [[[ test_2d.getcontext.shared.html ]]] -->
  5618 <p>Canvas test: 2d.getcontext.shared</p>
  5619 <!-- Testing: getContext('2d') returns objects which share canvas state -->
  5620 <canvas id="c207" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5621 <script>
  5624 function test_2d_getcontext_shared() {
  5626 var canvas = document.getElementById('c207');
  5627 var ctx = canvas.getContext('2d');
  5629 var ctx2 = canvas.getContext('2d');
  5630 ctx.fillStyle = '#f00';
  5631 ctx2.fillStyle = '#0f0';
  5632 ctx.fillRect(0, 0, 100, 50);
  5633 isPixel(ctx, 50,25, 0,255,0,255, 0);
  5637 </script>
  5639 <!-- [[[ test_2d.getcontext.unique.html ]]] -->
  5641 <p>Canvas test: 2d.getcontext.unique</p>
  5642 <!-- Testing: getContext('2d') returns the same object -->
  5643 <canvas id="c208" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5644 <script>
  5646 function test_2d_getcontext_unique() {
  5648 var canvas = document.getElementById('c208');
  5649 var ctx = canvas.getContext('2d');
  5651 ok(canvas.getContext('2d') === canvas.getContext('2d'), "canvas.getContext('2d') === canvas.getContext('2d')");
  5655 </script>
  5657 <!-- [[[ test_2d.gradient.empty.html ]]] -->
  5659 <p>Canvas test: 2d.gradient.empty</p>
  5660 <canvas id="c209" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5661 <script>
  5664 function test_2d_gradient_empty() {
  5666 var canvas = document.getElementById('c209');
  5667 var ctx = canvas.getContext('2d');
  5669 ctx.fillStyle = '#0f0';
  5670 ctx.fillRect(0, 0, 100, 50);
  5671 var g = ctx.createLinearGradient(0, 0, 0, 50);
  5672 ctx.fillStyle = g;
  5673 ctx.fillRect(0, 0, 100, 50);
  5674 isPixel(ctx, 50,25, 0,255,0,255, 2);
  5678 </script>
  5680 <!-- [[[ test_2d.gradient.interpolate.alpha.html ]]] -->
  5682 <p>Canvas test: 2d.gradient.interpolate.alpha</p>
  5683 <canvas id="c210" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5684 <script>
  5687 function test_2d_gradient_interpolate_alpha() {
  5689 var canvas = document.getElementById('c210');
  5690 var ctx = canvas.getContext('2d');
  5692 ctx.fillStyle = '#ff0';
  5693 ctx.fillRect(0, 0, 100, 50);
  5694 var g = ctx.createLinearGradient(0, 0, 100, 0);
  5695 g.addColorStop(0, 'rgba(0,0,255, 0)');
  5696 g.addColorStop(1, 'rgba(0,0,255, 1)');
  5697 ctx.fillStyle = g;
  5698 ctx.fillRect(0, 0, 100, 50);
  5699 isPixel(ctx, 25,25, 191,191,63,255, 3);
  5700 isPixel(ctx, 50,25, 127,127,127,255, 3);
  5701 isPixel(ctx, 75,25, 63,63,191,255, 3);
  5705 </script>
  5707 <!-- [[[ test_2d.gradient.interpolate.colour.html ]]] -->
  5709 <p>Canvas test: 2d.gradient.interpolate.colour</p>
  5710 <canvas id="c211" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5711 <script>
  5714 function test_2d_gradient_interpolate_colour() {
  5716 var canvas = document.getElementById('c211');
  5717 var ctx = canvas.getContext('2d');
  5719 var g = ctx.createLinearGradient(0, 0, 100, 0);
  5720 g.addColorStop(0, '#ff0');
  5721 g.addColorStop(1, '#00f');
  5722 ctx.fillStyle = g;
  5723 ctx.fillRect(0, 0, 100, 50);
  5724 isPixel(ctx, 25,25, 191,191,63,255, 3);
  5725 isPixel(ctx, 50,25, 127,127,127,255, 3);
  5726 isPixel(ctx, 75,25, 63,63,191,255, 3);
  5730 </script>
  5732 <!-- [[[ test_2d.gradient.interpolate.colouralpha.html ]]] -->
  5734 <p>Canvas test: 2d.gradient.interpolate.colouralpha</p>
  5735 <canvas id="c212" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5736 <script>
  5739 function test_2d_gradient_interpolate_colouralpha() {
  5741 var canvas = document.getElementById('c212');
  5742 var ctx = canvas.getContext('2d');
  5744 var g = ctx.createLinearGradient(0, 0, 100, 0);
  5745 g.addColorStop(0, 'rgba(255,255,0, 0)');
  5746 g.addColorStop(1, 'rgba(0,0,255, 1)');
  5747 ctx.fillStyle = g;
  5748 ctx.fillRect(0, 0, 100, 50);
  5749 isPixel(ctx, 25,25, 191,191,63,63, 3);
  5750 isPixel(ctx, 50,25, 127,127,127,127, 3);
  5751 isPixel(ctx, 75,25, 63,63,191,191, 3);
  5755 </script>
  5757 <!-- [[[ test_2d.gradient.interpolate.multiple.html ]]] -->
  5759 <p>Canvas test: 2d.gradient.interpolate.multiple</p>
  5760 <canvas id="c213" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5761 <script>
  5764 function test_2d_gradient_interpolate_multiple() {
  5766 var canvas = document.getElementById('c213');
  5767 var ctx = canvas.getContext('2d');
  5769 canvas.width = 200;
  5770 var g = ctx.createLinearGradient(0, 0, 200, 0);
  5771 g.addColorStop(0, '#ff0');
  5772 g.addColorStop(0.5, '#0ff');
  5773 g.addColorStop(1, '#f0f');
  5774 ctx.fillStyle = g;
  5775 ctx.fillRect(0, 0, 200, 50);
  5776 isPixel(ctx, 50,25, 127,255,127,255, 3);
  5777 isPixel(ctx, 100,25, 0,255,255,255, 3);
  5778 isPixel(ctx, 150,25, 127,127,255,255, 3);
  5782 </script>
  5784 <!-- [[[ test_2d.gradient.interpolate.outside.html ]]] -->
  5786 <p>Canvas test: 2d.gradient.interpolate.outside</p>
  5787 <canvas id="c214" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5788 <script>
  5791 function test_2d_gradient_interpolate_outside() {
  5793 var canvas = document.getElementById('c214');
  5794 var ctx = canvas.getContext('2d');
  5796 ctx.fillStyle = '#f00';
  5797 ctx.fillRect(0, 0, 100, 50);
  5799 var g = ctx.createLinearGradient(25, 0, 75, 0);
  5800 g.addColorStop(0.4, '#0f0');
  5801 g.addColorStop(0.6, '#0f0');
  5803 ctx.fillStyle = g;
  5804 ctx.fillRect(0, 0, 100, 50);
  5805 isPixel(ctx, 20,25, 0,255,0,255, 2);
  5806 isPixel(ctx, 50,25, 0,255,0,255, 2);
  5807 isPixel(ctx, 80,25, 0,255,0,255, 2);
  5811 </script>
  5813 <!-- [[[ test_2d.gradient.interpolate.overlap.html ]]] -->
  5815 <p>Canvas test: 2d.gradient.interpolate.overlap</p>
  5816 <canvas id="c215" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5817 <script>
  5820 function test_2d_gradient_interpolate_overlap() {
  5822 var canvas = document.getElementById('c215');
  5823 var ctx = canvas.getContext('2d');
  5825 if (!IsD2DEnabled() && !IsMacOSX10_5orOlder()) {
  5826     // On D2D the different nature of how gradients
  5827     // are drawn makes it so we cannot guarantee these stops are completely
  5828     // hard.
  5830     // On OS X 10.5 quartz is confused by the overlapping stops: Bug #715235
  5831     canvas.width = 200;
  5832     var g = ctx.createLinearGradient(0, 0, 200, 0);
  5833     g.addColorStop(0, '#f00');
  5834     g.addColorStop(0, '#ff0');
  5835     g.addColorStop(0.25, '#00f');
  5836     g.addColorStop(0.25, '#0f0');
  5837     g.addColorStop(0.25, '#0f0');
  5838     g.addColorStop(0.25, '#0f0');
  5839     g.addColorStop(0.25, '#ff0');
  5840     g.addColorStop(0.5, '#00f');
  5841     g.addColorStop(0.5, '#0f0');
  5842     g.addColorStop(0.75, '#00f');
  5843     g.addColorStop(0.75, '#f00');
  5844     g.addColorStop(0.75, '#ff0');
  5845     g.addColorStop(0.5, '#0f0');
  5846     g.addColorStop(0.5, '#0f0');
  5847     g.addColorStop(0.5, '#ff0');
  5848     g.addColorStop(1, '#00f');
  5849     ctx.fillStyle = g;
  5850     ctx.fillRect(0, 0, 200, 50);
  5851     isPixel(ctx, 49,25, 0,0,255,255, 16);
  5852     isPixel(ctx, 51,25, 255,255,0,255, 16);
  5853     isPixel(ctx, 99,25, 0,0,255,255, 16);
  5854     isPixel(ctx, 101,25, 255,255,0,255, 16);
  5855     isPixel(ctx, 149,25, 0,0,255,255, 16);
  5856     isPixel(ctx, 151,25, 255,255,0,255, 16);
  5859 </script>
  5861 <!-- [[[ test_2d.gradient.interpolate.overlap2.html ]]] -->
  5863 <p>Canvas test: 2d.gradient.interpolate.overlap2</p>
  5864 <canvas id="c216" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5865 <script>
  5868 function test_2d_gradient_interpolate_overlap2() {
  5870 var canvas = document.getElementById('c216');
  5871 var ctx = canvas.getContext('2d');
  5873 var g = ctx.createLinearGradient(0, 0, 100, 0);
  5874 var ps = [ 0, 1/10, 1/4, 1/3, 1/2, 3/4, 1 ];
  5875 for (var p = 0; p < ps.length; ++p)
  5877         g.addColorStop(ps[p], '#0f0');
  5878         for (var i = 0; i < 15; ++i)
  5879                 g.addColorStop(ps[p], '#f00');
  5880         g.addColorStop(ps[p], '#0f0');
  5882 ctx.fillStyle = g;
  5883 ctx.fillRect(0, 0, 100, 50);
  5885 if (!IsMacOSX10_5orOlder()) {
  5886     // On OS X 10.5 quartz is confused by the overlapping stops: Bug #715235
  5887     isPixel(ctx, 1,25, 0,255,0,255, 0);
  5888     isPixel(ctx, 30,25, 0,255,0,255, 0);
  5889     isPixel(ctx, 40,25, 0,255,0,255, 0);
  5890     isPixel(ctx, 60,25, 0,255,0,255, 0);
  5891     isPixel(ctx, 80,25, 0,255,0,255, 0);
  5895 </script>
  5897 <!-- [[[ test_2d.gradient.interpolate.solid.html ]]] -->
  5899 <p>Canvas test: 2d.gradient.interpolate.solid</p>
  5900 <canvas id="c217" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5901 <script>
  5904 function test_2d_gradient_interpolate_solid() {
  5906 var canvas = document.getElementById('c217');
  5907 var ctx = canvas.getContext('2d');
  5909 var g = ctx.createLinearGradient(0, 0, 100, 0);
  5910 g.addColorStop(0, '#0f0');
  5911 g.addColorStop(1, '#0f0');
  5912 ctx.fillStyle = g;
  5913 ctx.fillRect(0, 0, 100, 50);
  5914 isPixel(ctx, 50,25, 0,255,0,255, 0);
  5918 </script>
  5920 <!-- [[[ test_2d.gradient.interpolate.vertical.html ]]] -->
  5922 <p>Canvas test: 2d.gradient.interpolate.vertical</p>
  5923 <canvas id="c218" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5924 <script>
  5927 function test_2d_gradient_interpolate_vertical() {
  5929 var canvas = document.getElementById('c218');
  5930 var ctx = canvas.getContext('2d');
  5932 var g = ctx.createLinearGradient(0, 0, 0, 50);
  5933 g.addColorStop(0, '#ff0');
  5934 g.addColorStop(1, '#00f');
  5935 ctx.fillStyle = g;
  5936 ctx.fillRect(0, 0, 100, 50);
  5937 isPixel(ctx, 50,12, 191,191,63,255, 10);
  5938 isPixel(ctx, 50,25, 127,127,127,255, 5);
  5939 isPixel(ctx, 50,37, 63,63,191,255, 10);
  5943 </script>
  5945 <!-- [[[ test_2d.gradient.interpolate.zerosize.html ]]] -->
  5947 <p>Canvas test: 2d.gradient.interpolate.zerosize</p>
  5948 <canvas id="c219" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5949 <script>
  5953 function test_2d_gradient_interpolate_zerosize() {
  5955 var canvas = document.getElementById('c219');
  5956 var ctx = canvas.getContext('2d');
  5958 ctx.fillStyle = '#0f0';
  5959 ctx.fillRect(0, 0, 100, 50);
  5961 var g = ctx.createLinearGradient(50, 25, 50, 25); // zero-length line (undefined direction)
  5962 g.addColorStop(0, '#f00');
  5963 g.addColorStop(1, '#f00');
  5964 ctx.fillStyle = g;
  5965 ctx.fillRect(0, 0, 100, 50);
  5967 todo_isPixel(ctx, 40,20, 0,255,0,255, 2);
  5970 </script>
  5972 <!-- [[[ test_2d.gradient.linear.nonfinite.html ]]] -->
  5974 <p>Canvas test: 2d.gradient.linear.nonfinite</p>
  5975 <!-- Testing: createLinearGradient() throws NOT_SUPPORTED_ERR if arguments are not finite -->
  5976 <canvas id="c220" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  5977 <script>
  5979 function test_2d_gradient_linear_nonfinite() {
  5981 var canvas = document.getElementById('c220');
  5982 var ctx = canvas.getContext('2d');
  5984 var _thrown = undefined; try {
  5985   ctx.createLinearGradient(Infinity, 0, 1, 0);
  5986 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  5987 var _thrown = undefined; try {
  5988   ctx.createLinearGradient(-Infinity, 0, 1, 0);
  5989 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  5990 var _thrown = undefined; try {
  5991   ctx.createLinearGradient(NaN, 0, 1, 0);
  5992 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  5993 var _thrown = undefined; try {
  5994   ctx.createLinearGradient(0, Infinity, 1, 0);
  5995 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  5996 var _thrown = undefined; try {
  5997   ctx.createLinearGradient(0, -Infinity, 1, 0);
  5998 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  5999 var _thrown = undefined; try {
  6000   ctx.createLinearGradient(0, NaN, 1, 0);
  6001 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6002 var _thrown = undefined; try {
  6003   ctx.createLinearGradient(0, 0, Infinity, 0);
  6004 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6005 var _thrown = undefined; try {
  6006   ctx.createLinearGradient(0, 0, -Infinity, 0);
  6007 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6008 var _thrown = undefined; try {
  6009   ctx.createLinearGradient(0, 0, NaN, 0);
  6010 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6011 var _thrown = undefined; try {
  6012   ctx.createLinearGradient(0, 0, 1, Infinity);
  6013 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6014 var _thrown = undefined; try {
  6015   ctx.createLinearGradient(0, 0, 1, -Infinity);
  6016 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6017 var _thrown = undefined; try {
  6018   ctx.createLinearGradient(0, 0, 1, NaN);
  6019 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6020 var _thrown = undefined; try {
  6021   ctx.createLinearGradient(Infinity, Infinity, 1, 0);
  6022 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6023 var _thrown = undefined; try {
  6024   ctx.createLinearGradient(Infinity, Infinity, Infinity, 0);
  6025 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6026 var _thrown = undefined; try {
  6027   ctx.createLinearGradient(Infinity, Infinity, Infinity, Infinity);
  6028 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6029 var _thrown = undefined; try {
  6030   ctx.createLinearGradient(Infinity, Infinity, 1, Infinity);
  6031 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6032 var _thrown = undefined; try {
  6033   ctx.createLinearGradient(Infinity, 0, Infinity, 0);
  6034 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6035 var _thrown = undefined; try {
  6036   ctx.createLinearGradient(Infinity, 0, Infinity, Infinity);
  6037 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6038 var _thrown = undefined; try {
  6039   ctx.createLinearGradient(Infinity, 0, 1, Infinity);
  6040 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6041 var _thrown = undefined; try {
  6042   ctx.createLinearGradient(0, Infinity, Infinity, 0);
  6043 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6044 var _thrown = undefined; try {
  6045   ctx.createLinearGradient(0, Infinity, Infinity, Infinity);
  6046 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6047 var _thrown = undefined; try {
  6048   ctx.createLinearGradient(0, Infinity, 1, Infinity);
  6049 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6050 var _thrown = undefined; try {
  6051   ctx.createLinearGradient(0, 0, Infinity, Infinity);
  6052 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6056 </script>
  6058 <!-- [[[ test_2d.gradient.linear.transform.1.html ]]] -->
  6060 <p>Canvas test: 2d.gradient.linear.transform.1</p>
  6061 <!-- Testing: Linear gradient coordinates are relative to the coordinate space at the time of filling -->
  6062 <canvas id="c221" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  6063 <script>
  6066 function test_2d_gradient_linear_transform_1() {
  6068 var canvas = document.getElementById('c221');
  6069 var ctx = canvas.getContext('2d');
  6071 var g = ctx.createLinearGradient(0, 0, 200, 0);
  6072 g.addColorStop(0, '#f00');
  6073 g.addColorStop(0.25, '#0f0');
  6074 g.addColorStop(0.75, '#0f0');
  6075 g.addColorStop(1, '#f00');
  6076 ctx.fillStyle = g;
  6077 ctx.translate(-50, 0);
  6078 ctx.fillRect(50, 0, 100, 50);
  6079 isPixel(ctx, 25,25, 0,255,0,255, 0);
  6080 isPixel(ctx, 50,25, 0,255,0,255, 0);
  6081 isPixel(ctx, 75,25, 0,255,0,255, 0);
  6085 </script>
  6087 <!-- [[[ test_2d.gradient.linear.transform.2.html ]]] -->
  6089 <p>Canvas test: 2d.gradient.linear.transform.2</p>
  6090 <!-- Testing: Linear gradient coordinates are relative to the coordinate space at the time of filling -->
  6091 <canvas id="c222" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  6092 <script>
  6095 function test_2d_gradient_linear_transform_2() {
  6097 var canvas = document.getElementById('c222');
  6098 var ctx = canvas.getContext('2d');
  6100 ctx.translate(100, 0);
  6101 var g = ctx.createLinearGradient(0, 0, 200, 0);
  6102 g.addColorStop(0, '#f00');
  6103 g.addColorStop(0.25, '#0f0');
  6104 g.addColorStop(0.75, '#0f0');
  6105 g.addColorStop(1, '#f00');
  6106 ctx.fillStyle = g;
  6107 ctx.translate(-150, 0);
  6108 ctx.fillRect(50, 0, 100, 50);
  6109 isPixel(ctx, 25,25, 0,255,0,255, 0);
  6110 isPixel(ctx, 50,25, 0,255,0,255, 0);
  6111 isPixel(ctx, 75,25, 0,255,0,255, 0);
  6115 </script>
  6117 <!-- [[[ test_2d.gradient.linear.transform.3.html ]]] -->
  6119 <p>Canvas test: 2d.gradient.linear.transform.3</p>
  6120 <!-- Testing: Linear gradient transforms do not experience broken caching effects -->
  6121 <canvas id="c223" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  6122 <script>
  6126 function test_2d_gradient_linear_transform_3() {
  6128 var canvas = document.getElementById('c223');
  6129 var ctx = canvas.getContext('2d');
  6131 var g = ctx.createLinearGradient(0, 0, 200, 0);
  6132 g.addColorStop(0, '#f00');
  6133 g.addColorStop(0.25, '#0f0');
  6134 g.addColorStop(0.75, '#0f0');
  6135 g.addColorStop(1, '#f00');
  6136 ctx.fillStyle = g;
  6137 ctx.fillRect(0, 0, 100, 50);
  6138 ctx.translate(-50, 0);
  6139 ctx.fillRect(50, 0, 100, 50);
  6141 isPixel(ctx, 25,25, 0,255,0,255, 0);
  6142 isPixel(ctx, 50,25, 0,255,0,255, 0);
  6143 isPixel(ctx, 75,25, 0,255,0,255, 0);
  6145 </script>
  6147 <!-- [[[ test_2d.gradient.object.compare.html ]]] -->
  6149 <p>Canvas test: 2d.gradient.object.compare</p>
  6150 <canvas id="c224" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  6151 <script>
  6153 function test_2d_gradient_object_compare() {
  6155 var canvas = document.getElementById('c224');
  6156 var ctx = canvas.getContext('2d');
  6158 var g1 = ctx.createLinearGradient(0, 0, 100, 0);
  6159 var g2 = ctx.createLinearGradient(0, 0, 100, 0);
  6160 ok(g1 !== g2, "g1 !== g2");
  6161 ctx.fillStyle = g1;
  6162 ok(ctx.fillStyle === g1, "ctx.fillStyle === g1");
  6166 </script>
  6168 <!-- [[[ test_2d.gradient.object.crosscanvas.html ]]] -->
  6170 <p>Canvas test: 2d.gradient.object.crosscanvas</p>
  6171 <canvas id="c225" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  6172 <script>
  6175 function test_2d_gradient_object_crosscanvas() {
  6177 var canvas = document.getElementById('c225');
  6178 var ctx = canvas.getContext('2d');
  6180 ctx.fillStyle = '#f00';
  6181 ctx.fillRect(0, 0, 100, 50);
  6182 var g = document.createElement('canvas').getContext('2d').createLinearGradient(0, 0, 100, 0);
  6183 g.addColorStop(0, '#0f0');
  6184 g.addColorStop(1, '#0f0');
  6185 ctx.fillStyle = g;
  6186 ctx.fillRect(0, 0, 100, 50);
  6187 isPixel(ctx, 50,25, 0,255,0,255, 2);
  6191 </script>
  6193 <!-- [[[ test_2d.gradient.object.invalidcolour.html ]]] -->
  6195 <p>Canvas test: 2d.gradient.object.invalidcolour</p>
  6196 <canvas id="c226" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  6197 <script>
  6199 function test_2d_gradient_object_invalidcolour() {
  6201 var canvas = document.getElementById('c226');
  6202 var ctx = canvas.getContext('2d');
  6204 var g = ctx.createLinearGradient(0, 0, 100, 0);
  6205 var _thrown = undefined; try {
  6206   g.addColorStop(0, "");
  6207 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "SyntaxError" && _thrown.code == DOMException.SYNTAX_ERR, "should throw SyntaxError");
  6208 var _thrown = undefined; try {
  6209   g.addColorStop(0, 'undefined');
  6210 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "SyntaxError" && _thrown.code == DOMException.SYNTAX_ERR, "should throw SyntaxError");
  6214 </script>
  6216 <!-- [[[ test_2d.gradient.object.invalidoffset.html ]]] -->
  6218 <p>Canvas test: 2d.gradient.object.invalidoffset</p>
  6219 <canvas id="c227" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  6220 <script>
  6222 function test_2d_gradient_object_invalidoffset() {
  6224 var canvas = document.getElementById('c227');
  6225 var ctx = canvas.getContext('2d');
  6227 var g = ctx.createLinearGradient(0, 0, 100, 0);
  6228 var _thrown = undefined; try {
  6229   g.addColorStop(-1, '#000');
  6230 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
  6231 var _thrown = undefined; try {
  6232   g.addColorStop(2, '#000');
  6233 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
  6234 var _thrown = undefined; try {
  6235   g.addColorStop(Infinity, '#000');
  6236 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
  6237 var _thrown = undefined; try {
  6238   g.addColorStop(-Infinity, '#000');
  6239 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
  6240 var _thrown = undefined; try {
  6241   g.addColorStop(NaN, '#000');
  6242 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
  6246 </script>
  6248 <!-- [[[ test_2d.gradient.object.return.html ]]] -->
  6250 <p>Canvas test: 2d.gradient.object.return</p>
  6251 <!-- Testing: createLinearGradient() and createRadialGradient() returns objects implementing CanvasGradient -->
  6252 <canvas id="c228" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  6253 <script>
  6255 function test_2d_gradient_object_return() {
  6257 var canvas = document.getElementById('c228');
  6258 var ctx = canvas.getContext('2d');
  6260 window.CanvasGradient.prototype.thisImplementsCanvasGradient = true;
  6262 var g1 = ctx.createLinearGradient(0, 0, 100, 0);
  6263 ok(g1.addColorStop !== undefined, "g1.addColorStop !== undefined");
  6264 ok(g1.thisImplementsCanvasGradient === true, "g1.thisImplementsCanvasGradient === true");
  6266 var g2 = ctx.createRadialGradient(0, 0, 10, 0, 0, 20);
  6267 ok(g2.addColorStop !== undefined, "g2.addColorStop !== undefined");
  6268 ok(g2.thisImplementsCanvasGradient === true, "g2.thisImplementsCanvasGradient === true");
  6272 </script>
  6274 <!-- [[[ test_2d.gradient.object.type.html ]]] -->
  6276 <p>Canvas test: 2d.gradient.object.type</p>
  6277 <!-- Testing: window.CanvasGradient exists and has the right properties -->
  6278 <canvas id="c229" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  6279 <script>
  6281 function test_2d_gradient_object_type() {
  6283 var canvas = document.getElementById('c229');
  6284 var ctx = canvas.getContext('2d');
  6286 ok(window.CanvasGradient !== undefined, "window.CanvasGradient !== undefined");
  6287 ok(window.CanvasGradient.prototype.addColorStop !== undefined, "window.CanvasGradient.prototype.addColorStop !== undefined");
  6291 </script>
  6293 <!-- [[[ test_2d.gradient.object.update.html ]]] -->
  6295 <p>Canvas test: 2d.gradient.object.update</p>
  6296 <canvas id="c230" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  6297 <script>
  6300 function test_2d_gradient_object_update() {
  6302 var canvas = document.getElementById('c230');
  6303 var ctx = canvas.getContext('2d');
  6305 var g = ctx.createLinearGradient(-100, 0, 200, 0);
  6306 g.addColorStop(0, '#f00');
  6307 g.addColorStop(1, '#f00');
  6308 ctx.fillStyle = g;
  6309 g.addColorStop(0.1, '#0f0');
  6310 g.addColorStop(0.9, '#0f0');
  6311 ctx.fillRect(0, 0, 100, 50);
  6312 isPixel(ctx, 50,25, 0,255,0,255, 2);
  6316 </script>
  6318 <!-- [[[ test_2d.gradient.radial.cone.behind.html ]]] -->
  6320 <p>Canvas test: 2d.gradient.radial.cone.behind</p>
  6321 <canvas id="c231" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  6322 <script>
  6326 function test_2d_gradient_radial_cone_behind() {
  6328 var canvas = document.getElementById('c231');
  6329 var ctx = canvas.getContext('2d');
  6331 ctx.fillStyle = '#0f0';
  6332 ctx.fillRect(0, 0, 100, 50);
  6334 var g = ctx.createRadialGradient(120, 25, 10, 211, 25, 100);
  6335 g.addColorStop(0, '#f00');
  6336 g.addColorStop(1, '#f00');
  6337 ctx.fillStyle = g;
  6338 ctx.fillRect(0, 0, 100, 50);
  6340 isPixel(ctx, 1,1, 0,255,0,255, 0);
  6341 isPixel(ctx, 50,1, 0,255,0,255, 0);
  6342 isPixel(ctx, 98,1, 0,255,0,255, 0);
  6343 isPixel(ctx, 1,25, 0,255,0,255, 0);
  6344 isPixel(ctx, 50,25, 0,255,0,255, 0);
  6345 isPixel(ctx, 98,25, 0,255,0,255, 0);
  6346 isPixel(ctx, 1,48, 0,255,0,255, 0);
  6347 isPixel(ctx, 50,48, 0,255,0,255, 0);
  6348 isPixel(ctx, 98,48, 0,255,0,255, 0);
  6352 </script>
  6354 <!-- [[[ test_2d.gradient.radial.cone.beside.html ]]] -->
  6356 <p>Canvas test: 2d.gradient.radial.cone.beside</p>
  6357 <canvas id="c232" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  6358 <script>
  6362 function test_2d_gradient_radial_cone_beside() {
  6364 var canvas = document.getElementById('c232');
  6365 var ctx = canvas.getContext('2d');
  6367 ctx.fillStyle = '#0f0';
  6368 ctx.fillRect(0, 0, 100, 50);
  6370 var g = ctx.createRadialGradient(0, 100, 40, 100, 100, 50);
  6371 g.addColorStop(0, '#f00');
  6372 g.addColorStop(1, '#f00');
  6373 ctx.fillStyle = g;
  6374 ctx.fillRect(0, 0, 100, 50);
  6376 isPixel(ctx, 1,1, 0,255,0,255, 0);
  6377 isPixel(ctx, 50,1, 0,255,0,255, 0);
  6378 isPixel(ctx, 98,1, 0,255,0,255, 0);
  6379 isPixel(ctx, 1,25, 0,255,0,255, 0);
  6380 isPixel(ctx, 50,25, 0,255,0,255, 0);
  6381 isPixel(ctx, 98,25, 0,255,0,255, 0);
  6382 isPixel(ctx, 1,48, 0,255,0,255, 0);
  6383 isPixel(ctx, 50,48, 0,255,0,255, 0);
  6384 isPixel(ctx, 98,48, 0,255,0,255, 0);
  6388 </script>
  6390 <!-- [[[ test_2d.gradient.radial.cone.bottom.html ]]] -->
  6392 <p>Canvas test: 2d.gradient.radial.cone.bottom</p>
  6393 <canvas id="c233" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  6394 <script>
  6397 function test_2d_gradient_radial_cone_bottom() {
  6399 var canvas = document.getElementById('c233');
  6400 var ctx = canvas.getContext('2d');
  6402 ctx.fillStyle = '#f00';
  6403 ctx.fillRect(0, 0, 100, 50);
  6405 var g = ctx.createRadialGradient(210, 25, 100, 230, 25, 101);
  6406 g.addColorStop(0, '#0f0');
  6407 g.addColorStop(1, '#f00');
  6408 ctx.fillStyle = g;
  6409 ctx.fillRect(0, 0, 100, 50);
  6411 isPixel(ctx, 1,1, 0,255,0,255, 0);
  6412 isPixel(ctx, 50,1, 0,255,0,255, 0);
  6413 isPixel(ctx, 98,1, 0,255,0,255, 0);
  6414 isPixel(ctx, 1,25, 0,255,0,255, 0);
  6415 isPixel(ctx, 50,25, 0,255,0,255, 0);
  6416 isPixel(ctx, 98,25, 0,255,0,255, 0);
  6417 isPixel(ctx, 1,48, 0,255,0,255, 0);
  6418 isPixel(ctx, 50,48, 0,255,0,255, 0);
  6419 isPixel(ctx, 98,48, 0,255,0,255, 0);
  6423 </script>
  6425 <!-- [[[ test_2d.gradient.radial.cone.cylinder.html ]]] -->
  6427 <p>Canvas test: 2d.gradient.radial.cone.cylinder</p>
  6428 <canvas id="c234" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  6429 <script>
  6432 function test_2d_gradient_radial_cone_cylinder() {
  6434 var canvas = document.getElementById('c234');
  6435 var ctx = canvas.getContext('2d');
  6437 ctx.fillStyle = '#f00';
  6438 ctx.fillRect(0, 0, 100, 50);
  6440 var g = ctx.createRadialGradient(210, 25, 100, 230, 25, 100);
  6441 g.addColorStop(0, '#0f0');
  6442 g.addColorStop(1, '#f00');
  6443 ctx.fillStyle = g;
  6444 ctx.fillRect(0, 0, 100, 50);
  6446 isPixel(ctx, 1, 1, 0, 255, 0, 255, 0);
  6447 isPixel(ctx, 50, 1, 0, 255, 0, 255, 0);
  6448 isPixel(ctx, 98, 1, 0, 255, 0, 255, 0);
  6449 isPixel(ctx, 1, 25, 0, 255, 0, 255, 0);
  6450 isPixel(ctx, 50, 25, 0, 255, 0, 255, 0);
  6451 isPixel(ctx, 98, 25, 0, 255, 0, 255, 0);
  6452 isPixel(ctx, 1, 48, 0, 255, 0, 255, 0);
  6453 isPixel(ctx, 50, 48, 0, 255, 0, 255, 0);
  6454 isPixel(ctx, 98, 48, 0, 255, 0, 255, 0);
  6457 </script>
  6459 <!-- [[[ test_2d.gradient.radial.cone.front.html ]]] -->
  6461 <p>Canvas test: 2d.gradient.radial.cone.front</p>
  6462 <canvas id="c235" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  6463 <script>
  6466 function test_2d_gradient_radial_cone_front() {
  6468 var canvas = document.getElementById('c235');
  6469 var ctx = canvas.getContext('2d');
  6471 ctx.fillStyle = '#f00';
  6472 ctx.fillRect(0, 0, 100, 50);
  6474 var g = ctx.createRadialGradient(311, 25, 10, 210, 25, 100);
  6475 g.addColorStop(0, '#f00');
  6476 g.addColorStop(1, '#0f0');
  6477 ctx.fillStyle = g;
  6478 ctx.fillRect(0, 0, 100, 50);
  6480 isPixel(ctx, 1,1, 0,255,0,255, 0);
  6481 isPixel(ctx, 50,1, 0,255,0,255, 0);
  6482 isPixel(ctx, 98,1, 0,255,0,255, 0);
  6483 isPixel(ctx, 1,25, 0,255,0,255, 0);
  6484 isPixel(ctx, 50,25, 0,255,0,255, 0);
  6485 isPixel(ctx, 98,25, 0,255,0,255, 0);
  6486 isPixel(ctx, 1,48, 0,255,0,255, 0);
  6487 isPixel(ctx, 50,48, 0,255,0,255, 0);
  6488 isPixel(ctx, 98,48, 0,255,0,255, 0);
  6492 </script>
  6494 <!-- [[[ test_2d.gradient.radial.cone.shape1.html ]]] -->
  6496 <p>Canvas test: 2d.gradient.radial.cone.shape1</p>
  6497 <canvas id="c236" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  6498 <script>
  6501 function test_2d_gradient_radial_cone_shape1() {
  6503 var canvas = document.getElementById('c236');
  6504 var ctx = canvas.getContext('2d');
  6506 var tol = 1; // tolerance to avoid antialiasing artifacts
  6508 ctx.fillStyle = '#0f0';
  6509 ctx.fillRect(0, 0, 100, 50);
  6511 ctx.fillStyle = '#f00';
  6512 ctx.beginPath();
  6513 ctx.moveTo(30+tol, 40);
  6514 ctx.lineTo(110, -20+tol);
  6515 ctx.lineTo(110, 100-tol);
  6516 ctx.fill();
  6518 var g = ctx.createRadialGradient(30+10*5/2, 40, 10*3/2, 30+10*15/4, 40, 10*9/4);
  6519 g.addColorStop(0, '#0f0');
  6520 g.addColorStop(1, '#0f0');
  6521 ctx.fillStyle = g;
  6522 ctx.fillRect(0, 0, 100, 50);
  6524 isPixel(ctx, 1,1, 0,255,0,255, 0);
  6525 isPixel(ctx, 50,1, 0,255,0,255, 0);
  6526 isPixel(ctx, 98,1, 0,255,0,255, 0);
  6527 isPixel(ctx, 1,25, 0,255,0,255, 0);
  6528 isPixel(ctx, 50,25, 0,255,0,255, 0);
  6529 isPixel(ctx, 98,25, 0,255,0,255, 0);
  6530 isPixel(ctx, 1,48, 0,255,0,255, 0);
  6531 isPixel(ctx, 50,48, 0,255,0,255, 0);
  6532 isPixel(ctx, 98,48, 0,255,0,255, 0);
  6536 </script>
  6538 <!-- [[[ test_2d.gradient.radial.cone.shape2.html ]]] -->
  6540 <p>Canvas test: 2d.gradient.radial.cone.shape2</p>
  6541 <canvas id="c237" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  6542 <script>
  6546 function test_2d_gradient_radial_cone_shape2() {
  6548 var canvas = document.getElementById('c237');
  6549 var ctx = canvas.getContext('2d');
  6551 var tol = 1; // tolerance to avoid antialiasing artifacts
  6553 ctx.fillStyle = '#0f0';
  6554 ctx.fillRect(0, 0, 100, 50);
  6556 var g = ctx.createRadialGradient(30+10*5/2, 40, 10*3/2, 30+10*15/4, 40, 10*9/4);
  6557 g.addColorStop(0, '#f00');
  6558 g.addColorStop(1, '#f00');
  6559 ctx.fillStyle = g;
  6560 ctx.fillRect(0, 0, 100, 50);
  6562 ctx.fillStyle = '#0f0';
  6563 ctx.beginPath();
  6564 ctx.moveTo(30-tol, 40);
  6565 ctx.lineTo(110, -20-tol);
  6566 ctx.lineTo(110, 100+tol);
  6567 ctx.fill();
  6569 isPixel(ctx, 1,1, 0,255,0,255, 0);
  6570 isPixel(ctx, 50,1, 0,255,0,255, 0);
  6571 isPixel(ctx, 98,1, 0,255,0,255, 0);
  6572 isPixel(ctx, 1,25, 0,255,0,255, 0);
  6573 isPixel(ctx, 50,25, 0,255,0,255, 0);
  6574 isPixel(ctx, 98,25, 0,255,0,255, 0);
  6575 isPixel(ctx, 1,48, 0,255,0,255, 0);
  6576 isPixel(ctx, 50,48, 0,255,0,255, 0);
  6577 isPixel(ctx, 98,48, 0,255,0,255, 0);
  6581 </script>
  6583 <!-- [[[ test_2d.gradient.radial.cone.top.html ]]] -->
  6585 <p>Canvas test: 2d.gradient.radial.cone.top</p>
  6586 <canvas id="c238" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  6587 <script>
  6590 function test_2d_gradient_radial_cone_top() {
  6592 var canvas = document.getElementById('c238');
  6593 var ctx = canvas.getContext('2d');
  6595 ctx.fillStyle = '#f00';
  6596 ctx.fillRect(0, 0, 100, 50);
  6598 var g = ctx.createRadialGradient(230, 25, 100, 100, 25, 101);
  6599 g.addColorStop(0, '#f00');
  6600 g.addColorStop(1, '#0f0');
  6601 ctx.fillStyle = g;
  6602 ctx.fillRect(0, 0, 100, 50);
  6604 isPixel(ctx, 1, 1, 0, 255, 0, 255, 0);
  6605 isPixel(ctx, 50, 1, 0, 255, 0, 255, 0);
  6606 isPixel(ctx, 98, 1, 0, 255, 0, 255, 0);
  6607 isPixel(ctx, 1, 25, 0, 255, 0, 255, 0);
  6608 isPixel(ctx, 50, 25, 0, 255, 0, 255, 0);
  6609 isPixel(ctx, 98, 25, 0, 255, 0, 255, 0);
  6610 isPixel(ctx, 1, 48, 0, 255, 0, 255, 0);
  6611 isPixel(ctx, 50, 48, 0, 255, 0, 255, 0);
  6612 isPixel(ctx, 98, 48, 0, 255, 0, 255, 0);
  6615 </script>
  6617 <!-- [[[ test_2d.gradient.radial.equal.html ]]] -->
  6619 <p>Canvas test: 2d.gradient.radial.equal</p>
  6620 <canvas id="c239" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  6621 <script>
  6625 function test_2d_gradient_radial_equal() {
  6627 var canvas = document.getElementById('c239');
  6628 var ctx = canvas.getContext('2d');
  6630 ctx.fillStyle = '#0f0';
  6631 ctx.fillRect(0, 0, 100, 50);
  6633 var g = ctx.createRadialGradient(50, 25, 20, 50, 25, 20);
  6634 g.addColorStop(0, '#f00');
  6635 g.addColorStop(1, '#f00');
  6636 ctx.fillStyle = g;
  6637 ctx.fillRect(0, 0, 100, 50);
  6639 isPixel(ctx, 1,1, 0,255,0,255, 0);
  6640 isPixel(ctx, 50,1, 0,255,0,255, 0);
  6641 isPixel(ctx, 98,1, 0,255,0,255, 0);
  6642 isPixel(ctx, 1,25, 0,255,0,255, 0);
  6643 isPixel(ctx, 50,25, 0,255,0,255, 0);
  6644 isPixel(ctx, 98,25, 0,255,0,255, 0);
  6645 isPixel(ctx, 1,48, 0,255,0,255, 0);
  6646 isPixel(ctx, 50,48, 0,255,0,255, 0);
  6647 isPixel(ctx, 98,48, 0,255,0,255, 0);
  6651 </script>
  6653 <!-- [[[ test_2d.gradient.radial.inside1.html ]]] -->
  6655 <p>Canvas test: 2d.gradient.radial.inside1</p>
  6656 <canvas id="c240" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  6657 <script>
  6660 function test_2d_gradient_radial_inside1() {
  6662 if (IsAcceleratedSkia())
  6663   return;
  6665 var canvas = document.getElementById('c240');
  6666 var ctx = canvas.getContext('2d');
  6668 ctx.fillStyle = '#f00';
  6669 ctx.fillRect(0, 0, 100, 50);
  6671 var g = ctx.createRadialGradient(50, 25, 100, 50, 25, 200);
  6672 g.addColorStop(0, '#0f0');
  6673 g.addColorStop(1, '#f00');
  6674 ctx.fillStyle = g;
  6675 ctx.fillRect(0, 0, 100, 50);
  6677 isPixel(ctx, 1,1, 0,255,0,255, 0);
  6678 isPixel(ctx, 50,1, 0,255,0,255, 0);
  6679 isPixel(ctx, 98,1, 0,255,0,255, 0);
  6680 isPixel(ctx, 1,25, 0,255,0,255, 0);
  6681 isPixel(ctx, 50,25, 0,255,0,255, 0);
  6682 isPixel(ctx, 98,25, 0,255,0,255, 0);
  6683 isPixel(ctx, 1,48, 0,255,0,255, 0);
  6684 isPixel(ctx, 50,48, 0,255,0,255, 0);
  6685 isPixel(ctx, 98,48, 0,255,0,255, 0);
  6689 </script>
  6691 <!-- [[[ test_2d.gradient.radial.inside2.html ]]] -->
  6693 <p>Canvas test: 2d.gradient.radial.inside2</p>
  6694 <canvas id="c241" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  6695 <script>
  6698 function test_2d_gradient_radial_inside2() {
  6700 var canvas = document.getElementById('c241');
  6701 var ctx = canvas.getContext('2d');
  6703 ctx.fillStyle = '#f00';
  6704 ctx.fillRect(0, 0, 100, 50);
  6706 var g = ctx.createRadialGradient(50, 25, 200, 50, 25, 100);
  6707 g.addColorStop(0, '#f00');
  6708 g.addColorStop(1, '#0f0');
  6709 ctx.fillStyle = g;
  6710 ctx.fillRect(0, 0, 100, 50);
  6712 isPixel(ctx, 1,1, 0,255,0,255, 0);
  6713 isPixel(ctx, 50,1, 0,255,0,255, 0);
  6714 isPixel(ctx, 98,1, 0,255,0,255, 0);
  6715 isPixel(ctx, 1,25, 0,255,0,255, 0);
  6716 isPixel(ctx, 50,25, 0,255,0,255, 0);
  6717 isPixel(ctx, 98,25, 0,255,0,255, 0);
  6718 isPixel(ctx, 1,48, 0,255,0,255, 0);
  6719 isPixel(ctx, 50,48, 0,255,0,255, 0);
  6720 isPixel(ctx, 98,48, 0,255,0,255, 0);
  6724 </script>
  6726 <!-- [[[ test_2d.gradient.radial.inside3.html ]]] -->
  6728 <p>Canvas test: 2d.gradient.radial.inside3</p>
  6729 <canvas id="c242" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  6730 <script>
  6733 function test_2d_gradient_radial_inside3() {
  6735 var canvas = document.getElementById('c242');
  6736 var ctx = canvas.getContext('2d');
  6738 ctx.fillStyle = '#f00';
  6739 ctx.fillRect(0, 0, 100, 50);
  6741 var g = ctx.createRadialGradient(50, 25, 200, 50, 25, 100);
  6742 g.addColorStop(0, '#f00');
  6743 g.addColorStop(0.993, '#f00');
  6744 g.addColorStop(1, '#0f0');
  6745 ctx.fillStyle = g;
  6746 ctx.fillRect(0, 0, 100, 50);
  6748 isPixel(ctx, 1,1, 0,255,0,255, 0);
  6749 isPixel(ctx, 50,1, 0,255,0,255, 0);
  6750 isPixel(ctx, 98,1, 0,255,0,255, 0);
  6751 isPixel(ctx, 1,25, 0,255,0,255, 0);
  6752 isPixel(ctx, 50,25, 0,255,0,255, 0);
  6753 isPixel(ctx, 98,25, 0,255,0,255, 0);
  6754 isPixel(ctx, 1,48, 0,255,0,255, 0);
  6755 isPixel(ctx, 50,48, 0,255,0,255, 0);
  6756 isPixel(ctx, 98,48, 0,255,0,255, 0);
  6760 </script>
  6762 <!-- [[[ test_2d.gradient.radial.negative.html ]]] -->
  6764 <p>Canvas test: 2d.gradient.radial.negative</p>
  6765 <!-- Testing: createRadialGradient() throws INDEX_SIZE_ERR if either radius is negative -->
  6766 <canvas id="c243" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  6767 <script>
  6769 function test_2d_gradient_radial_negative() {
  6771 var canvas = document.getElementById('c243');
  6772 var ctx = canvas.getContext('2d');
  6774 var _thrown = undefined; try {
  6775   ctx.createRadialGradient(0, 0, -0.1, 0, 0, 1);
  6776 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
  6777 var _thrown = undefined; try {
  6778   ctx.createRadialGradient(0, 0, 1, 0, 0, -0.1);
  6779 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
  6780 var _thrown = undefined; try {
  6781   ctx.createRadialGradient(0, 0, -0.1, 0, 0, -0.1);
  6782 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
  6786 </script>
  6788 <!-- [[[ test_2d.gradient.radial.nonfinite.html ]]] -->
  6790 <p>Canvas test: 2d.gradient.radial.nonfinite</p>
  6791 <!-- Testing: createRadialGradient() throws NOT_SUPPORTED_ERR if arguments are not finite -->
  6792 <canvas id="c244" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  6793 <script>
  6795 function test_2d_gradient_radial_nonfinite() {
  6797 var canvas = document.getElementById('c244');
  6798 var ctx = canvas.getContext('2d');
  6800 var _thrown = undefined; try {
  6801   ctx.createRadialGradient(Infinity, 0, 1, 0, 0, 1);
  6802 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6803 var _thrown = undefined; try {
  6804   ctx.createRadialGradient(-Infinity, 0, 1, 0, 0, 1);
  6805 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6806 var _thrown = undefined; try {
  6807   ctx.createRadialGradient(NaN, 0, 1, 0, 0, 1);
  6808 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6809 var _thrown = undefined; try {
  6810   ctx.createRadialGradient(0, Infinity, 1, 0, 0, 1);
  6811 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6812 var _thrown = undefined; try {
  6813   ctx.createRadialGradient(0, -Infinity, 1, 0, 0, 1);
  6814 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6815 var _thrown = undefined; try {
  6816   ctx.createRadialGradient(0, NaN, 1, 0, 0, 1);
  6817 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6818 var _thrown = undefined; try {
  6819   ctx.createRadialGradient(0, 0, Infinity, 0, 0, 1);
  6820 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6821 var _thrown = undefined; try {
  6822   ctx.createRadialGradient(0, 0, -Infinity, 0, 0, 1);
  6823 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6824 var _thrown = undefined; try {
  6825   ctx.createRadialGradient(0, 0, NaN, 0, 0, 1);
  6826 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6827 var _thrown = undefined; try {
  6828   ctx.createRadialGradient(0, 0, 1, Infinity, 0, 1);
  6829 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6830 var _thrown = undefined; try {
  6831   ctx.createRadialGradient(0, 0, 1, -Infinity, 0, 1);
  6832 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6833 var _thrown = undefined; try {
  6834   ctx.createRadialGradient(0, 0, 1, NaN, 0, 1);
  6835 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6836 var _thrown = undefined; try {
  6837   ctx.createRadialGradient(0, 0, 1, 0, Infinity, 1);
  6838 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6839 var _thrown = undefined; try {
  6840   ctx.createRadialGradient(0, 0, 1, 0, -Infinity, 1);
  6841 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6842 var _thrown = undefined; try {
  6843   ctx.createRadialGradient(0, 0, 1, 0, NaN, 1);
  6844 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6845 var _thrown = undefined; try {
  6846   ctx.createRadialGradient(0, 0, 1, 0, 0, Infinity);
  6847 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6848 var _thrown = undefined; try {
  6849   ctx.createRadialGradient(0, 0, 1, 0, 0, -Infinity);
  6850 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6851 var _thrown = undefined; try {
  6852   ctx.createRadialGradient(0, 0, 1, 0, 0, NaN);
  6853 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6854 var _thrown = undefined; try {
  6855   ctx.createRadialGradient(Infinity, Infinity, 1, 0, 0, 1);
  6856 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6857 var _thrown = undefined; try {
  6858   ctx.createRadialGradient(Infinity, Infinity, Infinity, 0, 0, 1);
  6859 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6860 var _thrown = undefined; try {
  6861   ctx.createRadialGradient(Infinity, Infinity, Infinity, Infinity, 0, 1);
  6862 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6863 var _thrown = undefined; try {
  6864   ctx.createRadialGradient(Infinity, Infinity, Infinity, Infinity, Infinity, 1);
  6865 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6866 var _thrown = undefined; try {
  6867   ctx.createRadialGradient(Infinity, Infinity, Infinity, Infinity, Infinity, Infinity);
  6868 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6869 var _thrown = undefined; try {
  6870   ctx.createRadialGradient(Infinity, Infinity, Infinity, Infinity, 0, Infinity);
  6871 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6872 var _thrown = undefined; try {
  6873   ctx.createRadialGradient(Infinity, Infinity, Infinity, 0, Infinity, 1);
  6874 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6875 var _thrown = undefined; try {
  6876   ctx.createRadialGradient(Infinity, Infinity, Infinity, 0, Infinity, Infinity);
  6877 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6878 var _thrown = undefined; try {
  6879   ctx.createRadialGradient(Infinity, Infinity, Infinity, 0, 0, Infinity);
  6880 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6881 var _thrown = undefined; try {
  6882   ctx.createRadialGradient(Infinity, Infinity, 1, Infinity, 0, 1);
  6883 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6884 var _thrown = undefined; try {
  6885   ctx.createRadialGradient(Infinity, Infinity, 1, Infinity, Infinity, 1);
  6886 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6887 var _thrown = undefined; try {
  6888   ctx.createRadialGradient(Infinity, Infinity, 1, Infinity, Infinity, Infinity);
  6889 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6890 var _thrown = undefined; try {
  6891   ctx.createRadialGradient(Infinity, Infinity, 1, Infinity, 0, Infinity);
  6892 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6893 var _thrown = undefined; try {
  6894   ctx.createRadialGradient(Infinity, Infinity, 1, 0, Infinity, 1);
  6895 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6896 var _thrown = undefined; try {
  6897   ctx.createRadialGradient(Infinity, Infinity, 1, 0, Infinity, Infinity);
  6898 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6899 var _thrown = undefined; try {
  6900   ctx.createRadialGradient(Infinity, Infinity, 1, 0, 0, Infinity);
  6901 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6902 var _thrown = undefined; try {
  6903   ctx.createRadialGradient(Infinity, 0, Infinity, 0, 0, 1);
  6904 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6905 var _thrown = undefined; try {
  6906   ctx.createRadialGradient(Infinity, 0, Infinity, Infinity, 0, 1);
  6907 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6908 var _thrown = undefined; try {
  6909   ctx.createRadialGradient(Infinity, 0, Infinity, Infinity, Infinity, 1);
  6910 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6911 var _thrown = undefined; try {
  6912   ctx.createRadialGradient(Infinity, 0, Infinity, Infinity, Infinity, Infinity);
  6913 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6914 var _thrown = undefined; try {
  6915   ctx.createRadialGradient(Infinity, 0, Infinity, Infinity, 0, Infinity);
  6916 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6917 var _thrown = undefined; try {
  6918   ctx.createRadialGradient(Infinity, 0, Infinity, 0, Infinity, 1);
  6919 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6920 var _thrown = undefined; try {
  6921   ctx.createRadialGradient(Infinity, 0, Infinity, 0, Infinity, Infinity);
  6922 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6923 var _thrown = undefined; try {
  6924   ctx.createRadialGradient(Infinity, 0, Infinity, 0, 0, Infinity);
  6925 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6926 var _thrown = undefined; try {
  6927   ctx.createRadialGradient(Infinity, 0, 1, Infinity, 0, 1);
  6928 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6929 var _thrown = undefined; try {
  6930   ctx.createRadialGradient(Infinity, 0, 1, Infinity, Infinity, 1);
  6931 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6932 var _thrown = undefined; try {
  6933   ctx.createRadialGradient(Infinity, 0, 1, Infinity, Infinity, Infinity);
  6934 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6935 var _thrown = undefined; try {
  6936   ctx.createRadialGradient(Infinity, 0, 1, Infinity, 0, Infinity);
  6937 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6938 var _thrown = undefined; try {
  6939   ctx.createRadialGradient(Infinity, 0, 1, 0, Infinity, 1);
  6940 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6941 var _thrown = undefined; try {
  6942   ctx.createRadialGradient(Infinity, 0, 1, 0, Infinity, Infinity);
  6943 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6944 var _thrown = undefined; try {
  6945   ctx.createRadialGradient(Infinity, 0, 1, 0, 0, Infinity);
  6946 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6947 var _thrown = undefined; try {
  6948   ctx.createRadialGradient(0, Infinity, Infinity, 0, 0, 1);
  6949 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6950 var _thrown = undefined; try {
  6951   ctx.createRadialGradient(0, Infinity, Infinity, Infinity, 0, 1);
  6952 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6953 var _thrown = undefined; try {
  6954   ctx.createRadialGradient(0, Infinity, Infinity, Infinity, Infinity, 1);
  6955 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6956 var _thrown = undefined; try {
  6957   ctx.createRadialGradient(0, Infinity, Infinity, Infinity, Infinity, Infinity);
  6958 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6959 var _thrown = undefined; try {
  6960   ctx.createRadialGradient(0, Infinity, Infinity, Infinity, 0, Infinity);
  6961 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6962 var _thrown = undefined; try {
  6963   ctx.createRadialGradient(0, Infinity, Infinity, 0, Infinity, 1);
  6964 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6965 var _thrown = undefined; try {
  6966   ctx.createRadialGradient(0, Infinity, Infinity, 0, Infinity, Infinity);
  6967 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6968 var _thrown = undefined; try {
  6969   ctx.createRadialGradient(0, Infinity, Infinity, 0, 0, Infinity);
  6970 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6971 var _thrown = undefined; try {
  6972   ctx.createRadialGradient(0, Infinity, 1, Infinity, 0, 1);
  6973 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6974 var _thrown = undefined; try {
  6975   ctx.createRadialGradient(0, Infinity, 1, Infinity, Infinity, 1);
  6976 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6977 var _thrown = undefined; try {
  6978   ctx.createRadialGradient(0, Infinity, 1, Infinity, Infinity, Infinity);
  6979 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6980 var _thrown = undefined; try {
  6981   ctx.createRadialGradient(0, Infinity, 1, Infinity, 0, Infinity);
  6982 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6983 var _thrown = undefined; try {
  6984   ctx.createRadialGradient(0, Infinity, 1, 0, Infinity, 1);
  6985 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6986 var _thrown = undefined; try {
  6987   ctx.createRadialGradient(0, Infinity, 1, 0, Infinity, Infinity);
  6988 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6989 var _thrown = undefined; try {
  6990   ctx.createRadialGradient(0, Infinity, 1, 0, 0, Infinity);
  6991 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6992 var _thrown = undefined; try {
  6993   ctx.createRadialGradient(0, 0, Infinity, Infinity, 0, 1);
  6994 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6995 var _thrown = undefined; try {
  6996   ctx.createRadialGradient(0, 0, Infinity, Infinity, Infinity, 1);
  6997 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  6998 var _thrown = undefined; try {
  6999   ctx.createRadialGradient(0, 0, Infinity, Infinity, Infinity, Infinity);
  7000 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7001 var _thrown = undefined; try {
  7002   ctx.createRadialGradient(0, 0, Infinity, Infinity, 0, Infinity);
  7003 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7004 var _thrown = undefined; try {
  7005   ctx.createRadialGradient(0, 0, Infinity, 0, Infinity, 1);
  7006 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7007 var _thrown = undefined; try {
  7008   ctx.createRadialGradient(0, 0, Infinity, 0, Infinity, Infinity);
  7009 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7010 var _thrown = undefined; try {
  7011   ctx.createRadialGradient(0, 0, Infinity, 0, 0, Infinity);
  7012 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7013 var _thrown = undefined; try {
  7014   ctx.createRadialGradient(0, 0, 1, Infinity, Infinity, 1);
  7015 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7016 var _thrown = undefined; try {
  7017   ctx.createRadialGradient(0, 0, 1, Infinity, Infinity, Infinity);
  7018 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7019 var _thrown = undefined; try {
  7020   ctx.createRadialGradient(0, 0, 1, Infinity, 0, Infinity);
  7021 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7022 var _thrown = undefined; try {
  7023   ctx.createRadialGradient(0, 0, 1, 0, Infinity, Infinity);
  7024 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7028 </script>
  7030 <!-- [[[ test_2d.gradient.radial.outside1.html ]]] -->
  7032 <p>Canvas test: 2d.gradient.radial.outside1</p>
  7033 <canvas id="c245" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7034 <script>
  7037 function test_2d_gradient_radial_outside1() {
  7039 var canvas = document.getElementById('c245');
  7040 var ctx = canvas.getContext('2d');
  7042 ctx.fillStyle = '#f00';
  7043 ctx.fillRect(0, 0, 100, 50);
  7045 var g = ctx.createRadialGradient(200, 25, 10, 200, 25, 20);
  7046 g.addColorStop(0, '#f00');
  7047 g.addColorStop(1, '#0f0');
  7048 ctx.fillStyle = g;
  7049 ctx.fillRect(0, 0, 100, 50);
  7051 isPixel(ctx, 1,1, 0,255,0,255, 0);
  7052 isPixel(ctx, 50,1, 0,255,0,255, 0);
  7053 isPixel(ctx, 98,1, 0,255,0,255, 0);
  7054 isPixel(ctx, 1,25, 0,255,0,255, 0);
  7055 isPixel(ctx, 50,25, 0,255,0,255, 0);
  7056 isPixel(ctx, 98,25, 0,255,0,255, 0);
  7057 isPixel(ctx, 1,48, 0,255,0,255, 0);
  7058 isPixel(ctx, 50,48, 0,255,0,255, 0);
  7059 isPixel(ctx, 98,48, 0,255,0,255, 0);
  7063 </script>
  7065 <!-- [[[ test_2d.gradient.radial.outside2.html ]]] -->
  7067 <p>Canvas test: 2d.gradient.radial.outside2</p>
  7068 <canvas id="c246" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7069 <script>
  7073 function test_2d_gradient_radial_outside2() {
  7075 var canvas = document.getElementById('c246');
  7076 var ctx = canvas.getContext('2d');
  7078 ctx.fillStyle = '#f00';
  7079 ctx.fillRect(0, 0, 100, 50);
  7081 var g = ctx.createRadialGradient(200, 25, 20, 200, 25, 10);
  7082 g.addColorStop(0, '#0f0');
  7083 g.addColorStop(1, '#f00');
  7084 ctx.fillStyle = g;
  7085 ctx.fillRect(0, 0, 100, 50);
  7087 isPixel(ctx, 1,1, 0,255,0,255, 0);
  7088 isPixel(ctx, 50,1, 0,255,0,255, 0);
  7089 isPixel(ctx, 98,1, 0,255,0,255, 0);
  7090 isPixel(ctx, 1,25, 0,255,0,255, 0);
  7091 isPixel(ctx, 50,25, 0,255,0,255, 0);
  7092 isPixel(ctx, 98,25, 0,255,0,255, 0);
  7093 isPixel(ctx, 1,48, 0,255,0,255, 0);
  7094 isPixel(ctx, 50,48, 0,255,0,255, 0);
  7095 isPixel(ctx, 98,48, 0,255,0,255, 0);
  7099 </script>
  7101 <!-- [[[ test_2d.gradient.radial.outside3.html ]]] -->
  7103 <p>Canvas test: 2d.gradient.radial.outside3</p>
  7104 <canvas id="c247" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7105 <script>
  7109 function test_2d_gradient_radial_outside3() {
  7111 var canvas = document.getElementById('c247');
  7112 var ctx = canvas.getContext('2d');
  7114 ctx.fillStyle = '#f00';
  7115 ctx.fillRect(0, 0, 100, 50);
  7117 var g = ctx.createRadialGradient(200, 25, 20, 200, 25, 10);
  7118 g.addColorStop(0, '#0f0');
  7119 g.addColorStop(0.001, '#f00');
  7120 g.addColorStop(1, '#f00');
  7121 ctx.fillStyle = g;
  7122 ctx.fillRect(0, 0, 100, 50);
  7124 isPixel(ctx, 1,1, 0,255,0,255, 0);
  7125 isPixel(ctx, 50,1, 0,255,0,255, 0);
  7126 isPixel(ctx, 98,1, 0,255,0,255, 0);
  7127 isPixel(ctx, 1,25, 0,255,0,255, 0);
  7128 isPixel(ctx, 50,25, 0,255,0,255, 0);
  7129 isPixel(ctx, 98,25, 0,255,0,255, 0);
  7130 isPixel(ctx, 1,48, 0,255,0,255, 0);
  7131 isPixel(ctx, 50,48, 0,255,0,255, 0);
  7132 isPixel(ctx, 98,48, 0,255,0,255, 0);
  7136 </script>
  7138 <!-- [[[ test_2d.gradient.radial.touch1.html ]]] -->
  7140 <p>Canvas test: 2d.gradient.radial.touch1</p>
  7141 <canvas id="c248" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7142 <script>
  7146 function test_2d_gradient_radial_touch1() {
  7148 var canvas = document.getElementById('c248');
  7149 var ctx = canvas.getContext('2d');
  7151 ctx.fillStyle = '#0f0';
  7152 ctx.fillRect(0, 0, 100, 50);
  7154 var g = ctx.createRadialGradient(150, 25, 50, 200, 25, 100);
  7155 g.addColorStop(0, '#f00');
  7156 g.addColorStop(1, '#f00');
  7157 ctx.fillStyle = g;
  7158 ctx.fillRect(0, 0, 100, 50);
  7160 isPixel(ctx, 1,1, 0,255,0,255, 0);
  7161 isPixel(ctx, 50,1, 0,255,0,255, 0);
  7162 isPixel(ctx, 98,1, 0,255,0,255, 0);
  7163 isPixel(ctx, 1,25, 0,255,0,255, 0);
  7164 isPixel(ctx, 50,25, 0,255,0,255, 0);
  7165 isPixel(ctx, 98,25, 0,255,0,255, 0);
  7166 isPixel(ctx, 1,48, 0,255,0,255, 0);
  7167 isPixel(ctx, 50,48, 0,255,0,255, 0);
  7168 isPixel(ctx, 98,48, 0,255,0,255, 0);
  7172 </script>
  7174 <!-- [[[ test_2d.gradient.radial.touch2.html ]]] -->
  7176 <p>Canvas test: 2d.gradient.radial.touch2</p>
  7177 <canvas id="c249" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7178 <script>
  7182 function test_2d_gradient_radial_touch2() {
  7184 var canvas = document.getElementById('c249');
  7185 var ctx = canvas.getContext('2d');
  7187 ctx.fillStyle = '#f00';
  7188 ctx.fillRect(0, 0, 100, 50);
  7190 var g = ctx.createRadialGradient(-80, 25, 70, 0, 25, 150);
  7191 g.addColorStop(0, '#f00');
  7192 g.addColorStop(0.01, '#0f0');
  7193 g.addColorStop(0.99, '#0f0');
  7194 g.addColorStop(1, '#f00');
  7195 ctx.fillStyle = g;
  7196 ctx.fillRect(0, 0, 100, 50);
  7198 isPixel(ctx, 1,1, 0,255,0,255, 0);
  7199 isPixel(ctx, 50,1, 0,255,0,255, 0);
  7200 isPixel(ctx, 98,1, 0,255,0,255, 0);
  7201 isPixel(ctx, 1,25, 0,255,0,255, 0);
  7202 isPixel(ctx, 50,25, 0,255,0,255, 0);
  7203 isPixel(ctx, 98,25, 0,255,0,255, 0);
  7204 isPixel(ctx, 1,48, 0,255,0,255, 0);
  7205 isPixel(ctx, 50,48, 0,255,0,255, 0);
  7206 isPixel(ctx, 98,48, 0,255,0,255, 0);
  7210 </script>
  7212 <!-- [[[ test_2d.gradient.radial.touch3.html ]]] -->
  7214 <p>Canvas test: 2d.gradient.radial.touch3</p>
  7215 <canvas id="c250" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7216 <script>
  7220 function test_2d_gradient_radial_touch3() {
  7222 var canvas = document.getElementById('c250');
  7223 var ctx = canvas.getContext('2d');
  7225 ctx.fillStyle = '#0f0';
  7226 ctx.fillRect(0, 0, 100, 50);
  7228 var g = ctx.createRadialGradient(120, -15, 25, 140, -30, 50);
  7229 g.addColorStop(0, '#f00');
  7230 g.addColorStop(1, '#f00');
  7231 ctx.fillStyle = g;
  7232 ctx.fillRect(0, 0, 100, 50);
  7234 isPixel(ctx, 1,1, 0,255,0,255, 0);
  7235 isPixel(ctx, 50,1, 0,255,0,255, 0);
  7236 isPixel(ctx, 98,1, 0,255,0,255, 0);
  7237 isPixel(ctx, 1,25, 0,255,0,255, 0);
  7238 isPixel(ctx, 50,25, 0,255,0,255, 0);
  7239 isPixel(ctx, 98,25, 0,255,0,255, 0);
  7240 isPixel(ctx, 1,48, 0,255,0,255, 0);
  7241 isPixel(ctx, 50,48, 0,255,0,255, 0);
  7242 isPixel(ctx, 98,48, 0,255,0,255, 0);
  7246 </script>
  7248 <!-- [[[ test_2d.gradient.radial.transform.1.html ]]] -->
  7250 <p>Canvas test: 2d.gradient.radial.transform.1</p>
  7251 <!-- Testing: Radial gradient coordinates are relative to the coordinate space at the time of filling -->
  7252 <canvas id="c251" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7253 <script>
  7256 function test_2d_gradient_radial_transform_1() {
  7258 var canvas = document.getElementById('c251');
  7259 var ctx = canvas.getContext('2d');
  7261 var g = ctx.createRadialGradient(0, 0, 0, 0, 0, 11.2);
  7262 g.addColorStop(0, '#0f0');
  7263 g.addColorStop(0.5, '#0f0');
  7264 g.addColorStop(0.51, '#f00');
  7265 g.addColorStop(1, '#f00');
  7266 ctx.fillStyle = g;
  7267 ctx.translate(50, 25);
  7268 ctx.scale(10, 10);
  7269 ctx.fillRect(-5, -2.5, 10, 5);
  7270 isPixel(ctx, 25,25, 0,255,0,255, 0);
  7271 isPixel(ctx, 50,25, 0,255,0,255, 0);
  7272 isPixel(ctx, 75,25, 0,255,0,255, 0);
  7276 </script>
  7278 <!-- [[[ test_2d.gradient.radial.transform.2.html ]]] -->
  7280 <p>Canvas test: 2d.gradient.radial.transform.2</p>
  7281 <!-- Testing: Radial gradient coordinates are relative to the coordinate space at the time of filling -->
  7282 <canvas id="c252" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7283 <script>
  7286 function test_2d_gradient_radial_transform_2() {
  7288 var canvas = document.getElementById('c252');
  7289 var ctx = canvas.getContext('2d');
  7291 ctx.translate(100, 0);
  7292 var g = ctx.createRadialGradient(0, 0, 0, 0, 0, 11.2);
  7293 g.addColorStop(0, '#0f0');
  7294 g.addColorStop(0.5, '#0f0');
  7295 g.addColorStop(0.51, '#f00');
  7296 g.addColorStop(1, '#f00');
  7297 ctx.fillStyle = g;
  7298 ctx.translate(-50, 25);
  7299 ctx.scale(10, 10);
  7300 ctx.fillRect(-5, -2.5, 10, 5);
  7301 isPixel(ctx, 25,25, 0,255,0,255, 0);
  7302 isPixel(ctx, 50,25, 0,255,0,255, 0);
  7303 isPixel(ctx, 75,25, 0,255,0,255, 0);
  7307 </script>
  7309 <!-- [[[ test_2d.gradient.radial.transform.3.html ]]] -->
  7311 <p>Canvas test: 2d.gradient.radial.transform.3</p>
  7312 <!-- Testing: Radial gradient transforms do not experience broken caching effects -->
  7313 <canvas id="c253" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7314 <script>
  7318 function test_2d_gradient_radial_transform_3() {
  7320 var canvas = document.getElementById('c253');
  7321 var ctx = canvas.getContext('2d');
  7323 var g = ctx.createRadialGradient(0, 0, 0, 0, 0, 11.2);
  7324 g.addColorStop(0, '#0f0');
  7325 g.addColorStop(0.5, '#0f0');
  7326 g.addColorStop(0.51, '#f00');
  7327 g.addColorStop(1, '#f00');
  7328 ctx.fillStyle = g;
  7329 ctx.fillRect(0, 0, 100, 50);
  7330 ctx.translate(50, 25);
  7331 ctx.scale(10, 10);
  7332 ctx.fillRect(-5, -2.5, 10, 5);
  7334 isPixel(ctx, 25,25, 0,255,0,255, 0);
  7335 isPixel(ctx, 50,25, 0,255,0,255, 0);
  7336 isPixel(ctx, 75,25, 0,255,0,255, 0);
  7339 </script>
  7341 <!-- [[[ test_2d.imageData.create.basic.html ]]] -->
  7343 <p>Canvas test: 2d.imageData.create.basic - bug 433004</p>
  7344 <!-- Testing: createImageData() exists and returns something -->
  7345 <canvas id="c254" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7346 <script>
  7348 function test_2d_imageData_create_basic() {
  7350 var canvas = document.getElementById('c254');
  7351 var ctx = canvas.getContext('2d');
  7353 ok(ctx.createImageData(1, 1) !== null, "ctx.createImageData(1, 1) !== null");
  7357 </script>
  7359 <!-- [[[ test_2d.imageData.create1.basic.html ]]] -->
  7361 <p>Canvas test: 2d.imageData.create1.basic - bug 630040</p>
  7362 <!-- Testing: createImageData(imgdata) exists and returns something -->
  7363 <canvas id="c254a" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7364 <script>
  7366 function test_2d_imageData_create1_basic() {
  7368 var canvas = document.getElementById('c254a');
  7369 var ctx = canvas.getContext('2d');
  7371 ok(ctx.createImageData(ctx.createImageData(1, 1)) != null, "ctx.createImageData(ctx.createImageData(1, 1)) != null");
  7375 </script>
  7377 <!-- [[[ test_2d.imageData.create.initial.html ]]] -->
  7379 <p>Canvas test: 2d.imageData.create.initial - bug 433004</p>
  7380 <!-- Testing: createImageData() returns transparent black data of the right size -->
  7381 <canvas id="c255" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7382 <script>
  7384 function test_2d_imageData_create_initial() {
  7386 var canvas = document.getElementById('c255');
  7387 var ctx = canvas.getContext('2d');
  7389 var imgdata = ctx.createImageData(10, 20);
  7390 ok(imgdata.data.length == imgdata.width*imgdata.height*4, "imgdata.data.length == imgdata.width*imgdata.height*4");
  7391 ok(imgdata.width < imgdata.height, "imgdata.width < imgdata.height");
  7392 ok(imgdata.width > 0, "imgdata.width > 0");
  7393 var isTransparentBlack = true;
  7394 for (var i = 0; i < imgdata.data.length; ++i)
  7395     if (imgdata.data[i] !== 0)
  7396         isTransparentBlack = false;
  7397 ok(isTransparentBlack, "isTransparentBlack");
  7401 </script>
  7403 <!-- [[[ test_2d.imageData.create1.initial.html ]]] -->
  7405 <p>Canvas test: 2d.imageData.create1.initial - bug 630040</p>
  7406 <!-- Testing: createImageData(imgdata) returns transparent black data of the right size -->
  7407 <canvas id="c255a" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7408 <script>
  7410 function test_2d_imageData_create1_initial() {
  7412 var canvas = document.getElementById('c255a');
  7413 var ctx = canvas.getContext('2d');
  7415 ctx.fillStyle = '#0f0';
  7416 ctx.fillRect(0, 0, 100, 50);
  7417 var imgdata1 = ctx.getImageData(0, 0, 10, 20);
  7418 var imgdata2 = ctx.createImageData(imgdata1);
  7419 ok(imgdata2.data.length == imgdata1.data.length, "imgdata2.data.length == imgdata1.data.length");
  7420 ok(imgdata2.width == imgdata1.width, "imgdata2.width == imgdata1.width");
  7421 ok(imgdata2.height == imgdata1.height, "imgdata2.height == imgdata1.height");
  7422 var isTransparentBlack = true;
  7423 for (var i = 0; i < imgdata2.data.length; ++i)
  7424     if (imgdata2.data[i] !== 0)
  7425         isTransparentBlack = false;
  7426 ok(isTransparentBlack, "isTransparentBlack");
  7430 </script>
  7432 <!-- [[[ test_2d.imageData.create.large.html ]]] -->
  7434 <p>Canvas test: 2d.imageData.create.large - bug 433004</p>
  7435 <!-- Testing: createImageData() works for sizes much larger than the canvas -->
  7436 <canvas id="c256" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7437 <script>
  7439 function test_2d_imageData_create_large() {
  7441 var canvas = document.getElementById('c256');
  7442 var ctx = canvas.getContext('2d');
  7444 var _thrown_outer = false;
  7446 var imgdata = ctx.createImageData(1000, 2000);
  7447 ok(imgdata.data.length == imgdata.width*imgdata.height*4, "imgdata.data.length == imgdata.width*imgdata.height*4");
  7448 ok(imgdata.width < imgdata.height, "imgdata.width < imgdata.height");
  7449 ok(imgdata.width > 0, "imgdata.width > 0");
  7450 var isTransparentBlack = true;
  7451 for (var i = 0; i < imgdata.data.length; i += 7813) // check ~1024 points (assuming normal scaling)
  7452     if (imgdata.data[i] !== 0)
  7453         isTransparentBlack = false;
  7454 ok(isTransparentBlack, "isTransparentBlack");
  7458 </script>
  7460 <!-- [[[ test_2d.imageData.create.negative.html ]]] -->
  7462 <p>Canvas test: 2d.imageData.create.negative - bug 433004</p>
  7463 <!-- Testing: createImageData() takes the absolute magnitude of the size arguments -->
  7464 <canvas id="c257" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7465 <script>
  7467 function test_2d_imageData_create_negative() {
  7469 var canvas = document.getElementById('c257');
  7470 var ctx = canvas.getContext('2d');
  7472 var _thrown_outer = false;
  7473 try {
  7475 var imgdata1 = ctx.createImageData(10, 20);
  7476 var imgdata2 = ctx.createImageData(-10, 20);
  7477 var imgdata3 = ctx.createImageData(10, -20);
  7478 var imgdata4 = ctx.createImageData(-10, -20);
  7479 ok(imgdata1.data.length == imgdata2.data.length, "imgdata1.data.length == imgdata2.data.length");
  7480 ok(imgdata2.data.length == imgdata3.data.length, "imgdata2.data.length == imgdata3.data.length");
  7481 ok(imgdata3.data.length == imgdata4.data.length, "imgdata3.data.length == imgdata4.data.length");
  7483 } catch (e) {
  7484     _thrown_outer = true;
  7486 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
  7490 </script>
  7492 <!-- [[[ test_2d.imageData.create.nonfinite.html ]]] -->
  7494 <p>Canvas test: 2d.imageData.create.nonfinite - bug 433004</p>
  7495 <!-- Testing: createImageData() throws NOT_SUPPORTED_ERR if arguments are not finite -->
  7496 <canvas id="c258" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7497 <script>
  7499 function test_2d_imageData_create_nonfinite() {
  7501 var canvas = document.getElementById('c258');
  7502 var ctx = canvas.getContext('2d');
  7504 var _thrown = undefined; try {
  7505   ctx.createImageData(Infinity, 10);
  7506 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7507 var _thrown = undefined; try {
  7508   ctx.createImageData(-Infinity, 10);
  7509 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7510 var _thrown = undefined; try {
  7511   ctx.createImageData(NaN, 10);
  7512 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7513 var _thrown = undefined; try {
  7514   ctx.createImageData(10, Infinity);
  7515 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7516 var _thrown = undefined; try {
  7517   ctx.createImageData(10, -Infinity);
  7518 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7519 var _thrown = undefined; try {
  7520   ctx.createImageData(10, NaN);
  7521 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7522 var _thrown = undefined; try {
  7523   ctx.createImageData(Infinity, Infinity);
  7524 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7525 var _thrown = undefined; try {
  7526   ctx.createImageData({valueOf:function() Infinity}, 10);
  7527 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7528 var _thrown = undefined; try {
  7529   ctx.createImageData({valueOf:function() -Infinity}, 10);
  7530 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7531 var _thrown = undefined; try {
  7532   ctx.createImageData({valueOf:function() NaN}, 10);
  7533 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7534 var _thrown = undefined; try {
  7535   ctx.createImageData(10, {valueOf:function() Infinity});
  7536 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7537 var _thrown = undefined; try {
  7538   ctx.createImageData(10, {valueOf:function() -Infinity});
  7539 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7540 var _thrown = undefined; try {
  7541   ctx.createImageData(10, {valueOf:function() NaN});
  7542 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7543 var _thrown = undefined; try {
  7544   ctx.createImageData({valueOf:function() Infinity}, {valueOf:function() Infinity});
  7545 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7549 </script>
  7551 <!-- [[[ test_2d.imageData.create.round.html ]]] -->
  7553 <p>Canvas test: 2d.imageData.create.round - bug 433004</p>
  7554 <!-- Testing: createImageData(w, h) is rounded the same as getImageData(0, 0, w, h) -->
  7555 <canvas id="c259" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7556 <script>
  7558 function test_2d_imageData_create_round() {
  7560 var canvas = document.getElementById('c259');
  7561 var ctx = canvas.getContext('2d');
  7563 var _thrown_outer = false;
  7565 var imgdata1 = ctx.createImageData(10.01, 10.99);
  7566 var imgdata2 = ctx.getImageData(0, 0, 10.01, 10.99);
  7567 is(imgdata1.width, imgdata2.width, "imgdata1.width == imgdata2.width");
  7568 is(imgdata1.height, imgdata2.height, "imgdata1.height == imgdata2.height");
  7572 </script>
  7574 <!-- [[[ test_2d.imageData.create.tiny.html ]]] -->
  7576 <p>Canvas test: 2d.imageData.create.tiny - bug 433004</p>
  7577 <!-- Testing: createImageData() works for sizes smaller than one pixel -->
  7578 <canvas id="c260" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7579 <script>
  7581 function test_2d_imageData_create_tiny() {
  7583 var canvas = document.getElementById('c260');
  7584 var ctx = canvas.getContext('2d');
  7586 var _thrown_outer = false;
  7587 try {
  7589 var imgdata = ctx.createImageData(0.0001, 0.0001);
  7590 ok(imgdata.data.length == imgdata.width*imgdata.height*4, "imgdata.data.length == imgdata.width*imgdata.height*4");
  7591 ok(imgdata.width == 1, "imgdata.width == 1");
  7592 ok(imgdata.height == 1, "imgdata.height == 1");
  7593 var isTransparentBlack = true;
  7594 for (var i = 0; i < imgdata.data.length; ++i)
  7595     if (imgdata.data[i] !== 0)
  7596         isTransparentBlack = false;
  7597 ok(isTransparentBlack, "isTransparentBlack");
  7599 } catch (e) {
  7600     _thrown_outer = true;
  7602 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
  7606 </script>
  7608 <!-- [[[ test_2d.imageData.create.type.html ]]] -->
  7610 <p>Canvas test: 2d.imageData.create.type - bug 433004</p>
  7611 <!-- Testing: createImageData() returns an ImageData object containing a Uint8ClampedArray object -->
  7612 <canvas id="c261" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7613 <script>
  7615 function test_2d_imageData_create_type() {
  7617 var canvas = document.getElementById('c261');
  7618 var ctx = canvas.getContext('2d');
  7620 ok(window.ImageData !== undefined, "window.ImageData !== undefined");
  7621 ok(window.Uint8ClampedArray !== undefined, "window.Uint8ClampedArray !== undefined");
  7622 window.ImageData.prototype.thisImplementsImageData = true;
  7623 window.Uint8ClampedArray.prototype.thisImplementsUint8ClampedArray = true;
  7624 var imgdata = ctx.createImageData(1, 1);
  7625 ok(imgdata.thisImplementsImageData, "imgdata.thisImplementsImageData");
  7626 ok(imgdata.data.thisImplementsUint8ClampedArray, "imgdata.data.thisImplementsUint8ClampedArray");
  7630 </script>
  7632 <!-- [[[ test_2d.imageData.create1.type.html ]]] -->
  7634 <p>Canvas test: 2d.imageData.create1.type - bug 630040</p>
  7635 <!-- Testing: createImageData(imgdata) returns an ImageData object containing a Uint8ClampedArray object -->
  7636 <canvas id="c261a" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7637 <script>
  7639 function test_2d_imageData_create1_type() {
  7641 var canvas = document.getElementById('c261a');
  7642 var ctx = canvas.getContext('2d');
  7644 ok(window.ImageData !== undefined, "window.ImageData !== undefined");
  7645 ok(window.Uint8ClampedArray !== undefined, "window.Uint8ClampedArray !== undefined");
  7646 window.ImageData.prototype.thisImplementsImageData = true;
  7647 window.Uint8ClampedArray.prototype.thisImplementsUint8ClampedArray = true;
  7648 var imgdata = ctx.createImageData(ctx.createImageData(1, 1));
  7649 ok(imgdata.thisImplementsImageData, "imgdata.thisImplementsImageData");
  7650 ok(imgdata.data.thisImplementsUint8ClampedArray, "imgdata.data.thisImplementsUint8ClampedArray");
  7654 </script>
  7656 <!-- [[[ test_2d.imageData.create.zero.html ]]] -->
  7658 <p>Canvas test: 2d.imageData.create.zero - bug 433004</p>
  7659 <!-- Testing: createImageData() throws INDEX_SIZE_ERR if size is zero -->
  7660 <canvas id="c262" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7661 <script>
  7663 function test_2d_imageData_create_zero() {
  7665 var canvas = document.getElementById('c262');
  7666 var ctx = canvas.getContext('2d');
  7668 var _thrown = undefined; try {
  7669   ctx.createImageData(10, 0);
  7670 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
  7671 var _thrown = undefined; try {
  7672   ctx.createImageData(0, 10);
  7673 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
  7674 var _thrown = undefined; try {
  7675   ctx.createImageData(0, 0);
  7676 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
  7680 </script>
  7682 <!-- [[[ test_2d.imageData.create1.zero.html ]]] -->
  7684 <p>Canvas test: 2d.imageData.create1.zero - bug 630040</p>
  7685 <!-- Testing: createImageData(null) throws TypeError -->
  7686 <canvas id="c262a" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7687 <script>
  7689 function test_2d_imageData_create1_zero() {
  7691 var canvas = document.getElementById('c262a');
  7692 var ctx = canvas.getContext('2d');
  7694 var _thrown = undefined; try {
  7695   ctx.createImageData(null);
  7696 } catch (e) { _thrown = e };
  7697 ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
  7701 </script>
  7703 <!-- [[[ test_2d.imageData.get.basic.html ]]] -->
  7705 <p>Canvas test: 2d.imageData.get.basic</p>
  7706 <!-- Testing: getImageData() exists and returns something -->
  7707 <canvas id="c263" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7708 <script>
  7710 function test_2d_imageData_get_basic() {
  7712 var canvas = document.getElementById('c263');
  7713 var ctx = canvas.getContext('2d');
  7715 ok(ctx.getImageData(0, 0, 100, 50) !== null, "ctx.getImageData(0, 0, 100, 50) !== null");
  7719 </script>
  7721 <!-- [[[ test_2d.imageData.get.clamp.html ]]] -->
  7723 <p>Canvas test: 2d.imageData.get.clamp</p>
  7724 <!-- Testing: getImageData() clamps colours to the range [0, 255] -->
  7725 <canvas id="c264" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7726 <script>
  7728 function test_2d_imageData_get_clamp() {
  7730 var canvas = document.getElementById('c264');
  7731 var ctx = canvas.getContext('2d');
  7733 ctx.fillStyle = 'rgb(-100, -200, -300)';
  7734 ctx.fillRect(0, 0, 100, 50);
  7735 ctx.fillStyle = 'rgb(256, 300, 400)';
  7736 ctx.fillRect(20, 10, 60, 10);
  7737 var imgdata1 = ctx.getImageData(10, 5, 1, 1);
  7738 ok(imgdata1.data[0] === 0, "imgdata1.data[\""+(0)+"\"] === 0");
  7739 ok(imgdata1.data[1] === 0, "imgdata1.data[\""+(1)+"\"] === 0");
  7740 ok(imgdata1.data[2] === 0, "imgdata1.data[\""+(2)+"\"] === 0");
  7741 var imgdata2 = ctx.getImageData(30, 15, 1, 1);
  7742 ok(imgdata2.data[0] === 255, "imgdata2.data[\""+(0)+"\"] === 255");
  7743 ok(imgdata2.data[1] === 255, "imgdata2.data[\""+(1)+"\"] === 255");
  7744 ok(imgdata2.data[2] === 255, "imgdata2.data[\""+(2)+"\"] === 255");
  7748 </script>
  7750 <!-- [[[ test_2d.imageData.get.nonfinite.html ]]] -->
  7752 <p>Canvas test: 2d.imageData.get.nonfinite</p>
  7753 <!-- Testing: getImageData() throws NOT_SUPPORTED_ERR if arguments are not finite -->
  7754 <canvas id="c265" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7755 <script>
  7757 function test_2d_imageData_get_nonfinite() {
  7759 var canvas = document.getElementById('c265');
  7760 var ctx = canvas.getContext('2d');
  7762 var _thrown = undefined; try {
  7763   ctx.getImageData(Infinity, 10, 10, 10);
  7764 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7765 var _thrown = undefined; try {
  7766   ctx.getImageData(-Infinity, 10, 10, 10);
  7767 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7768 var _thrown = undefined; try {
  7769   ctx.getImageData(NaN, 10, 10, 10);
  7770 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7771 var _thrown = undefined; try {
  7772   ctx.getImageData(10, Infinity, 10, 10);
  7773 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7774 var _thrown = undefined; try {
  7775   ctx.getImageData(10, -Infinity, 10, 10);
  7776 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7777 var _thrown = undefined; try {
  7778   ctx.getImageData(10, NaN, 10, 10);
  7779 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7780 var _thrown = undefined; try {
  7781   ctx.getImageData(10, 10, Infinity, 10);
  7782 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7783 var _thrown = undefined; try {
  7784   ctx.getImageData(10, 10, -Infinity, 10);
  7785 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7786 var _thrown = undefined; try {
  7787   ctx.getImageData(10, 10, NaN, 10);
  7788 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7789 var _thrown = undefined; try {
  7790   ctx.getImageData(10, 10, 10, Infinity);
  7791 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7792 var _thrown = undefined; try {
  7793   ctx.getImageData(10, 10, 10, -Infinity);
  7794 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7795 var _thrown = undefined; try {
  7796   ctx.getImageData(10, 10, 10, NaN);
  7797 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7798 var _thrown = undefined; try {
  7799   ctx.getImageData(Infinity, Infinity, 10, 10);
  7800 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7801 var _thrown = undefined; try {
  7802   ctx.getImageData(Infinity, Infinity, Infinity, 10);
  7803 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7804 var _thrown = undefined; try {
  7805   ctx.getImageData(Infinity, Infinity, Infinity, Infinity);
  7806 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7807 var _thrown = undefined; try {
  7808   ctx.getImageData(Infinity, Infinity, 10, Infinity);
  7809 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7810 var _thrown = undefined; try {
  7811   ctx.getImageData(Infinity, 10, Infinity, 10);
  7812 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7813 var _thrown = undefined; try {
  7814   ctx.getImageData(Infinity, 10, Infinity, Infinity);
  7815 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7816 var _thrown = undefined; try {
  7817   ctx.getImageData(Infinity, 10, 10, Infinity);
  7818 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7819 var _thrown = undefined; try {
  7820   ctx.getImageData(10, Infinity, Infinity, 10);
  7821 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7822 var _thrown = undefined; try {
  7823   ctx.getImageData(10, Infinity, Infinity, Infinity);
  7824 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7825 var _thrown = undefined; try {
  7826   ctx.getImageData(10, Infinity, 10, Infinity);
  7827 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7828 var _thrown = undefined; try {
  7829   ctx.getImageData(10, 10, Infinity, Infinity);
  7830 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7831 var _thrown = undefined; try {
  7832   ctx.getImageData({valueOf:function() Infinity}, 10, 10, 10);
  7833 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7834 var _thrown = undefined; try {
  7835   ctx.getImageData({valueOf:function() -Infinity}, 10, 10, 10);
  7836 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7837 var _thrown = undefined; try {
  7838   ctx.getImageData({valueOf:function() NaN}, 10, 10, 10);
  7839 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7840 var _thrown = undefined; try {
  7841   ctx.getImageData(10, {valueOf:function() Infinity}, 10, 10);
  7842 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7843 var _thrown = undefined; try {
  7844   ctx.getImageData(10, {valueOf:function() -Infinity}, 10, 10);
  7845 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7846 var _thrown = undefined; try {
  7847   ctx.getImageData(10, {valueOf:function() NaN}, 10, 10);
  7848 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7849 var _thrown = undefined; try {
  7850   ctx.getImageData(10, 10, {valueOf:function() Infinity}, 10);
  7851 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7852 var _thrown = undefined; try {
  7853   ctx.getImageData(10, 10, {valueOf:function() -Infinity}, 10);
  7854 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7855 var _thrown = undefined; try {
  7856   ctx.getImageData(10, 10, {valueOf:function() NaN}, 10);
  7857 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7858 var _thrown = undefined; try {
  7859   ctx.getImageData(10, 10, 10, {valueOf:function() Infinity});
  7860 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7861 var _thrown = undefined; try {
  7862   ctx.getImageData(10, 10, 10, {valueOf:function() -Infinity});
  7863 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7864 var _thrown = undefined; try {
  7865   ctx.getImageData(10, 10, 10, {valueOf:function() NaN});
  7866 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7867 var _thrown = undefined; try {
  7868   ctx.getImageData({valueOf:function() Infinity}, {valueOf:function() Infinity}, 10, 10);
  7869 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7870 var _thrown = undefined; try {
  7871   ctx.getImageData({valueOf:function() Infinity}, {valueOf:function() Infinity}, {valueOf:function() Infinity}, 10);
  7872 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7873 var _thrown = undefined; try {
  7874   ctx.getImageData({valueOf:function() Infinity}, {valueOf:function() Infinity}, {valueOf:function() Infinity}, {valueOf:function() Infinity});
  7875 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7876 var _thrown = undefined; try {
  7877   ctx.getImageData({valueOf:function() Infinity}, {valueOf:function() Infinity}, 10, {valueOf:function() Infinity});
  7878 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7879 var _thrown = undefined; try {
  7880   ctx.getImageData({valueOf:function() Infinity}, 10, {valueOf:function() Infinity}, 10);
  7881 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7882 var _thrown = undefined; try {
  7883   ctx.getImageData({valueOf:function() Infinity}, 10, {valueOf:function() Infinity}, {valueOf:function() Infinity});
  7884 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7885 var _thrown = undefined; try {
  7886   ctx.getImageData({valueOf:function() Infinity}, 10, 10, {valueOf:function() Infinity});
  7887 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7888 var _thrown = undefined; try {
  7889   ctx.getImageData(10, {valueOf:function() Infinity}, {valueOf:function() Infinity}, 10);
  7890 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7891 var _thrown = undefined; try {
  7892   ctx.getImageData(10, {valueOf:function() Infinity}, {valueOf:function() Infinity}, {valueOf:function() Infinity});
  7893 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7894 var _thrown = undefined; try {
  7895   ctx.getImageData(10, {valueOf:function() Infinity}, 10, {valueOf:function() Infinity});
  7896 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7897 var _thrown = undefined; try {
  7898   ctx.getImageData(10, 10, {valueOf:function() Infinity}, {valueOf:function() Infinity});
  7899 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  7903 </script>
  7905 <!-- [[[ test_2d.imageData.get.nonpremul.html ]]] -->
  7907 <p>Canvas test: 2d.imageData.get.nonpremul</p>
  7908 <!-- Testing: getImageData() returns non-premultiplied colours -->
  7909 <canvas id="c266" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7910 <script>
  7912 function test_2d_imageData_get_nonpremul() {
  7914 var canvas = document.getElementById('c266');
  7915 var ctx = canvas.getContext('2d');
  7917 ctx.fillStyle = 'rgba(255, 255, 255, 0.5)';
  7918 ctx.fillRect(0, 0, 100, 50);
  7919 var imgdata = ctx.getImageData(10, 10, 10, 10);
  7920 ok(imgdata.data[0] > 200, "imgdata.data[\""+(0)+"\"] > 200");
  7921 ok(imgdata.data[1] > 200, "imgdata.data[\""+(1)+"\"] > 200");
  7922 ok(imgdata.data[2] > 200, "imgdata.data[\""+(2)+"\"] > 200");
  7923 ok(imgdata.data[3] > 100, "imgdata.data[\""+(3)+"\"] > 100");
  7924 ok(imgdata.data[3] < 200, "imgdata.data[\""+(3)+"\"] < 200");
  7928 </script>
  7930 <!-- [[[ test_2d.imageData.get.order.alpha.html ]]] -->
  7932 <p>Canvas test: 2d.imageData.get.order.alpha</p>
  7933 <!-- Testing: getImageData() returns A in the fourth component -->
  7934 <canvas id="c267" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7935 <script>
  7937 function test_2d_imageData_get_order_alpha() {
  7939 var canvas = document.getElementById('c267');
  7940 var ctx = canvas.getContext('2d');
  7942 ctx.fillStyle = 'rgba(0, 0, 0, 0.5)';
  7943 ctx.fillRect(0, 0, 100, 50);
  7944 var imgdata = ctx.getImageData(0, 0, 10, 10);
  7945 ok(imgdata.data[3] < 200, "imgdata.data[\""+(3)+"\"] < 200");
  7946 ok(imgdata.data[3] > 100, "imgdata.data[\""+(3)+"\"] > 100");
  7950 </script>
  7952 <!-- [[[ test_2d.imageData.get.order.cols.html ]]] -->
  7954 <p>Canvas test: 2d.imageData.get.order.cols</p>
  7955 <!-- Testing: getImageData() returns leftmost columns first -->
  7956 <canvas id="c268" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7957 <script>
  7959 function test_2d_imageData_get_order_cols() {
  7961 var canvas = document.getElementById('c268');
  7962 var ctx = canvas.getContext('2d');
  7964 ctx.fillStyle = '#fff';
  7965 ctx.fillRect(0, 0, 100, 50);
  7966 ctx.fillStyle = '#000';
  7967 ctx.fillRect(0, 0, 2, 50);
  7968 var imgdata = ctx.getImageData(0, 0, 10, 10);
  7969 ok(imgdata.data[0] === 0, "imgdata.data[\""+(0)+"\"] === 0");
  7970 ok(imgdata.data[Math.round(imgdata.width/2*4)] === 255, "imgdata.data[Math.round(imgdata.width/2*4)] === 255");
  7971 ok(imgdata.data[Math.round((imgdata.height/2)*imgdata.width*4)] === 0, "imgdata.data[Math.round((imgdata.height/2)*imgdata.width*4)] === 0");
  7975 </script>
  7977 <!-- [[[ test_2d.imageData.get.order.rgb.html ]]] -->
  7979 <p>Canvas test: 2d.imageData.get.order.rgb</p>
  7980 <!-- Testing: getImageData() returns R then G then B -->
  7981 <canvas id="c269" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  7982 <script>
  7984 function test_2d_imageData_get_order_rgb() {
  7986 var canvas = document.getElementById('c269');
  7987 var ctx = canvas.getContext('2d');
  7989 ctx.fillStyle = '#48c';
  7990 ctx.fillRect(0, 0, 100, 50);
  7991 var imgdata = ctx.getImageData(0, 0, 10, 10);
  7992 ok(imgdata.data[0] === 0x44, "imgdata.data[\""+(0)+"\"] === 0x44");
  7993 ok(imgdata.data[1] === 0x88, "imgdata.data[\""+(1)+"\"] === 0x88");
  7994 ok(imgdata.data[2] === 0xCC, "imgdata.data[\""+(2)+"\"] === 0xCC");
  7995 ok(imgdata.data[3] === 255, "imgdata.data[\""+(3)+"\"] === 255");
  7999 </script>
  8001 <!-- [[[ test_2d.imageData.get.order.rows.html ]]] -->
  8003 <p>Canvas test: 2d.imageData.get.order.rows</p>
  8004 <!-- Testing: getImageData() returns topmost rows first -->
  8005 <canvas id="c270" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8006 <script>
  8008 function test_2d_imageData_get_order_rows() {
  8010 var canvas = document.getElementById('c270');
  8011 var ctx = canvas.getContext('2d');
  8013 ctx.fillStyle = '#fff';
  8014 ctx.fillRect(0, 0, 100, 50);
  8015 ctx.fillStyle = '#000';
  8016 ctx.fillRect(0, 0, 100, 2);
  8017 var imgdata = ctx.getImageData(0, 0, 10, 10);
  8018 ok(imgdata.data[0] === 0, "imgdata.data[\""+(0)+"\"] === 0");
  8019 ok(imgdata.data[Math.floor(imgdata.width/2*4)] === 0, "imgdata.data[Math.floor(imgdata.width/2*4)] === 0");
  8020 ok(imgdata.data[(imgdata.height/2)*imgdata.width*4] === 255, "imgdata.data[(imgdata.height/2)*imgdata.width*4] === 255");
  8024 </script>
  8026 <!-- [[[ test_2d.imageData.get.range.html ]]] -->
  8028 <p>Canvas test: 2d.imageData.get.range</p>
  8029 <!-- Testing: getImageData() returns values in the range [0, 255] -->
  8030 <canvas id="c271" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8031 <script>
  8033 function test_2d_imageData_get_range() {
  8035 var canvas = document.getElementById('c271');
  8036 var ctx = canvas.getContext('2d');
  8038 ctx.fillStyle = '#000';
  8039 ctx.fillRect(0, 0, 100, 50);
  8040 ctx.fillStyle = '#fff';
  8041 ctx.fillRect(20, 10, 60, 10);
  8042 var imgdata1 = ctx.getImageData(10, 5, 1, 1);
  8043 ok(imgdata1.data[0] === 0, "imgdata1.data[\""+(0)+"\"] === 0");
  8044 var imgdata2 = ctx.getImageData(30, 15, 1, 1);
  8045 ok(imgdata2.data[0] === 255, "imgdata2.data[\""+(0)+"\"] === 255");
  8049 </script>
  8051 <!-- [[[ test_2d.imageData.get.source.negative.html ]]] -->
  8053 <p>Canvas test: 2d.imageData.get.source.negative</p>
  8054 <!-- Testing: getImageData() works with negative width and height -->
  8055 <canvas id="c272" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8056 <script>
  8058 function test_2d_imageData_get_source_negative() {
  8060 var canvas = document.getElementById('c272');
  8061 var ctx = canvas.getContext('2d');
  8063 ctx.fillStyle = '#000';
  8064 ctx.fillRect(0, 0, 100, 50);
  8065 ctx.fillStyle = '#fff';
  8066 ctx.fillRect(20, 10, 60, 10);
  8068 var imgdata1 = ctx.getImageData(85, 25, -10, -10);
  8069 ok(imgdata1.data[0] === 255, "imgdata1.data[\""+(0)+"\"] === 255");
  8070 ok(imgdata1.data[1] === 255, "imgdata1.data[\""+(1)+"\"] === 255");
  8071 ok(imgdata1.data[2] === 255, "imgdata1.data[\""+(2)+"\"] === 255");
  8072 ok(imgdata1.data[3] === 255, "imgdata1.data[\""+(3)+"\"] === 255");
  8073 ok(imgdata1.data[imgdata1.data.length-4+0] === 0, "imgdata1.data[imgdata1.data.length-4+0] === 0");
  8074 ok(imgdata1.data[imgdata1.data.length-4+1] === 0, "imgdata1.data[imgdata1.data.length-4+1] === 0");
  8075 ok(imgdata1.data[imgdata1.data.length-4+2] === 0, "imgdata1.data[imgdata1.data.length-4+2] === 0");
  8076 ok(imgdata1.data[imgdata1.data.length-4+3] === 255, "imgdata1.data[imgdata1.data.length-4+3] === 255");
  8078 var imgdata2 = ctx.getImageData(0, 0, -1, -1);
  8079 ok(imgdata2.data[0] === 0, "imgdata2.data[\""+(0)+"\"] === 0");
  8080 ok(imgdata2.data[1] === 0, "imgdata2.data[\""+(1)+"\"] === 0");
  8081 ok(imgdata2.data[2] === 0, "imgdata2.data[\""+(2)+"\"] === 0");
  8082 ok(imgdata2.data[3] === 0, "imgdata2.data[\""+(3)+"\"] === 0");
  8086 </script>
  8088 <!-- [[[ test_2d.imageData.get.source.outside.html ]]] -->
  8090 <p>Canvas test: 2d.imageData.get.source.outside</p>
  8091 <!-- Testing: getImageData() returns transparent black outside the canvas -->
  8092 <canvas id="c273" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8093 <script>
  8095 function test_2d_imageData_get_source_outside() {
  8097 var canvas = document.getElementById('c273');
  8098 var ctx = canvas.getContext('2d');
  8100 var _thrown_outer = false;
  8101 try {
  8103 ctx.fillStyle = '#08f';
  8104 ctx.fillRect(0, 0, 100, 50);
  8106 var imgdata1 = ctx.getImageData(-10, 5, 1, 1);
  8107 ok(imgdata1.data[0] === 0, "imgdata1.data[\""+(0)+"\"] === 0");
  8108 ok(imgdata1.data[1] === 0, "imgdata1.data[\""+(1)+"\"] === 0");
  8109 ok(imgdata1.data[2] === 0, "imgdata1.data[\""+(2)+"\"] === 0");
  8110 ok(imgdata1.data[3] === 0, "imgdata1.data[\""+(3)+"\"] === 0");
  8112 var imgdata2 = ctx.getImageData(10, -5, 1, 1);
  8113 ok(imgdata2.data[0] === 0, "imgdata2.data[\""+(0)+"\"] === 0");
  8114 ok(imgdata2.data[1] === 0, "imgdata2.data[\""+(1)+"\"] === 0");
  8115 ok(imgdata2.data[2] === 0, "imgdata2.data[\""+(2)+"\"] === 0");
  8116 ok(imgdata2.data[3] === 0, "imgdata2.data[\""+(3)+"\"] === 0");
  8118 var imgdata3 = ctx.getImageData(200, 5, 1, 1);
  8119 ok(imgdata3.data[0] === 0, "imgdata3.data[\""+(0)+"\"] === 0");
  8120 ok(imgdata3.data[1] === 0, "imgdata3.data[\""+(1)+"\"] === 0");
  8121 ok(imgdata3.data[2] === 0, "imgdata3.data[\""+(2)+"\"] === 0");
  8122 ok(imgdata3.data[3] === 0, "imgdata3.data[\""+(3)+"\"] === 0");
  8124 var imgdata4 = ctx.getImageData(10, 60, 1, 1);
  8125 ok(imgdata4.data[0] === 0, "imgdata4.data[\""+(0)+"\"] === 0");
  8126 ok(imgdata4.data[1] === 0, "imgdata4.data[\""+(1)+"\"] === 0");
  8127 ok(imgdata4.data[2] === 0, "imgdata4.data[\""+(2)+"\"] === 0");
  8128 ok(imgdata4.data[3] === 0, "imgdata4.data[\""+(3)+"\"] === 0");
  8130 var imgdata5 = ctx.getImageData(100, 10, 1, 1);
  8131 ok(imgdata5.data[0] === 0, "imgdata5.data[\""+(0)+"\"] === 0");
  8132 ok(imgdata5.data[1] === 0, "imgdata5.data[\""+(1)+"\"] === 0");
  8133 ok(imgdata5.data[2] === 0, "imgdata5.data[\""+(2)+"\"] === 0");
  8134 ok(imgdata5.data[3] === 0, "imgdata5.data[\""+(3)+"\"] === 0");
  8136 var imgdata6 = ctx.getImageData(0, 10, 1, 1);
  8137 ok(imgdata6.data[0] === 0, "imgdata6.data[\""+(0)+"\"] === 0");
  8138 ok(imgdata6.data[1] === 136, "imgdata6.data[\""+(1)+"\"] === 136");
  8139 ok(imgdata6.data[2] === 255, "imgdata6.data[\""+(2)+"\"] === 255");
  8140 ok(imgdata6.data[3] === 255, "imgdata6.data[\""+(3)+"\"] === 255");
  8142 var imgdata7 = ctx.getImageData(-10, 10, 20, 20);
  8143 ok(imgdata7.data[ 0*4+0] === 0, "imgdata7.data[ 0*4+0] === 0");
  8144 ok(imgdata7.data[ 0*4+1] === 0, "imgdata7.data[ 0*4+1] === 0");
  8145 ok(imgdata7.data[ 0*4+2] === 0, "imgdata7.data[ 0*4+2] === 0");
  8146 ok(imgdata7.data[ 0*4+3] === 0, "imgdata7.data[ 0*4+3] === 0");
  8147 ok(imgdata7.data[ 9*4+0] === 0, "imgdata7.data[ 9*4+0] === 0");
  8148 ok(imgdata7.data[ 9*4+1] === 0, "imgdata7.data[ 9*4+1] === 0");
  8149 ok(imgdata7.data[ 9*4+2] === 0, "imgdata7.data[ 9*4+2] === 0");
  8150 ok(imgdata7.data[ 9*4+3] === 0, "imgdata7.data[ 9*4+3] === 0");
  8151 ok(imgdata7.data[10*4+0] === 0, "imgdata7.data[10*4+0] === 0");
  8152 ok(imgdata7.data[10*4+1] === 136, "imgdata7.data[10*4+1] === 136");
  8153 ok(imgdata7.data[10*4+2] === 255, "imgdata7.data[10*4+2] === 255");
  8154 ok(imgdata7.data[10*4+3] === 255, "imgdata7.data[10*4+3] === 255");
  8155 ok(imgdata7.data[19*4+0] === 0, "imgdata7.data[19*4+0] === 0");
  8156 ok(imgdata7.data[19*4+1] === 136, "imgdata7.data[19*4+1] === 136");
  8157 ok(imgdata7.data[19*4+2] === 255, "imgdata7.data[19*4+2] === 255");
  8158 ok(imgdata7.data[19*4+3] === 255, "imgdata7.data[19*4+3] === 255");
  8159 ok(imgdata7.data[20*4+0] === 0, "imgdata7.data[20*4+0] === 0");
  8160 ok(imgdata7.data[20*4+1] === 0, "imgdata7.data[20*4+1] === 0");
  8161 ok(imgdata7.data[20*4+2] === 0, "imgdata7.data[20*4+2] === 0");
  8162 ok(imgdata7.data[20*4+3] === 0, "imgdata7.data[20*4+3] === 0");
  8164 } catch (e) {
  8165     _thrown_outer = true;
  8167 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
  8171 </script>
  8173 <!-- [[[ test_2d.imageData.get.source.size.html ]]] -->
  8175 <p>Canvas test: 2d.imageData.get.source.size</p>
  8176 <!-- Testing: getImageData() returns bigger ImageData for bigger source rectangle -->
  8177 <canvas id="c274" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8178 <script>
  8180 function test_2d_imageData_get_source_size() {
  8182 var canvas = document.getElementById('c274');
  8183 var ctx = canvas.getContext('2d');
  8185 var imgdata1 = ctx.getImageData(0, 0, 10, 10);
  8186 var imgdata2 = ctx.getImageData(0, 0, 20, 20);
  8187 ok(imgdata2.width > imgdata1.width, "imgdata2.width > imgdata1.width");
  8188 ok(imgdata2.height > imgdata1.height, "imgdata2.height > imgdata1.height");
  8192 </script>
  8194 <!-- [[[ test_2d.imageData.get.tiny.html ]]] -->
  8196 <p>Canvas test: 2d.imageData.get.tiny</p>
  8197 <!-- Testing: getImageData() works for sizes smaller than one pixel -->
  8198 <canvas id="c275" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8199 <script>
  8201 function test_2d_imageData_get_tiny() {
  8203 var canvas = document.getElementById('c275');
  8204 var ctx = canvas.getContext('2d');
  8206 var _thrown_outer = false;
  8207 try {
  8209 var imgdata = ctx.getImageData(0, 0, 0.0001, 0.0001);
  8210 ok(imgdata.data.length == imgdata.width*imgdata.height*4, "imgdata.data.length == imgdata.width*imgdata.height*4");
  8211 ok(imgdata.width == 1, "imgdata.width == 1");
  8212 ok(imgdata.height == 1, "imgdata.height == 1");
  8214 } catch (e) {
  8215     _thrown_outer = true;
  8217 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
  8221 </script>
  8223 <!-- [[[ test_2d.imageData.get.type.html ]]] -->
  8225 <p>Canvas test: 2d.imageData.get.type</p>
  8226 <!-- Testing: getImageData() returns an ImageData object containing a Uint8ClampedArray object -->
  8227 <canvas id="c276" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8228 <script>
  8230 function test_2d_imageData_get_type() {
  8232 var canvas = document.getElementById('c276');
  8233 var ctx = canvas.getContext('2d');
  8235 ok(window.ImageData !== undefined, "window.ImageData !== undefined");
  8236 ok(window.Uint8ClampedArray !== undefined, "window.Uint8ClampedArray !== undefined");
  8237 window.ImageData.prototype.thisImplementsImageData = true;
  8238 window.Uint8ClampedArray.prototype.thisImplementsUint8ClampedArray = true;
  8239 var imgdata = ctx.getImageData(0, 0, 1, 1);
  8240 ok(imgdata.thisImplementsImageData, "imgdata.thisImplementsImageData");
  8241 ok(imgdata.data.thisImplementsUint8ClampedArray, "imgdata.data.thisImplementsUint8ClampedArray");
  8245 </script>
  8247 <!-- [[[ test_2d.imageData.get.unaffected.html ]]] -->
  8249 <p>Canvas test: 2d.imageData.get.unaffected</p>
  8250 <!-- Testing: getImageData() is not affected by context state -->
  8251 <canvas id="c277" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8252 <script>
  8255 function test_2d_imageData_get_unaffected() {
  8257 var canvas = document.getElementById('c277');
  8258 var ctx = canvas.getContext('2d');
  8260 ctx.fillStyle = '#0f0';
  8261 ctx.fillRect(0, 0, 50, 50)
  8262 ctx.fillStyle = '#f00';
  8263 ctx.fillRect(50, 0, 50, 50)
  8264 ctx.save();
  8265 ctx.translate(50, 0);
  8266 ctx.globalAlpha = 0.1;
  8267 ctx.globalCompositeOperation = 'destination-atop';
  8268 ctx.shadowColor = '#f00';
  8269 ctx.rect(0, 0, 5, 5);
  8270 ctx.clip();
  8271 var imgdata = ctx.getImageData(0, 0, 50, 50);
  8272 ctx.restore();
  8273 ctx.putImageData(imgdata, 50, 0);
  8274 isPixel(ctx, 25,25, 0,255,0,255, 2);
  8275 isPixel(ctx, 75,25, 0,255,0,255, 2);
  8279 </script>
  8281 <!-- [[[ test_2d.imageData.get.zero.html ]]] -->
  8283 <p>Canvas test: 2d.imageData.get.zero</p>
  8284 <!-- Testing: getImageData() throws INDEX_SIZE_ERR if size is zero -->
  8285 <canvas id="c278" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8286 <script>
  8288 function test_2d_imageData_get_zero() {
  8290 var canvas = document.getElementById('c278');
  8291 var ctx = canvas.getContext('2d');
  8293 var _thrown = undefined; try {
  8294   ctx.getImageData(1, 1, 10, 0);
  8295 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
  8296 var _thrown = undefined; try {
  8297   ctx.getImageData(1, 1, 0, 10);
  8298 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
  8299 var _thrown = undefined; try {
  8300   ctx.getImageData(1, 1, 0, 0);
  8301 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
  8305 </script>
  8307 <!-- [[[ test_2d.imageData.object.clamp.html ]]] -->
  8309 <p>Canvas test: 2d.imageData.object.clamp</p>
  8310 <!-- Testing: ImageData.data clamps numbers to [0, 255] -->
  8311 <canvas id="c279" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8312 <script>
  8314 function test_2d_imageData_object_clamp() {
  8316 var canvas = document.getElementById('c279');
  8317 var ctx = canvas.getContext('2d');
  8319 var imgdata = ctx.getImageData(0, 0, 10, 10);
  8321 imgdata.data[0] = 100;
  8322 imgdata.data[0] = 300;
  8323 ok(imgdata.data[0] === 255, "imgdata.data[\""+(0)+"\"] === 255");
  8324 imgdata.data[0] = 100;
  8325 imgdata.data[0] = -100;
  8326 ok(imgdata.data[0] === 0, "imgdata.data[\""+(0)+"\"] === 0");
  8328 imgdata.data[0] = 100;
  8329 imgdata.data[0] = 200+Math.pow(2, 32);
  8330 ok(imgdata.data[0] === 255, "imgdata.data[\""+(0)+"\"] === 255");
  8331 imgdata.data[0] = 100;
  8332 imgdata.data[0] = -200-Math.pow(2, 32);
  8333 ok(imgdata.data[0] === 0, "imgdata.data[\""+(0)+"\"] === 0");
  8335 imgdata.data[0] = 100;
  8336 imgdata.data[0] = Math.pow(10, 39);
  8337 ok(imgdata.data[0] === 255, "imgdata.data[\""+(0)+"\"] === 255");
  8338 imgdata.data[0] = 100;
  8339 imgdata.data[0] = -Math.pow(10, 39);
  8340 ok(imgdata.data[0] === 0, "imgdata.data[\""+(0)+"\"] === 0");
  8342 imgdata.data[0] = 100;
  8343 imgdata.data[0] = -Infinity;
  8344 ok(imgdata.data[0] === 0, "imgdata.data[\""+(0)+"\"] === 0");
  8345 imgdata.data[0] = 100;
  8346 imgdata.data[0] = Infinity;
  8347 ok(imgdata.data[0] === 255, "imgdata.data[\""+(0)+"\"] === 255");
  8351 </script>
  8353 <!-- [[[ test_2d.imageData.object.ctor.html ]]] -->
  8355 <p>Canvas test: 2d.imageData.object.ctor</p>
  8356 <!-- Testing: ImageData does not have a usable constructor -->
  8357 <canvas id="c280" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8358 <script>
  8360 function test_2d_imageData_object_ctor() {
  8362 var canvas = document.getElementById('c280');
  8363 var ctx = canvas.getContext('2d');
  8365 ok(window.ImageData !== undefined, "window.ImageData !== undefined");
  8367 var _thrown_outer = false;
  8368 try {
  8370 new window.ImageData(1,1);
  8372 } catch (e) {
  8373     _thrown_outer = true;
  8375 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
  8379 </script>
  8381 <!-- [[[ test_2d.imageData.object.nan.html ]]] -->
  8383 <p>Canvas test: 2d.imageData.object.nan</p>
  8384 <!-- Testing: ImageData.data converts NaN to 0 -->
  8385 <canvas id="c281" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8386 <script>
  8388 function test_2d_imageData_object_nan() {
  8390 var canvas = document.getElementById('c281');
  8391 var ctx = canvas.getContext('2d');
  8393 var imgdata = ctx.getImageData(0, 0, 10, 10);
  8394 imgdata.data[0] = 100;
  8395 imgdata.data[0] = NaN;
  8396 ok(imgdata.data[0] === 0, "imgdata.data[\""+(0)+"\"] === 0");
  8397 imgdata.data[0] = 100;
  8398 imgdata.data[0] = "cheese";
  8399 ok(imgdata.data[0] === 0, "imgdata.data[\""+(0)+"\"] === 0");
  8403 </script>
  8405 <!-- [[[ test_2d.imageData.object.properties.html ]]] -->
  8407 <p>Canvas test: 2d.imageData.object.properties</p>
  8408 <!-- Testing: ImageData objects have the right properties -->
  8409 <canvas id="c282" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8410 <script>
  8412 function test_2d_imageData_object_properties() {
  8414 var canvas = document.getElementById('c282');
  8415 var ctx = canvas.getContext('2d');
  8417 var imgdata = ctx.getImageData(0, 0, 10, 10);
  8418 ok(typeof(imgdata.width) == 'number', "typeof(imgdata.width) == 'number'");
  8419 ok(typeof(imgdata.height) == 'number', "typeof(imgdata.height) == 'number'");
  8420 ok(typeof(imgdata.data) == 'object', "typeof(imgdata.data) == 'object'");
  8424 </script>
  8426 <!-- [[[ test_2d.imageData.object.readonly.html ]]] -->
  8428 <p>Canvas test: 2d.imageData.object.readonly</p>
  8429 <!-- Testing: ImageData objects properties are read-only -->
  8430 <canvas id="c283" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8431 <script>
  8433 function test_2d_imageData_object_readonly() {
  8435 var canvas = document.getElementById('c283');
  8436 var ctx = canvas.getContext('2d');
  8438 var imgdata = ctx.getImageData(0, 0, 10, 10);
  8439 var w = imgdata.width;
  8440 var h = imgdata.height;
  8441 var d = imgdata.data;
  8442 imgdata.width = 123;
  8443 imgdata.height = 123;
  8444 imgdata.data = [100,100,100,100];
  8445 ok(imgdata.width === w, "imgdata.width === w");
  8446 ok(imgdata.height === h, "imgdata.height === h");
  8447 ok(imgdata.data === d, "imgdata.data === d");
  8448 ok(imgdata.data[0] === 0, "imgdata.data[\""+(0)+"\"] === 0");
  8449 ok(imgdata.data[1] === 0, "imgdata.data[\""+(1)+"\"] === 0");
  8450 ok(imgdata.data[2] === 0, "imgdata.data[\""+(2)+"\"] === 0");
  8451 ok(imgdata.data[3] === 0, "imgdata.data[\""+(3)+"\"] === 0");
  8455 </script>
  8457 <!-- [[[ test_2d.imageData.object.round.html ]]] -->
  8459 <p>Canvas test: 2d.imageData.object.round</p>
  8460 <!-- Testing: ImageData.data rounds numbers with convertToIntegerTiesToEven -->
  8461 <canvas id="c284" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8462 <script>
  8464 function test_2d_imageData_object_round() {
  8466 var canvas = document.getElementById('c284');
  8467 var ctx = canvas.getContext('2d');
  8469 var imgdata = ctx.getImageData(0, 0, 10, 10);
  8470 imgdata.data[0] = 0.499;
  8471 ok(imgdata.data[0] === 0, "imgdata.data[\""+(0)+"\"] === 0");
  8472 imgdata.data[0] = 0.5;
  8473 ok(imgdata.data[0] === 0, "imgdata.data[\""+(0)+"\"] === 0");
  8474 imgdata.data[0] = 0.501;
  8475 ok(imgdata.data[0] === 1, "imgdata.data[\""+(0)+"\"] === 1");
  8476 imgdata.data[0] = 1.499;
  8477 ok(imgdata.data[0] === 1, "imgdata.data[\""+(0)+"\"] === 1");
  8478 imgdata.data[0] = 1.5;
  8479 ok(imgdata.data[0] === 2, "imgdata.data[\""+(0)+"\"] === 2");
  8480 imgdata.data[0] = 1.501;
  8481 ok(imgdata.data[0] === 2, "imgdata.data[\""+(0)+"\"] === 2");
  8482 imgdata.data[0] = 2.5;
  8483 ok(imgdata.data[0] === 2, "imgdata.data[\""+(0)+"\"] === 2");
  8484 imgdata.data[0] = 3.5;
  8485 ok(imgdata.data[0] === 4, "imgdata.data[\""+(0)+"\"] === 4");
  8486 imgdata.data[0] = 252.5;
  8487 ok(imgdata.data[0] === 252, "imgdata.data[\""+(0)+"\"] === 252");
  8488 imgdata.data[0] = 253.5;
  8489 ok(imgdata.data[0] === 254, "imgdata.data[\""+(0)+"\"] === 254");
  8490 imgdata.data[0] = 254.5;
  8491 ok(imgdata.data[0] === 254, "imgdata.data[\""+(0)+"\"] === 254");
  8495 </script>
  8497 <!-- [[[ test_2d.imageData.object.set.html ]]] -->
  8499 <p>Canvas test: 2d.imageData.object.set</p>
  8500 <!-- Testing: ImageData.data can be modified -->
  8501 <canvas id="c285" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8502 <script>
  8504 function test_2d_imageData_object_set() {
  8506 var canvas = document.getElementById('c285');
  8507 var ctx = canvas.getContext('2d');
  8509 var imgdata = ctx.getImageData(0, 0, 10, 10);
  8510 imgdata.data[0] = 100;
  8511 ok(imgdata.data[0] === 100, "imgdata.data[\""+(0)+"\"] === 100");
  8512 imgdata.data[0] = 200;
  8513 ok(imgdata.data[0] === 200, "imgdata.data[\""+(0)+"\"] === 200");
  8517 </script>
  8519 <!-- [[[ test_2d.imageData.object.string.html ]]] -->
  8521 <p>Canvas test: 2d.imageData.object.string</p>
  8522 <!-- Testing: ImageData.data converts strings to numbers with ToNumber -->
  8523 <canvas id="c286" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8524 <script>
  8526 function test_2d_imageData_object_string() {
  8528 var canvas = document.getElementById('c286');
  8529 var ctx = canvas.getContext('2d');
  8531 var imgdata = ctx.getImageData(0, 0, 10, 10);
  8532 imgdata.data[0] = 100;
  8533 imgdata.data[0] = "110";
  8534 ok(imgdata.data[0] === 110, "imgdata.data[\""+(0)+"\"] === 110");
  8535 imgdata.data[0] = 100;
  8536 imgdata.data[0] = "0x78";
  8537 ok(imgdata.data[0] === 120, "imgdata.data[\""+(0)+"\"] === 120");
  8538 imgdata.data[0] = 100;
  8539 imgdata.data[0] = " +130e0 ";
  8540 ok(imgdata.data[0] === 130, "imgdata.data[\""+(0)+"\"] === 130");
  8544 </script>
  8546 <!-- [[[ test_2d.imageData.object.undefined.html ]]] -->
  8548 <p>Canvas test: 2d.imageData.object.undefined</p>
  8549 <!-- Testing: ImageData.data converts undefined to 0 -->
  8550 <canvas id="c287" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8551 <script>
  8553 function test_2d_imageData_object_undefined() {
  8555 var canvas = document.getElementById('c287');
  8556 var ctx = canvas.getContext('2d');
  8558 var imgdata = ctx.getImageData(0, 0, 10, 10);
  8559 imgdata.data[0] = 100;
  8560 imgdata.data[0] = undefined;
  8561 ok(imgdata.data[0] === 0, "imgdata.data[\""+(0)+"\"] === 0");
  8565 </script>
  8567 <!-- [[[ test_2d.imageData.put.alpha.html ]]] -->
  8569 <p>Canvas test: 2d.imageData.put.alpha</p>
  8570 <!-- Testing: putImageData() puts non-solid image data correctly -->
  8571 <canvas id="c288" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8572 <script>
  8575 function test_2d_imageData_put_alpha() {
  8577 var canvas = document.getElementById('c288');
  8578 var ctx = canvas.getContext('2d');
  8580 ctx.fillStyle = 'rgba(0, 255, 0, 0.25)';
  8581 ctx.fillRect(0, 0, 100, 50)
  8582 var imgdata = ctx.getImageData(0, 0, 100, 50);
  8583 ctx.fillStyle = '#f00';
  8584 ctx.fillRect(0, 0, 100, 50)
  8585 ctx.putImageData(imgdata, 0, 0);
  8586 isPixel(ctx, 50,25, 0,255,0,64, 2);
  8590 </script>
  8592 <!-- [[[ test_2d.imageData.put.basic.html ]]] -->
  8594 <p>Canvas test: 2d.imageData.put.basic</p>
  8595 <!-- Testing: putImageData() puts image data from getImageData() onto the canvas -->
  8596 <canvas id="c289" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8597 <script>
  8600 function test_2d_imageData_put_basic() {
  8602 var canvas = document.getElementById('c289');
  8603 var ctx = canvas.getContext('2d');
  8605 ctx.fillStyle = '#0f0';
  8606 ctx.fillRect(0, 0, 100, 50)
  8607 var imgdata = ctx.getImageData(0, 0, 100, 50);
  8608 ctx.fillStyle = '#f00';
  8609 ctx.fillRect(0, 0, 100, 50)
  8610 ctx.putImageData(imgdata, 0, 0);
  8611 isPixel(ctx, 50,25, 0,255,0,255, 2);
  8615 </script>
  8617 <!-- [[[ test_2d.imageData.put.clip.html ]]] -->
  8619 <p>Canvas test: 2d.imageData.put.clip - bug 433397</p>
  8620 <!-- Testing: putImageData() is not affected by clipping regions -->
  8621 <canvas id="c290" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8622 <script>
  8626 function test_2d_imageData_put_clip() {
  8628 var canvas = document.getElementById('c290');
  8629 var ctx = canvas.getContext('2d');
  8631 ctx.fillStyle = '#0f0';
  8632 ctx.fillRect(0, 0, 100, 50)
  8633 var imgdata = ctx.getImageData(0, 0, 100, 50);
  8634 ctx.fillStyle = '#f00';
  8635 ctx.fillRect(0, 0, 100, 50)
  8636 ctx.beginPath();
  8637 ctx.rect(0, 0, 50, 50);
  8638 ctx.clip();
  8639 ctx.putImageData(imgdata, 0, 0);
  8640 isPixel(ctx, 25,25, 0,255,0,255, 2);
  8641 isPixel(ctx, 75,25, 0,255,0,255, 2);
  8645 </script>
  8647 <!-- [[[ test_2d.imageData.put.created.html ]]] -->
  8649 <p>Canvas test: 2d.imageData.put.created - bug 433004</p>
  8650 <!-- Testing: putImageData() puts image data from createImageData() onto the canvas -->
  8651 <canvas id="c291" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8652 <script>
  8655 function test_2d_imageData_put_created() {
  8657 var canvas = document.getElementById('c291');
  8658 var ctx = canvas.getContext('2d');
  8660 var imgdata = ctx.createImageData(100, 50);
  8661 for (var i = 0; i < imgdata.data.length; i += 4) {
  8662     imgdata.data[i] = 0;
  8663     imgdata.data[i+1] = 255;
  8664     imgdata.data[i+2] = 0;
  8665     imgdata.data[i+3] = 255;
  8667 ctx.fillStyle = '#f00';
  8668 ctx.fillRect(0, 0, 100, 50)
  8669 ctx.putImageData(imgdata, 0, 0);
  8670 isPixel(ctx, 50,25, 0,255,0,255, 2);
  8674 </script>
  8676 <!-- [[[ test_2d.imageData.put.cross.html ]]] -->
  8678 <p>Canvas test: 2d.imageData.put.cross</p>
  8679 <!-- Testing: putImageData() accepts image data got from a different canvas -->
  8680 <canvas id="c292" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8681 <script>
  8684 function test_2d_imageData_put_cross() {
  8686 var canvas = document.getElementById('c292');
  8687 var ctx = canvas.getContext('2d');
  8689 var canvas2 = document.createElement('canvas');
  8690 var ctx2 = canvas2.getContext('2d');
  8691 ctx2.fillStyle = '#0f0';
  8692 ctx2.fillRect(0, 0, 100, 50)
  8693 var imgdata = ctx2.getImageData(0, 0, 100, 50);
  8694 ctx.fillStyle = '#f00';
  8695 ctx.fillRect(0, 0, 100, 50)
  8696 ctx.putImageData(imgdata, 0, 0);
  8697 isPixel(ctx, 50,25, 0,255,0,255, 2);
  8701 </script>
  8703 <!-- [[[ test_2d.imageData.put.dirty.negative.html ]]] -->
  8705 <p>Canvas test: 2d.imageData.put.dirty.negative</p>
  8706 <!-- Testing: putImageData() handles negative-sized dirty rectangles correctly -->
  8707 <canvas id="c293" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8708 <script>
  8711 function test_2d_imageData_put_dirty_negative() {
  8713 var canvas = document.getElementById('c293');
  8714 var ctx = canvas.getContext('2d');
  8716 var _thrown_outer = false;
  8717 try {
  8719 ctx.fillStyle = '#f00';
  8720 ctx.fillRect(0, 0, 100, 50)
  8721 ctx.fillStyle = '#0f0';
  8722 ctx.fillRect(0, 0, 20, 20)
  8724 var imgdata = ctx.getImageData(0, 0, 100, 50);
  8726 ctx.fillStyle = '#0f0';
  8727 ctx.fillRect(0, 0, 100, 50)
  8728 ctx.fillStyle = '#f00';
  8729 ctx.fillRect(40, 20, 20, 20)
  8730 ctx.putImageData(imgdata, 40, 20, 20, 20, -20, -20);
  8732 isPixel(ctx, 50,25, 0,255,0,255, 2);
  8733 isPixel(ctx, 35,25, 0,255,0,255, 2);
  8734 isPixel(ctx, 65,25, 0,255,0,255, 2);
  8735 isPixel(ctx, 50,15, 0,255,0,255, 2);
  8736 isPixel(ctx, 50,45, 0,255,0,255, 2);
  8738 } catch (e) {
  8739     _thrown_outer = true;
  8741 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
  8745 </script>
  8747 <!-- [[[ test_2d.imageData.put.dirty.outside.html ]]] -->
  8749 <p>Canvas test: 2d.imageData.put.dirty.outside</p>
  8750 <!-- Testing: putImageData() handles dirty rectangles outside the canvas correctly -->
  8751 <canvas id="c294" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8752 <script>
  8755 function test_2d_imageData_put_dirty_outside() {
  8757 var canvas = document.getElementById('c294');
  8758 var ctx = canvas.getContext('2d');
  8760 var _thrown_outer = false;
  8761 try {
  8763 ctx.fillStyle = '#f00';
  8764 ctx.fillRect(0, 0, 100, 50)
  8766 var imgdata = ctx.getImageData(0, 0, 100, 50);
  8768 ctx.fillStyle = '#0f0';
  8769 ctx.fillRect(0, 0, 100, 50)
  8771 ctx.putImageData(imgdata, 100, 20, 20, 20, -20, -20);
  8772 ctx.putImageData(imgdata, 200, 200, 0, 0, 100, 50);
  8773 ctx.putImageData(imgdata, 40, 20, -30, -20, 30, 20);
  8774 ctx.putImageData(imgdata, -30, 20, 0, 0, 30, 20);
  8776 isPixel(ctx, 50,25, 0,255,0,255, 2);
  8777 isPixel(ctx, 98,15, 0,255,0,255, 2);
  8778 isPixel(ctx, 98,25, 0,255,0,255, 2);
  8779 isPixel(ctx, 98,45, 0,255,0,255, 2);
  8780 isPixel(ctx, 1,5, 0,255,0,255, 2);
  8781 isPixel(ctx, 1,25, 0,255,0,255, 2);
  8782 isPixel(ctx, 1,45, 0,255,0,255, 2);
  8784 } catch (e) {
  8785     _thrown_outer = true;
  8787 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
  8791 </script>
  8793 <!-- [[[ test_2d.imageData.put.dirty.rect1.html ]]] -->
  8795 <p>Canvas test: 2d.imageData.put.dirty.rect1</p>
  8796 <!-- Testing: putImageData() only modifies areas inside the dirty rectangle, using width and height -->
  8797 <canvas id="c295" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8798 <script>
  8801 function test_2d_imageData_put_dirty_rect1() {
  8803 var canvas = document.getElementById('c295');
  8804 var ctx = canvas.getContext('2d');
  8806 var _thrown_outer = false;
  8807 try {
  8809 ctx.fillStyle = '#f00';
  8810 ctx.fillRect(0, 0, 100, 50)
  8811 ctx.fillStyle = '#0f0';
  8812 ctx.fillRect(0, 0, 20, 20)
  8814 var imgdata = ctx.getImageData(0, 0, 100, 50);
  8816 ctx.fillStyle = '#0f0';
  8817 ctx.fillRect(0, 0, 100, 50)
  8818 ctx.fillStyle = '#f00';
  8819 ctx.fillRect(40, 20, 20, 20)
  8820 ctx.putImageData(imgdata, 40, 20, 0, 0, 20, 20);
  8822 isPixel(ctx, 50,25, 0,255,0,255, 2);
  8823 isPixel(ctx, 35,25, 0,255,0,255, 2);
  8824 isPixel(ctx, 65,25, 0,255,0,255, 2);
  8825 isPixel(ctx, 50,15, 0,255,0,255, 2);
  8826 isPixel(ctx, 50,45, 0,255,0,255, 2);
  8828 } catch (e) {
  8829     _thrown_outer = true;
  8831 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
  8835 </script>
  8837 <!-- [[[ test_2d.imageData.put.dirty.rect2.html ]]] -->
  8839 <p>Canvas test: 2d.imageData.put.dirty.rect2</p>
  8840 <!-- Testing: putImageData() only modifies areas inside the dirty rectangle, using x and y -->
  8841 <canvas id="c296" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8842 <script>
  8845 function test_2d_imageData_put_dirty_rect2() {
  8847 var canvas = document.getElementById('c296');
  8848 var ctx = canvas.getContext('2d');
  8850 var _thrown_outer = false;
  8851 try {
  8853 ctx.fillStyle = '#f00';
  8854 ctx.fillRect(0, 0, 100, 50)
  8855 ctx.fillStyle = '#0f0';
  8856 ctx.fillRect(60, 30, 20, 20)
  8858 var imgdata = ctx.getImageData(0, 0, 100, 50);
  8860 ctx.fillStyle = '#0f0';
  8861 ctx.fillRect(0, 0, 100, 50)
  8862 ctx.fillStyle = '#f00';
  8863 ctx.fillRect(40, 20, 20, 20)
  8864 ctx.putImageData(imgdata, -20, -10, 60, 30, 20, 20);
  8866 isPixel(ctx, 50,25, 0,255,0,255, 2);
  8867 isPixel(ctx, 35,25, 0,255,0,255, 2);
  8868 isPixel(ctx, 65,25, 0,255,0,255, 2);
  8869 isPixel(ctx, 50,15, 0,255,0,255, 2);
  8870 isPixel(ctx, 50,45, 0,255,0,255, 2);
  8872 } catch (e) {
  8873     _thrown_outer = true;
  8875 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
  8879 </script>
  8881 <!-- [[[ test_2d.imageData.put.dirty.zero.html ]]] -->
  8883 <p>Canvas test: 2d.imageData.put.dirty.zero</p>
  8884 <!-- Testing: putImageData() with zero-sized dirty rectangle puts nothing -->
  8885 <canvas id="c297" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8886 <script>
  8890 function test_2d_imageData_put_dirty_zero() {
  8892 var canvas = document.getElementById('c297');
  8893 var ctx = canvas.getContext('2d');
  8895 ctx.fillStyle = '#f00';
  8896 ctx.fillRect(0, 0, 100, 50)
  8897 var imgdata = ctx.getImageData(0, 0, 100, 50);
  8898 ctx.fillStyle = '#0f0';
  8899 ctx.fillRect(0, 0, 100, 50)
  8900 ctx.putImageData(imgdata, 0, 0, 0, 0, 0, 0);
  8901 isPixel(ctx, 50,25, 0,255,0,255, 2);
  8905 </script>
  8907 <!-- [[[ test_2d.imageData.put.modified.html ]]] -->
  8909 <p>Canvas test: 2d.imageData.put.modified</p>
  8910 <!-- Testing: putImageData() puts modified image data correctly -->
  8911 <canvas id="c298" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8912 <script>
  8915 function test_2d_imageData_put_modified() {
  8917 var canvas = document.getElementById('c298');
  8918 var ctx = canvas.getContext('2d');
  8920 ctx.fillStyle = '#0f0';
  8921 ctx.fillRect(0, 0, 100, 50)
  8922 ctx.fillStyle = '#f00';
  8923 ctx.fillRect(45, 20, 10, 10)
  8924 var imgdata = ctx.getImageData(45, 20, 10, 10);
  8925 for (var i = 0, len = imgdata.width*imgdata.height*4; i < len; i += 4)
  8927     imgdata.data[i] = 0;
  8928     imgdata.data[i+1] = 255;
  8930 ctx.putImageData(imgdata, 45, 20);
  8931 isPixel(ctx, 50,25, 0,255,0,255, 2);
  8935 </script>
  8937 <!-- [[[ test_2d.imageData.put.nonfinite.html ]]] -->
  8939 <p>Canvas test: 2d.imageData.put.nonfinite</p>
  8940 <!-- Testing: putImageData() throws NOT_SUPPORTED_ERR if arguments are not finite -->
  8941 <canvas id="c299" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  8942 <script>
  8944 function test_2d_imageData_put_nonfinite() {
  8946 var canvas = document.getElementById('c299');
  8947 var ctx = canvas.getContext('2d');
  8949 var imgdata = ctx.getImageData(0, 0, 10, 10);
  8950 var _thrown = undefined; try {
  8951   ctx.putImageData(imgdata, Infinity, 10);
  8952 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  8953 var _thrown = undefined; try {
  8954   ctx.putImageData(imgdata, -Infinity, 10);
  8955 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  8956 var _thrown = undefined; try {
  8957   ctx.putImageData(imgdata, NaN, 10);
  8958 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  8959 var _thrown = undefined; try {
  8960   ctx.putImageData(imgdata, 10, Infinity);
  8961 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  8962 var _thrown = undefined; try {
  8963   ctx.putImageData(imgdata, 10, -Infinity);
  8964 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  8965 var _thrown = undefined; try {
  8966   ctx.putImageData(imgdata, 10, NaN);
  8967 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  8968 var _thrown = undefined; try {
  8969   ctx.putImageData(imgdata, Infinity, Infinity);
  8970 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  8971 var _thrown = undefined; try {
  8972   ctx.putImageData(imgdata, Infinity, 10, 10, 10, 10, 10);
  8973 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  8974 var _thrown = undefined; try {
  8975   ctx.putImageData(imgdata, -Infinity, 10, 10, 10, 10, 10);
  8976 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  8977 var _thrown = undefined; try {
  8978   ctx.putImageData(imgdata, NaN, 10, 10, 10, 10, 10);
  8979 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  8980 var _thrown = undefined; try {
  8981   ctx.putImageData(imgdata, 10, Infinity, 10, 10, 10, 10);
  8982 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  8983 var _thrown = undefined; try {
  8984   ctx.putImageData(imgdata, 10, -Infinity, 10, 10, 10, 10);
  8985 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  8986 var _thrown = undefined; try {
  8987   ctx.putImageData(imgdata, 10, NaN, 10, 10, 10, 10);
  8988 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  8989 var _thrown = undefined; try {
  8990   ctx.putImageData(imgdata, 10, 10, Infinity, 10, 10, 10);
  8991 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  8992 var _thrown = undefined; try {
  8993   ctx.putImageData(imgdata, 10, 10, -Infinity, 10, 10, 10);
  8994 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  8995 var _thrown = undefined; try {
  8996   ctx.putImageData(imgdata, 10, 10, NaN, 10, 10, 10);
  8997 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  8998 var _thrown = undefined; try {
  8999   ctx.putImageData(imgdata, 10, 10, 10, Infinity, 10, 10);
  9000 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9001 var _thrown = undefined; try {
  9002   ctx.putImageData(imgdata, 10, 10, 10, -Infinity, 10, 10);
  9003 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9004 var _thrown = undefined; try {
  9005   ctx.putImageData(imgdata, 10, 10, 10, NaN, 10, 10);
  9006 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9007 var _thrown = undefined; try {
  9008   ctx.putImageData(imgdata, 10, 10, 10, 10, Infinity, 10);
  9009 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9010 var _thrown = undefined; try {
  9011   ctx.putImageData(imgdata, 10, 10, 10, 10, -Infinity, 10);
  9012 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9013 var _thrown = undefined; try {
  9014   ctx.putImageData(imgdata, 10, 10, 10, 10, NaN, 10);
  9015 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9016 var _thrown = undefined; try {
  9017   ctx.putImageData(imgdata, 10, 10, 10, 10, 10, Infinity);
  9018 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9019 var _thrown = undefined; try {
  9020   ctx.putImageData(imgdata, 10, 10, 10, 10, 10, -Infinity);
  9021 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9022 var _thrown = undefined; try {
  9023   ctx.putImageData(imgdata, 10, 10, 10, 10, 10, NaN);
  9024 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9025 var _thrown = undefined; try {
  9026   ctx.putImageData(imgdata, Infinity, Infinity, 10, 10, 10, 10);
  9027 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9028 var _thrown = undefined; try {
  9029   ctx.putImageData(imgdata, Infinity, Infinity, Infinity, 10, 10, 10);
  9030 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9031 var _thrown = undefined; try {
  9032   ctx.putImageData(imgdata, Infinity, Infinity, Infinity, Infinity, 10, 10);
  9033 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9034 var _thrown = undefined; try {
  9035   ctx.putImageData(imgdata, Infinity, Infinity, Infinity, Infinity, Infinity, 10);
  9036 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9037 var _thrown = undefined; try {
  9038   ctx.putImageData(imgdata, Infinity, Infinity, Infinity, Infinity, Infinity, Infinity);
  9039 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9040 var _thrown = undefined; try {
  9041   ctx.putImageData(imgdata, Infinity, Infinity, Infinity, Infinity, 10, Infinity);
  9042 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9043 var _thrown = undefined; try {
  9044   ctx.putImageData(imgdata, Infinity, Infinity, Infinity, 10, Infinity, 10);
  9045 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9046 var _thrown = undefined; try {
  9047   ctx.putImageData(imgdata, Infinity, Infinity, Infinity, 10, Infinity, Infinity);
  9048 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9049 var _thrown = undefined; try {
  9050   ctx.putImageData(imgdata, Infinity, Infinity, Infinity, 10, 10, Infinity);
  9051 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9052 var _thrown = undefined; try {
  9053   ctx.putImageData(imgdata, Infinity, Infinity, 10, Infinity, 10, 10);
  9054 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9055 var _thrown = undefined; try {
  9056   ctx.putImageData(imgdata, Infinity, Infinity, 10, Infinity, Infinity, 10);
  9057 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9058 var _thrown = undefined; try {
  9059   ctx.putImageData(imgdata, Infinity, Infinity, 10, Infinity, Infinity, Infinity);
  9060 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9061 var _thrown = undefined; try {
  9062   ctx.putImageData(imgdata, Infinity, Infinity, 10, Infinity, 10, Infinity);
  9063 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9064 var _thrown = undefined; try {
  9065   ctx.putImageData(imgdata, Infinity, Infinity, 10, 10, Infinity, 10);
  9066 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9067 var _thrown = undefined; try {
  9068   ctx.putImageData(imgdata, Infinity, Infinity, 10, 10, Infinity, Infinity);
  9069 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9070 var _thrown = undefined; try {
  9071   ctx.putImageData(imgdata, Infinity, Infinity, 10, 10, 10, Infinity);
  9072 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9073 var _thrown = undefined; try {
  9074   ctx.putImageData(imgdata, Infinity, 10, Infinity, 10, 10, 10);
  9075 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9076 var _thrown = undefined; try {
  9077   ctx.putImageData(imgdata, Infinity, 10, Infinity, Infinity, 10, 10);
  9078 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9079 var _thrown = undefined; try {
  9080   ctx.putImageData(imgdata, Infinity, 10, Infinity, Infinity, Infinity, 10);
  9081 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9082 var _thrown = undefined; try {
  9083   ctx.putImageData(imgdata, Infinity, 10, Infinity, Infinity, Infinity, Infinity);
  9084 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9085 var _thrown = undefined; try {
  9086   ctx.putImageData(imgdata, Infinity, 10, Infinity, Infinity, 10, Infinity);
  9087 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9088 var _thrown = undefined; try {
  9089   ctx.putImageData(imgdata, Infinity, 10, Infinity, 10, Infinity, 10);
  9090 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9091 var _thrown = undefined; try {
  9092   ctx.putImageData(imgdata, Infinity, 10, Infinity, 10, Infinity, Infinity);
  9093 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9094 var _thrown = undefined; try {
  9095   ctx.putImageData(imgdata, Infinity, 10, Infinity, 10, 10, Infinity);
  9096 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9097 var _thrown = undefined; try {
  9098   ctx.putImageData(imgdata, Infinity, 10, 10, Infinity, 10, 10);
  9099 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9100 var _thrown = undefined; try {
  9101   ctx.putImageData(imgdata, Infinity, 10, 10, Infinity, Infinity, 10);
  9102 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9103 var _thrown = undefined; try {
  9104   ctx.putImageData(imgdata, Infinity, 10, 10, Infinity, Infinity, Infinity);
  9105 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9106 var _thrown = undefined; try {
  9107   ctx.putImageData(imgdata, Infinity, 10, 10, Infinity, 10, Infinity);
  9108 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9109 var _thrown = undefined; try {
  9110   ctx.putImageData(imgdata, Infinity, 10, 10, 10, Infinity, 10);
  9111 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9112 var _thrown = undefined; try {
  9113   ctx.putImageData(imgdata, Infinity, 10, 10, 10, Infinity, Infinity);
  9114 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9115 var _thrown = undefined; try {
  9116   ctx.putImageData(imgdata, Infinity, 10, 10, 10, 10, Infinity);
  9117 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9118 var _thrown = undefined; try {
  9119   ctx.putImageData(imgdata, 10, Infinity, Infinity, 10, 10, 10);
  9120 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9121 var _thrown = undefined; try {
  9122   ctx.putImageData(imgdata, 10, Infinity, Infinity, Infinity, 10, 10);
  9123 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9124 var _thrown = undefined; try {
  9125   ctx.putImageData(imgdata, 10, Infinity, Infinity, Infinity, Infinity, 10);
  9126 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9127 var _thrown = undefined; try {
  9128   ctx.putImageData(imgdata, 10, Infinity, Infinity, Infinity, Infinity, Infinity);
  9129 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9130 var _thrown = undefined; try {
  9131   ctx.putImageData(imgdata, 10, Infinity, Infinity, Infinity, 10, Infinity);
  9132 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9133 var _thrown = undefined; try {
  9134   ctx.putImageData(imgdata, 10, Infinity, Infinity, 10, Infinity, 10);
  9135 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9136 var _thrown = undefined; try {
  9137   ctx.putImageData(imgdata, 10, Infinity, Infinity, 10, Infinity, Infinity);
  9138 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9139 var _thrown = undefined; try {
  9140   ctx.putImageData(imgdata, 10, Infinity, Infinity, 10, 10, Infinity);
  9141 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9142 var _thrown = undefined; try {
  9143   ctx.putImageData(imgdata, 10, Infinity, 10, Infinity, 10, 10);
  9144 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9145 var _thrown = undefined; try {
  9146   ctx.putImageData(imgdata, 10, Infinity, 10, Infinity, Infinity, 10);
  9147 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9148 var _thrown = undefined; try {
  9149   ctx.putImageData(imgdata, 10, Infinity, 10, Infinity, Infinity, Infinity);
  9150 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9151 var _thrown = undefined; try {
  9152   ctx.putImageData(imgdata, 10, Infinity, 10, Infinity, 10, Infinity);
  9153 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9154 var _thrown = undefined; try {
  9155   ctx.putImageData(imgdata, 10, Infinity, 10, 10, Infinity, 10);
  9156 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9157 var _thrown = undefined; try {
  9158   ctx.putImageData(imgdata, 10, Infinity, 10, 10, Infinity, Infinity);
  9159 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9160 var _thrown = undefined; try {
  9161   ctx.putImageData(imgdata, 10, Infinity, 10, 10, 10, Infinity);
  9162 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9163 var _thrown = undefined; try {
  9164   ctx.putImageData(imgdata, 10, 10, Infinity, Infinity, 10, 10);
  9165 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9166 var _thrown = undefined; try {
  9167   ctx.putImageData(imgdata, 10, 10, Infinity, Infinity, Infinity, 10);
  9168 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9169 var _thrown = undefined; try {
  9170   ctx.putImageData(imgdata, 10, 10, Infinity, Infinity, Infinity, Infinity);
  9171 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9172 var _thrown = undefined; try {
  9173   ctx.putImageData(imgdata, 10, 10, Infinity, Infinity, 10, Infinity);
  9174 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9175 var _thrown = undefined; try {
  9176   ctx.putImageData(imgdata, 10, 10, Infinity, 10, Infinity, 10);
  9177 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9178 var _thrown = undefined; try {
  9179   ctx.putImageData(imgdata, 10, 10, Infinity, 10, Infinity, Infinity);
  9180 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9181 var _thrown = undefined; try {
  9182   ctx.putImageData(imgdata, 10, 10, Infinity, 10, 10, Infinity);
  9183 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9184 var _thrown = undefined; try {
  9185   ctx.putImageData(imgdata, 10, 10, 10, Infinity, Infinity, 10);
  9186 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9187 var _thrown = undefined; try {
  9188   ctx.putImageData(imgdata, 10, 10, 10, Infinity, Infinity, Infinity);
  9189 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9190 var _thrown = undefined; try {
  9191   ctx.putImageData(imgdata, 10, 10, 10, Infinity, 10, Infinity);
  9192 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9193 var _thrown = undefined; try {
  9194   ctx.putImageData(imgdata, 10, 10, 10, 10, Infinity, Infinity);
  9195 } catch (e) { _thrown = e }; ok(_thrown && _thrown instanceof TypeError, "should throw TypeError");
  9199 </script>
  9201 <!-- [[[ test_2d.imageData.put.null.html ]]] -->
  9203 <p>Canvas test: 2d.imageData.put.null - bug 421715</p>
  9204 <!-- Testing: putImageData() with null imagedata throws TYPE_MISMATCH_ERR -->
  9205 <canvas id="c300" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  9206 <script>
  9208 function test_2d_imageData_put_null() {
  9210 var canvas = document.getElementById('c300');
  9211 var ctx = canvas.getContext('2d');
  9213 var _thrown = undefined; try {
  9214   ctx.putImageData(null, 0, 0);
  9215 } catch (e) { _thrown = e };
  9216 ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
  9219 </script>
  9221 <!-- [[[ test_2d.imageData.put.path.html ]]] -->
  9223 <p>Canvas test: 2d.imageData.put.path</p>
  9224 <!-- Testing: putImageData() does not affect the current path -->
  9225 <canvas id="c301" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  9226 <script>
  9229 function test_2d_imageData_put_path() {
  9231 var canvas = document.getElementById('c301');
  9232 var ctx = canvas.getContext('2d');
  9234 ctx.fillStyle = '#f00';
  9235 ctx.fillRect(0, 0, 100, 50)
  9236 ctx.rect(0, 0, 100, 50);
  9237 var imgdata = ctx.getImageData(0, 0, 100, 50);
  9238 ctx.putImageData(imgdata, 0, 0);
  9239 ctx.fillStyle = '#0f0';
  9240 ctx.fill();
  9241 isPixel(ctx, 50,25, 0,255,0,255, 2);
  9245 </script>
  9247 <!-- [[[ test_2d.imageData.put.unaffected.html ]]] -->
  9249 <p>Canvas test: 2d.imageData.put.unaffected</p>
  9250 <!-- Testing: putImageData() is not affected by context state -->
  9251 <canvas id="c302" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  9252 <script>
  9255 function test_2d_imageData_put_unaffected() {
  9257 var canvas = document.getElementById('c302');
  9258 var ctx = canvas.getContext('2d');
  9260 ctx.fillStyle = '#0f0';
  9261 ctx.fillRect(0, 0, 100, 50)
  9262 var imgdata = ctx.getImageData(0, 0, 100, 50);
  9263 ctx.fillStyle = '#f00';
  9264 ctx.fillRect(0, 0, 100, 50)
  9265 ctx.globalAlpha = 0.1;
  9266 ctx.globalCompositeOperation = 'destination-atop';
  9267 ctx.shadowColor = '#f00';
  9268 ctx.translate(100, 50);
  9269 ctx.scale(0.1, 0.1);
  9270 ctx.putImageData(imgdata, 0, 0);
  9271 isPixel(ctx, 50,25, 0,255,0,255, 2);
  9275 </script>
  9277 <!-- [[[ test_2d.imageData.put.unchanged.html ]]] -->
  9279 <p>Canvas test: 2d.imageData.put.unchanged</p>
  9280 <!-- Testing: putImageData(getImageData(...), ...) has no effect -->
  9281 <canvas id="c303" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  9282 <script>
  9284 function test_2d_imageData_put_unchanged() {
  9286 var canvas = document.getElementById('c303');
  9287 var ctx = canvas.getContext('2d');
  9289 var i = 0;
  9290 for (var y = 0; y < 16; ++y) {
  9291     for (var x = 0; x < 16; ++x, ++i) {
  9292         ctx.fillStyle = 'rgba(' + i + ',' + (Math.floor(i*1.5) % 256) + ',' + (Math.floor(i*23.3) % 256) + ',' + (i/256) + ')';
  9293         ctx.fillRect(x, y, 1, 1);
  9296 var imgdata1 = ctx.getImageData(0.1, 0.2, 15.8, 15.9);
  9297 var olddata = [];
  9298 for (var i = 0; i < imgdata1.data.length; ++i)
  9299     olddata[i] = imgdata1.data[i];
  9301 ctx.putImageData(imgdata1, 0.1, 0.2);
  9303 var imgdata2 = ctx.getImageData(0.1, 0.2, 15.8, 15.9);
  9304 for (var i = 0; i < imgdata2.data.length; ++i) {
  9305     ok(olddata[i] === imgdata2.data[i], "olddata[\""+(i)+"\"] === imgdata2.data[\""+(i)+"\"]");
  9310 </script>
  9312 <!-- [[[ test_2d.imageData.put.wrongtype.html ]]] -->
  9314 <p>Canvas test: 2d.imageData.put.wrongtype</p>
  9315 <!-- Testing: putImageData() does not accept non-ImageData objects -->
  9316 <canvas id="c304" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  9317 <script>
  9319 function test_2d_imageData_put_wrongtype() {
  9321 var canvas = document.getElementById('c304');
  9322 var ctx = canvas.getContext('2d');
  9324 var imgdata = { width: 1, height: 1, data: [255, 0, 0, 255] };
  9325 var _thrown = undefined; try {
  9326   ctx.putImageData(imgdata, 0, 0);
  9327 } catch (e) { _thrown = e }; 
  9328 ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
  9330 var _thrown = undefined; try {
  9331   ctx.putImageData("cheese", 0, 0);
  9332 } catch (e) { _thrown = e };
  9333 ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
  9335 var _thrown = undefined; try {
  9336   ctx.putImageData(42, 0, 0);
  9337 } catch (e) { _thrown = e };
  9338 ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
  9340 </script>
  9342 <!-- [[[ test_2d.line.cap.butt.html ]]] -->
  9344 <p>Canvas test: 2d.line.cap.butt</p>
  9345 <!-- Testing: lineCap 'butt' is rendered correctly -->
  9346 <canvas id="c305" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  9347 <script>
  9350 function test_2d_line_cap_butt() {
  9352 var canvas = document.getElementById('c305');
  9353 var ctx = canvas.getContext('2d');
  9355 ctx.fillStyle = '#0f0';
  9356 ctx.fillRect(0, 0, 100, 50);
  9358 ctx.lineCap = 'butt';
  9359 ctx.lineWidth = 20;
  9361 ctx.fillStyle = '#f00';
  9362 ctx.strokeStyle = '#0f0';
  9363 ctx.fillRect(15, 15, 20, 20);
  9364 ctx.beginPath();
  9365 ctx.moveTo(25, 15);
  9366 ctx.lineTo(25, 35);
  9367 ctx.stroke();
  9369 ctx.fillStyle = '#0f0';
  9370 ctx.strokeStyle = '#f00';
  9371 ctx.beginPath();
  9372 ctx.moveTo(75, 15);
  9373 ctx.lineTo(75, 35);
  9374 ctx.stroke();
  9375 ctx.fillRect(65, 15, 20, 20);
  9377 isPixel(ctx, 25,14, 0,255,0,255, 0);
  9378 isPixel(ctx, 25,15, 0,255,0,255, 0);
  9379 isPixel(ctx, 25,16, 0,255,0,255, 0);
  9380 isPixel(ctx, 25,34, 0,255,0,255, 0);
  9381 isPixel(ctx, 25,35, 0,255,0,255, 0);
  9382 isPixel(ctx, 25,36, 0,255,0,255, 0);
  9384 isPixel(ctx, 75,14, 0,255,0,255, 0);
  9385 isPixel(ctx, 75,15, 0,255,0,255, 0);
  9386 isPixel(ctx, 75,16, 0,255,0,255, 0);
  9387 isPixel(ctx, 75,34, 0,255,0,255, 0);
  9388 isPixel(ctx, 75,35, 0,255,0,255, 0);
  9389 isPixel(ctx, 75,36, 0,255,0,255, 0);
  9393 </script>
  9395 <!-- [[[ test_2d.line.cap.closed.html ]]] -->
  9397 <p>Canvas test: 2d.line.cap.closed</p>
  9398 <!-- Testing: Line caps are not drawn at the corners of an unclosed rectangle -->
  9399 <canvas id="c306" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  9400 <script>
  9403 function test_2d_line_cap_closed() {
  9405 var canvas = document.getElementById('c306');
  9406 var ctx = canvas.getContext('2d');
  9408 ctx.fillStyle = '#0f0';
  9409 ctx.strokeStyle = '#f00';
  9410 ctx.fillRect(0, 0, 100, 50);
  9412 ctx.lineJoin = 'bevel';
  9413 ctx.lineCap = 'square';
  9414 ctx.lineWidth = 400;
  9416 ctx.beginPath();
  9417 ctx.moveTo(200, 200);
  9418 ctx.lineTo(200, 1000);
  9419 ctx.lineTo(1000, 1000);
  9420 ctx.lineTo(1000, 200);
  9421 ctx.closePath();
  9422 ctx.stroke();
  9424 isPixel(ctx, 1,1, 0,255,0,255, 0);
  9425 isPixel(ctx, 48,1, 0,255,0,255, 0);
  9426 isPixel(ctx, 48,48, 0,255,0,255, 0);
  9427 isPixel(ctx, 1,48, 0,255,0,255, 0);
  9431 </script>
  9433 <!-- [[[ test_2d.line.cap.invalid.html ]]] -->
  9435 <p>Canvas test: 2d.line.cap.invalid - bug 401788</p>
  9436 <!-- Testing: Setting lineCap to invalid values is ignored -->
  9437 <canvas id="c307" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  9438 <script>
  9440 function test_2d_line_cap_invalid() {
  9442 var canvas = document.getElementById('c307');
  9443 var ctx = canvas.getContext('2d');
  9445 var _thrown_outer = false;
  9446 try {
  9448 ctx.lineCap = 'butt'
  9449 ok(ctx.lineCap === 'butt', "ctx.lineCap === 'butt'");
  9451 ctx.lineCap = 'butt';
  9452 ctx.lineCap = 'invalid';
  9453 ok(ctx.lineCap === 'butt', "ctx.lineCap === 'butt'");
  9455 ctx.lineCap = 'butt';
  9456 ctx.lineCap = 'ROUND';
  9457 ok(ctx.lineCap === 'butt', "ctx.lineCap === 'butt'");
  9459 ctx.lineCap = 'butt';
  9460 ctx.lineCap = 'round\0';
  9461 ok(ctx.lineCap === 'butt', "ctx.lineCap === 'butt'");
  9463 ctx.lineCap = 'butt';
  9464 ctx.lineCap = 'round ';
  9465 ok(ctx.lineCap === 'butt', "ctx.lineCap === 'butt'");
  9467 ctx.lineCap = 'butt';
  9468 ctx.lineCap = "";
  9469 ok(ctx.lineCap === 'butt', "ctx.lineCap === 'butt'");
  9471 ctx.lineCap = 'butt';
  9472 ctx.lineCap = 'bevel';
  9473 ok(ctx.lineCap === 'butt', "ctx.lineCap === 'butt'");
  9475 } catch (e) {
  9476     _thrown_outer = true;
  9478 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
  9482 </script>
  9484 <!-- [[[ test_2d.line.cap.open.html ]]] -->
  9486 <p>Canvas test: 2d.line.cap.open</p>
  9487 <!-- Testing: Line caps are drawn at the corners of an unclosed rectangle -->
  9488 <canvas id="c308" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  9489 <script>
  9492 function test_2d_line_cap_open() {
  9494 var canvas = document.getElementById('c308');
  9495 var ctx = canvas.getContext('2d');
  9497 ctx.fillStyle = '#f00';
  9498 ctx.strokeStyle = '#0f0';
  9499 ctx.fillRect(0, 0, 100, 50);
  9501 ctx.lineJoin = 'bevel';
  9502 ctx.lineCap = 'square';
  9503 ctx.lineWidth = 400;
  9505 ctx.beginPath();
  9506 ctx.moveTo(200, 200);
  9507 ctx.lineTo(200, 1000);
  9508 ctx.lineTo(1000, 1000);
  9509 ctx.lineTo(1000, 200);
  9510 ctx.lineTo(200, 200);
  9511 ctx.stroke();
  9513 isPixel(ctx, 1,1, 0,255,0,255, 0);
  9514 isPixel(ctx, 48,1, 0,255,0,255, 0);
  9515 isPixel(ctx, 48,48, 0,255,0,255, 0);
  9516 isPixel(ctx, 1,48, 0,255,0,255, 0);
  9520 </script>
  9522 <!-- [[[ test_2d.line.cap.round.html ]]] -->
  9524 <p>Canvas test: 2d.line.cap.round</p>
  9525 <!-- Testing: lineCap 'round' is rendered correctly -->
  9526 <canvas id="c309" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  9527 <script>
  9530 function test_2d_line_cap_round() {
  9532 var canvas = document.getElementById('c309');
  9533 var ctx = canvas.getContext('2d');
  9535 ctx.fillStyle = '#0f0';
  9536 ctx.fillRect(0, 0, 100, 50);
  9538 var tol = 1; // tolerance to avoid antialiasing artifacts
  9540 ctx.lineCap = 'round';
  9541 ctx.lineWidth = 20;
  9544 ctx.fillStyle = '#f00';
  9545 ctx.strokeStyle = '#0f0';
  9547 ctx.beginPath();
  9548 ctx.moveTo(35-tol, 15);
  9549 ctx.arc(25, 15, 10-tol, 0, Math.PI, true);
  9550 ctx.arc(25, 35, 10-tol, Math.PI, 0, true);
  9551 ctx.fill();
  9553 ctx.beginPath();
  9554 ctx.moveTo(25, 15);
  9555 ctx.lineTo(25, 35);
  9556 ctx.stroke();
  9559 ctx.fillStyle = '#0f0';
  9560 ctx.strokeStyle = '#f00';
  9562 ctx.beginPath();
  9563 ctx.moveTo(75, 15);
  9564 ctx.lineTo(75, 35);
  9565 ctx.stroke();
  9567 ctx.beginPath();
  9568 ctx.moveTo(85+tol, 15);
  9569 ctx.arc(75, 15, 10+tol, 0, Math.PI, true);
  9570 ctx.arc(75, 35, 10+tol, Math.PI, 0, true);
  9571 ctx.fill();
  9573 isPixel(ctx, 17,6, 0,255,0,255, 0);
  9574 isPixel(ctx, 25,6, 0,255,0,255, 0);
  9575 isPixel(ctx, 32,6, 0,255,0,255, 0);
  9576 isPixel(ctx, 17,43, 0,255,0,255, 0);
  9577 isPixel(ctx, 25,43, 0,255,0,255, 0);
  9578 isPixel(ctx, 32,43, 0,255,0,255, 0);
  9580 isPixel(ctx, 67,6, 0,255,0,255, 0);
  9581 isPixel(ctx, 75,6, 0,255,0,255, 0);
  9582 isPixel(ctx, 82,6, 0,255,0,255, 0);
  9583 isPixel(ctx, 67,43, 0,255,0,255, 0);
  9584 isPixel(ctx, 75,43, 0,255,0,255, 0);
  9585 isPixel(ctx, 82,43, 0,255,0,255, 0);
  9589 </script>
  9591 <!-- [[[ test_2d.line.cap.square.html ]]] -->
  9593 <p>Canvas test: 2d.line.cap.square</p>
  9594 <!-- Testing: lineCap 'square' is rendered correctly -->
  9595 <canvas id="c310" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  9596 <script>
  9599 function test_2d_line_cap_square() {
  9601 var canvas = document.getElementById('c310');
  9602 var ctx = canvas.getContext('2d');
  9604 ctx.fillStyle = '#0f0';
  9605 ctx.fillRect(0, 0, 100, 50);
  9607 ctx.lineCap = 'square';
  9608 ctx.lineWidth = 20;
  9610 ctx.fillStyle = '#f00';
  9611 ctx.strokeStyle = '#0f0';
  9612 ctx.fillRect(15, 5, 20, 40);
  9613 ctx.beginPath();
  9614 ctx.moveTo(25, 15);
  9615 ctx.lineTo(25, 35);
  9616 ctx.stroke();
  9618 ctx.fillStyle = '#0f0';
  9619 ctx.strokeStyle = '#f00';
  9620 ctx.beginPath();
  9621 ctx.moveTo(75, 15);
  9622 ctx.lineTo(75, 35);
  9623 ctx.stroke();
  9624 ctx.fillRect(65, 5, 20, 40);
  9626 isPixel(ctx, 25,4, 0,255,0,255, 0);
  9627 isPixel(ctx, 25,5, 0,255,0,255, 0);
  9628 isPixel(ctx, 25,6, 0,255,0,255, 0);
  9629 isPixel(ctx, 25,44, 0,255,0,255, 0);
  9630 isPixel(ctx, 25,45, 0,255,0,255, 0);
  9631 isPixel(ctx, 25,46, 0,255,0,255, 0);
  9633 isPixel(ctx, 75,4, 0,255,0,255, 0);
  9634 isPixel(ctx, 75,5, 0,255,0,255, 0);
  9635 isPixel(ctx, 75,6, 0,255,0,255, 0);
  9636 isPixel(ctx, 75,44, 0,255,0,255, 0);
  9637 isPixel(ctx, 75,45, 0,255,0,255, 0);
  9638 isPixel(ctx, 75,46, 0,255,0,255, 0);
  9642 </script>
  9644 <!-- [[[ test_2d.line.cross.html ]]] -->
  9646 <p>Canvas test: 2d.line.cross</p>
  9647 <canvas id="c311" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  9648 <script>
  9651 function test_2d_line_cross() {
  9653 var canvas = document.getElementById('c311');
  9654 var ctx = canvas.getContext('2d');
  9656 ctx.fillStyle = '#0f0';
  9657 ctx.fillRect(0, 0, 100, 50);
  9659 ctx.lineWidth = 200;
  9660 ctx.lineJoin = 'bevel';
  9662 ctx.strokeStyle = '#f00';
  9663 ctx.beginPath();
  9664 ctx.moveTo(110, 50);
  9665 ctx.lineTo(110, 60);
  9666 ctx.lineTo(100, 60);
  9667 ctx.stroke();
  9669 isPixel(ctx, 1,1, 0,255,0,255, 0);
  9670 isPixel(ctx, 48,1, 0,255,0,255, 0);
  9671 isPixel(ctx, 48,48, 0,255,0,255, 0);
  9672 isPixel(ctx, 1,48, 0,255,0,255, 0);
  9676 </script>
  9678 <!-- [[[ test_2d.line.defaults.html ]]] -->
  9680 <p>Canvas test: 2d.line.defaults</p>
  9681 <canvas id="c312" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  9682 <script>
  9684 function test_2d_line_defaults() {
  9686 var canvas = document.getElementById('c312');
  9687 var ctx = canvas.getContext('2d');
  9689 ok(ctx.lineWidth === 1, "ctx.lineWidth === 1");
  9690 ok(ctx.lineCap === 'butt', "ctx.lineCap === 'butt'");
  9691 ok(ctx.lineJoin === 'miter', "ctx.lineJoin === 'miter'");
  9692 ok(ctx.miterLimit === 10, "ctx.miterLimit === 10");
  9696 </script>
  9698 <!-- [[[ test_2d.line.join.bevel.html ]]] -->
  9700 <p>Canvas test: 2d.line.join.bevel</p>
  9701 <!-- Testing: lineJoin 'bevel' is rendered correctly -->
  9702 <canvas id="c313" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  9703 <script>
  9706 function test_2d_line_join_bevel() {
  9708 var canvas = document.getElementById('c313');
  9709 var ctx = canvas.getContext('2d');
  9711 ctx.fillStyle = '#0f0';
  9712 ctx.fillRect(0, 0, 100, 50);
  9714 var tol = 1; // tolerance to avoid antialiasing artifacts
  9716 ctx.lineJoin = 'bevel';
  9717 ctx.lineWidth = 20;
  9719 ctx.fillStyle = '#f00';
  9720 ctx.strokeStyle = '#0f0';
  9722 ctx.fillRect(10, 10, 20, 20);
  9723 ctx.fillRect(20, 20, 20, 20);
  9724 ctx.beginPath();
  9725 ctx.moveTo(30, 20);
  9726 ctx.lineTo(40-tol, 20);
  9727 ctx.lineTo(30, 10+tol);
  9728 ctx.fill();
  9730 ctx.beginPath();
  9731 ctx.moveTo(10, 20);
  9732 ctx.lineTo(30, 20);
  9733 ctx.lineTo(30, 40);
  9734 ctx.stroke();
  9737 ctx.fillStyle = '#0f0';
  9738 ctx.strokeStyle = '#f00';
  9740 ctx.beginPath();
  9741 ctx.moveTo(60, 20);
  9742 ctx.lineTo(80, 20);
  9743 ctx.lineTo(80, 40);
  9744 ctx.stroke();
  9746 ctx.fillRect(60, 10, 20, 20);
  9747 ctx.fillRect(70, 20, 20, 20);
  9748 ctx.beginPath();
  9749 ctx.moveTo(80, 20);
  9750 ctx.lineTo(90+tol, 20);
  9751 ctx.lineTo(80, 10-tol);
  9752 ctx.fill();
  9754 isPixel(ctx, 34,16, 0,255,0,255, 0);
  9755 isPixel(ctx, 34,15, 0,255,0,255, 0);
  9756 isPixel(ctx, 35,15, 0,255,0,255, 0);
  9757 isPixel(ctx, 36,15, 0,255,0,255, 0);
  9758 isPixel(ctx, 36,14, 0,255,0,255, 0);
  9760 isPixel(ctx, 84,16, 0,255,0,255, 0);
  9761 isPixel(ctx, 84,15, 0,255,0,255, 0);
  9762 isPixel(ctx, 85,15, 0,255,0,255, 0);
  9763 isPixel(ctx, 86,15, 0,255,0,255, 0);
  9764 isPixel(ctx, 86,14, 0,255,0,255, 0);
  9768 </script>
  9770 <!-- [[[ test_2d.line.join.closed.html ]]] -->
  9772 <p>Canvas test: 2d.line.join.closed</p>
  9773 <!-- Testing: Line joins are drawn at the corner of a closed rectangle -->
  9774 <canvas id="c314" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  9775 <script>
  9778 function test_2d_line_join_closed() {
  9780 var canvas = document.getElementById('c314');
  9781 var ctx = canvas.getContext('2d');
  9783 ctx.fillStyle = '#f00';
  9784 ctx.strokeStyle = '#0f0';
  9785 ctx.fillRect(0, 0, 100, 50);
  9787 ctx.lineJoin = 'miter';
  9788 ctx.lineWidth = 200;
  9790 ctx.beginPath();
  9791 ctx.moveTo(100, 50);
  9792 ctx.lineTo(100, 1000);
  9793 ctx.lineTo(1000, 1000);
  9794 ctx.lineTo(1000, 50);
  9795 ctx.closePath();
  9796 ctx.stroke();
  9798 isPixel(ctx, 1,1, 0,255,0,255, 0);
  9799 isPixel(ctx, 48,1, 0,255,0,255, 0);
  9800 isPixel(ctx, 48,48, 0,255,0,255, 0);
  9801 isPixel(ctx, 1,48, 0,255,0,255, 0);
  9805 </script>
  9807 <!-- [[[ test_2d.line.join.invalid.html ]]] -->
  9809 <p>Canvas test: 2d.line.join.invalid - bug 401788</p>
  9810 <!-- Testing: Setting lineJoin to invalid values is ignored -->
  9811 <canvas id="c315" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  9812 <script>
  9814 function test_2d_line_join_invalid() {
  9816 var canvas = document.getElementById('c315');
  9817 var ctx = canvas.getContext('2d');
  9819 var _thrown_outer = false;
  9820 try {
  9822 ctx.lineJoin = 'bevel'
  9823 ok(ctx.lineJoin === 'bevel', "ctx.lineJoin === 'bevel'");
  9825 ctx.lineJoin = 'bevel';
  9826 ctx.lineJoin = 'invalid';
  9827 ok(ctx.lineJoin === 'bevel', "ctx.lineJoin === 'bevel'");
  9829 ctx.lineJoin = 'bevel';
  9830 ctx.lineJoin = 'ROUND';
  9831 ok(ctx.lineJoin === 'bevel', "ctx.lineJoin === 'bevel'");
  9833 ctx.lineJoin = 'bevel';
  9834 ctx.lineJoin = 'round\0';
  9835 ok(ctx.lineJoin === 'bevel', "ctx.lineJoin === 'bevel'");
  9837 ctx.lineJoin = 'bevel';
  9838 ctx.lineJoin = 'round ';
  9839 ok(ctx.lineJoin === 'bevel', "ctx.lineJoin === 'bevel'");
  9841 ctx.lineJoin = 'bevel';
  9842 ctx.lineJoin = "";
  9843 ok(ctx.lineJoin === 'bevel', "ctx.lineJoin === 'bevel'");
  9845 ctx.lineJoin = 'bevel';
  9846 ctx.lineJoin = 'butt';
  9847 ok(ctx.lineJoin === 'bevel', "ctx.lineJoin === 'bevel'");
  9849 } catch (e) {
  9850     _thrown_outer = true;
  9852 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
  9856 </script>
  9858 <!-- [[[ test_2d.line.join.miter.html ]]] -->
  9860 <p>Canvas test: 2d.line.join.miter</p>
  9861 <!-- Testing: lineJoin 'miter' is rendered correctly -->
  9862 <canvas id="c316" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  9863 <script>
  9866 function test_2d_line_join_miter() {
  9868 var canvas = document.getElementById('c316');
  9869 var ctx = canvas.getContext('2d');
  9871 ctx.fillStyle = '#0f0';
  9872 ctx.fillRect(0, 0, 100, 50);
  9874 ctx.lineJoin = 'miter';
  9875 ctx.lineWidth = 20;
  9877 ctx.fillStyle = '#f00';
  9878 ctx.strokeStyle = '#0f0';
  9880 ctx.fillStyle = '#f00';
  9881 ctx.strokeStyle = '#0f0';
  9883 ctx.fillRect(10, 10, 30, 20);
  9884 ctx.fillRect(20, 10, 20, 30);
  9886 ctx.beginPath();
  9887 ctx.moveTo(10, 20);
  9888 ctx.lineTo(30, 20);
  9889 ctx.lineTo(30, 40);
  9890 ctx.stroke();
  9893 ctx.fillStyle = '#0f0';
  9894 ctx.strokeStyle = '#f00';
  9896 ctx.beginPath();
  9897 ctx.moveTo(60, 20);
  9898 ctx.lineTo(80, 20);
  9899 ctx.lineTo(80, 40);
  9900 ctx.stroke();
  9902 ctx.fillRect(60, 10, 30, 20);
  9903 ctx.fillRect(70, 10, 20, 30);
  9905 isPixel(ctx, 38,12, 0,255,0,255, 0);
  9906 isPixel(ctx, 39,11, 0,255,0,255, 0);
  9907 isPixel(ctx, 40,10, 0,255,0,255, 0);
  9908 isPixel(ctx, 41,9, 0,255,0,255, 0);
  9909 isPixel(ctx, 42,8, 0,255,0,255, 0);
  9911 isPixel(ctx, 88,12, 0,255,0,255, 0);
  9912 isPixel(ctx, 89,11, 0,255,0,255, 0);
  9913 isPixel(ctx, 90,10, 0,255,0,255, 0);
  9914 isPixel(ctx, 91,9, 0,255,0,255, 0);
  9915 isPixel(ctx, 92,8, 0,255,0,255, 0);
  9919 </script>
  9921 <!-- [[[ test_2d.line.join.open.html ]]] -->
  9923 <p>Canvas test: 2d.line.join.open</p>
  9924 <!-- Testing: Line joins are not drawn at the corner of an unclosed rectangle -->
  9925 <canvas id="c317" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  9926 <script>
  9929 function test_2d_line_join_open() {
  9931 var canvas = document.getElementById('c317');
  9932 var ctx = canvas.getContext('2d');
  9934 ctx.fillStyle = '#0f0';
  9935 ctx.strokeStyle = '#f00';
  9936 ctx.fillRect(0, 0, 100, 50);
  9938 ctx.lineJoin = 'miter';
  9939 ctx.lineWidth = 200;
  9941 ctx.beginPath();
  9942 ctx.moveTo(100, 50);
  9943 ctx.lineTo(100, 1000);
  9944 ctx.lineTo(1000, 1000);
  9945 ctx.lineTo(1000, 50);
  9946 ctx.lineTo(100, 50);
  9947 ctx.stroke();
  9949 isPixel(ctx, 1,1, 0,255,0,255, 0);
  9950 isPixel(ctx, 48,1, 0,255,0,255, 0);
  9951 isPixel(ctx, 48,48, 0,255,0,255, 0);
  9952 isPixel(ctx, 1,48, 0,255,0,255, 0);
  9956 </script>
  9958 <!-- [[[ test_2d.line.join.parallel.html ]]] -->
  9960 <p>Canvas test: 2d.line.join.parallel</p>
  9961 <!-- Testing: Line joins are drawn at 180-degree joins -->
  9962 <canvas id="c318" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  9963 <script>
  9966 function test_2d_line_join_parallel() {
  9968 var canvas = document.getElementById('c318');
  9969 var ctx = canvas.getContext('2d');
  9971 ctx.fillStyle = '#f00';
  9972 ctx.fillRect(0, 0, 100, 50);
  9974 ctx.strokeStyle = '#0f0';
  9975 ctx.lineWidth = 300;
  9976 ctx.lineJoin = 'round';
  9977 ctx.beginPath();
  9978 ctx.moveTo(-100, 25);
  9979 ctx.lineTo(0, 25);
  9980 ctx.lineTo(-100, 25);
  9981 ctx.stroke();
  9983 isPixel(ctx, 1,1, 0,255,0,255, 0);
  9984 isPixel(ctx, 48,1, 0,255,0,255, 0);
  9985 isPixel(ctx, 48,48, 0,255,0,255, 0);
  9986 isPixel(ctx, 1,48, 0,255,0,255, 0);
  9990 </script>
  9992 <!-- [[[ test_2d.line.join.round.html ]]] -->
  9994 <p>Canvas test: 2d.line.join.round</p>
  9995 <!-- Testing: lineJoin 'round' is rendered correctly -->
  9996 <canvas id="c319" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
  9997 <script>
 10000 function test_2d_line_join_round() {
 10002 var canvas = document.getElementById('c319');
 10003 var ctx = canvas.getContext('2d');
 10005 ctx.fillStyle = '#0f0';
 10006 ctx.fillRect(0, 0, 100, 50);
 10008 var tol = 1; // tolerance to avoid antialiasing artifacts
 10010 ctx.lineJoin = 'round';
 10011 ctx.lineWidth = 20;
 10013 ctx.fillStyle = '#f00';
 10014 ctx.strokeStyle = '#0f0';
 10016 ctx.fillRect(10, 10, 20, 20);
 10017 ctx.fillRect(20, 20, 20, 20);
 10018 ctx.beginPath();
 10019 ctx.moveTo(30, 20);
 10020 ctx.arc(30, 20, 10-tol, 0, 2*Math.PI, true);
 10021 ctx.fill();
 10023 ctx.beginPath();
 10024 ctx.moveTo(10, 20);
 10025 ctx.lineTo(30, 20);
 10026 ctx.lineTo(30, 40);
 10027 ctx.stroke();
 10030 ctx.fillStyle = '#0f0';
 10031 ctx.strokeStyle = '#f00';
 10033 ctx.beginPath();
 10034 ctx.moveTo(60, 20);
 10035 ctx.lineTo(80, 20);
 10036 ctx.lineTo(80, 40);
 10037 ctx.stroke();
 10039 ctx.fillRect(60, 10, 20, 20);
 10040 ctx.fillRect(70, 20, 20, 20);
 10041 ctx.beginPath();
 10042 ctx.moveTo(80, 20);
 10043 ctx.arc(80, 20, 10+tol, 0, 2*Math.PI, true);
 10044 ctx.fill();
 10046 isPixel(ctx, 36,14, 0,255,0,255, 0);
 10047 isPixel(ctx, 36,13, 0,255,0,255, 0);
 10048 isPixel(ctx, 37,13, 0,255,0,255, 0);
 10049 isPixel(ctx, 38,13, 0,255,0,255, 0);
 10050 isPixel(ctx, 38,12, 0,255,0,255, 0);
 10052 isPixel(ctx, 86,14, 0,255,0,255, 0);
 10053 isPixel(ctx, 86,13, 0,255,0,255, 0);
 10054 isPixel(ctx, 87,13, 0,255,0,255, 0);
 10055 isPixel(ctx, 88,13, 0,255,0,255, 0);
 10056 isPixel(ctx, 88,12, 0,255,0,255, 0);
 10060 </script>
 10062 <!-- [[[ test_2d.line.miter.acute.html ]]] -->
 10064 <p>Canvas test: 2d.line.miter.acute</p>
 10065 <!-- Testing: Miter joins are drawn correctly with acute angles -->
 10066 <canvas id="c320" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 10067 <script>
 10070 function test_2d_line_miter_acute() {
 10072 var canvas = document.getElementById('c320');
 10073 var ctx = canvas.getContext('2d');
 10075 ctx.fillStyle = '#f00';
 10076 ctx.fillRect(0, 0, 100, 50);
 10078 ctx.lineWidth = 200;
 10079 ctx.lineJoin = 'miter';
 10081 ctx.strokeStyle = '#0f0';
 10082 ctx.miterLimit = 2.614;
 10083 ctx.beginPath();
 10084 ctx.moveTo(100, 1000);
 10085 ctx.lineTo(100, 100);
 10086 ctx.lineTo(1000, 1000);
 10087 ctx.stroke();
 10089 ctx.strokeStyle = '#f00';
 10090 ctx.miterLimit = 2.613;
 10091 ctx.beginPath();
 10092 ctx.moveTo(100, 1000);
 10093 ctx.lineTo(100, 100);
 10094 ctx.lineTo(1000, 1000);
 10095 ctx.stroke();
 10097 isPixel(ctx, 1,1, 0,255,0,255, 0);
 10098 isPixel(ctx, 48,1, 0,255,0,255, 0);
 10099 isPixel(ctx, 48,48, 0,255,0,255, 0);
 10100 isPixel(ctx, 1,48, 0,255,0,255, 0);
 10104 </script>
 10106 <!-- [[[ test_2d.line.miter.exceeded.html ]]] -->
 10108 <p>Canvas test: 2d.line.miter.exceeded</p>
 10109 <!-- Testing: Miter joins are not drawn when the miter limit is exceeded -->
 10110 <canvas id="c321" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 10111 <script>
 10114 function test_2d_line_miter_exceeded() {
 10116 var canvas = document.getElementById('c321');
 10117 var ctx = canvas.getContext('2d');
 10119 ctx.fillStyle = '#0f0';
 10120 ctx.fillRect(0, 0, 100, 50);
 10122 ctx.lineWidth = 400;
 10123 ctx.lineJoin = 'miter';
 10125 ctx.strokeStyle = '#f00';
 10126 ctx.miterLimit = 1.414;
 10127 ctx.beginPath();
 10128 ctx.moveTo(200, 1000);
 10129 ctx.lineTo(200, 200);
 10130 ctx.lineTo(1000, 201); // slightly non-right-angle to avoid being a special case
 10131 ctx.stroke();
 10133 isPixel(ctx, 1,1, 0,255,0,255, 0);
 10134 isPixel(ctx, 48,1, 0,255,0,255, 0);
 10135 isPixel(ctx, 48,48, 0,255,0,255, 0);
 10136 isPixel(ctx, 1,48, 0,255,0,255, 0);
 10140 </script>
 10142 <!-- [[[ test_2d.line.miter.invalid.html ]]] -->
 10144 <p>Canvas test: 2d.line.miter.invalid</p>
 10145 <!-- Testing: Setting miterLimit to invalid values is ignored -->
 10146 <canvas id="c322" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 10147 <script>
 10149 function test_2d_line_miter_invalid() {
 10151 var canvas = document.getElementById('c322');
 10152 var ctx = canvas.getContext('2d');
 10154 var _thrown_outer = false;
 10155 try {
 10157 ctx.miterLimit = 1.5;
 10158 ok(ctx.miterLimit === 1.5, "ctx.miterLimit === 1.5");
 10160 ctx.miterLimit = 1.5;
 10161 ctx.miterLimit = 0;
 10162 ok(ctx.miterLimit === 1.5, "ctx.miterLimit === 1.5");
 10164 ctx.miterLimit = 1.5;
 10165 ctx.miterLimit = -1;
 10166 ok(ctx.miterLimit === 1.5, "ctx.miterLimit === 1.5");
 10168 ctx.miterLimit = 1.5;
 10169 ctx.miterLimit = Infinity;
 10170 ok(ctx.miterLimit === 1.5, "ctx.miterLimit === 1.5");
 10172 ctx.miterLimit = 1.5;
 10173 ctx.miterLimit = -Infinity;
 10174 ok(ctx.miterLimit === 1.5, "ctx.miterLimit === 1.5");
 10176 ctx.miterLimit = 1.5;
 10177 ctx.miterLimit = NaN;
 10178 ok(ctx.miterLimit === 1.5, "ctx.miterLimit === 1.5");
 10180 } catch (e) {
 10181     _thrown_outer = true;
 10183 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 10187 </script>
 10189 <!-- [[[ test_2d.line.miter.lineedge.html ]]] -->
 10191 <p>Canvas test: 2d.line.miter.lineedge - bug 401791</p>
 10192 <!-- Testing: Miter joins are not drawn when the miter limit is exceeded at the corners of a zero-height rectangle -->
 10193 <canvas id="c323" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 10194 <script>
 10197 function test_2d_line_miter_lineedge() {
 10199 var canvas = document.getElementById('c323');
 10200 var ctx = canvas.getContext('2d');
 10202 ctx.fillStyle = '#0f0';
 10203 ctx.fillRect(0, 0, 100, 50);
 10205 ctx.lineWidth = 200;
 10206 ctx.lineJoin = 'miter';
 10208 ctx.strokeStyle = '#f00';
 10209 ctx.miterLimit = 1.414;
 10210 ctx.beginPath();
 10211 ctx.strokeRect(100, 25, 200, 0);
 10213 isPixel(ctx, 1,1, 0,255,0,255, 0);
 10214 isPixel(ctx, 48,1, 0,255,0,255, 0);
 10215 isPixel(ctx, 48,48, 0,255,0,255, 0);
 10216 isPixel(ctx, 1,48, 0,255,0,255, 0);
 10220 </script>
 10222 <!-- [[[ test_2d.line.miter.obtuse.html ]]] -->
 10224 <p>Canvas test: 2d.line.miter.obtuse</p>
 10225 <!-- Testing: Miter joins are drawn correctly with obtuse angles -->
 10226 <canvas id="c324" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 10227 <script>
 10230 function test_2d_line_miter_obtuse() {
 10232 var canvas = document.getElementById('c324');
 10233 var ctx = canvas.getContext('2d');
 10235 ctx.fillStyle = '#f00';
 10236 ctx.fillRect(0, 0, 100, 50);
 10238 var x=800;
 10239 var y=300;
 10240 ctx.lineWidth = 1600;
 10241 ctx.lineJoin = 'miter';
 10243 ctx.strokeStyle = '#0f0';
 10244 ctx.miterLimit = 1.083;
 10245 ctx.beginPath();
 10246 ctx.moveTo(800, 10000);
 10247 ctx.lineTo(800, 300);
 10248 ctx.lineTo(10000, -8900);
 10249 ctx.stroke();
 10251 ctx.strokeStyle = '#f00';
 10252 ctx.miterLimit = 1.082;
 10253 ctx.beginPath();
 10254 ctx.moveTo(800, 10000);
 10255 ctx.lineTo(800, 300);
 10256 ctx.lineTo(10000, -8900);
 10257 ctx.stroke();
 10259 isPixel(ctx, 1,1, 0,255,0,255, 0);
 10260 isPixel(ctx, 48,1, 0,255,0,255, 0);
 10261 isPixel(ctx, 48,48, 0,255,0,255, 0);
 10262 isPixel(ctx, 1,48, 0,255,0,255, 0);
 10266 </script>
 10268 <!-- [[[ test_2d.line.miter.rightangle.html ]]] -->
 10270 <p>Canvas test: 2d.line.miter.rightangle - bug 401791</p>
 10271 <!-- Testing: Miter joins are not drawn when the miter limit is exceeded, on exact right angles -->
 10272 <canvas id="c325" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 10273 <script>
 10276 function test_2d_line_miter_rightangle() {
 10278 var canvas = document.getElementById('c325');
 10279 var ctx = canvas.getContext('2d');
 10281 ctx.fillStyle = '#0f0';
 10282 ctx.fillRect(0, 0, 100, 50);
 10284 ctx.lineWidth = 400;
 10285 ctx.lineJoin = 'miter';
 10287 ctx.strokeStyle = '#f00';
 10288 ctx.miterLimit = 1.414;
 10289 ctx.beginPath();
 10290 ctx.moveTo(200, 1000);
 10291 ctx.lineTo(200, 200);
 10292 ctx.lineTo(1000, 200);
 10293 ctx.stroke();
 10295 isPixel(ctx, 1,1, 0,255,0,255, 0);
 10296 isPixel(ctx, 48,1, 0,255,0,255, 0);
 10297 isPixel(ctx, 48,48, 0,255,0,255, 0);
 10298 isPixel(ctx, 1,48, 0,255,0,255, 0);
 10302 </script>
 10304 <!-- [[[ test_2d.line.miter.within.html ]]] -->
 10306 <p>Canvas test: 2d.line.miter.within</p>
 10307 <!-- Testing: Miter joins are drawn when the miter limit is not quite exceeded -->
 10308 <canvas id="c326" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 10309 <script>
 10312 function test_2d_line_miter_within() {
 10314 var canvas = document.getElementById('c326');
 10315 var ctx = canvas.getContext('2d');
 10317 ctx.fillStyle = '#f00';
 10318 ctx.fillRect(0, 0, 100, 50);
 10320 ctx.lineWidth = 400;
 10321 ctx.lineJoin = 'miter';
 10323 ctx.strokeStyle = '#0f0';
 10324 ctx.miterLimit = 1.416;
 10325 ctx.beginPath();
 10326 ctx.moveTo(200, 1000);
 10327 ctx.lineTo(200, 200);
 10328 ctx.lineTo(1000, 201);
 10329 ctx.stroke();
 10331 isPixel(ctx, 1,1, 0,255,0,255, 0);
 10332 isPixel(ctx, 48,1, 0,255,0,255, 0);
 10333 isPixel(ctx, 48,48, 0,255,0,255, 0);
 10334 isPixel(ctx, 1,48, 0,255,0,255, 0);
 10338 </script>
 10340 <!-- [[[ test_2d.line.union.html ]]] -->
 10342 <p>Canvas test: 2d.line.union</p>
 10343 <canvas id="c327" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 10344 <script>
 10347 function test_2d_line_union() {
 10349 var canvas = document.getElementById('c327');
 10350 var ctx = canvas.getContext('2d');
 10352 ctx.fillStyle = '#f00';
 10353 ctx.fillRect(0, 0, 100, 50);
 10355 ctx.lineWidth = 100;
 10356 ctx.lineCap = 'round';
 10358 ctx.strokeStyle = '#0f0';
 10359 ctx.beginPath();
 10360 ctx.moveTo(0, 24);
 10361 ctx.lineTo(100, 25);
 10362 ctx.lineTo(0, 26);
 10363 ctx.closePath();
 10364 ctx.stroke();
 10366 isPixel(ctx, 1,1, 0,255,0,255, 0);
 10367 isPixel(ctx, 25,1, 0,255,0,255, 0);
 10368 isPixel(ctx, 48,1, 0,255,0,255, 0);
 10369 isPixel(ctx, 1,48, 0,255,0,255, 0);
 10370 isPixel(ctx, 25,1, 0,255,0,255, 0);
 10371 isPixel(ctx, 48,48, 0,255,0,255, 0);
 10375 </script>
 10377 <!-- [[[ test_2d.line.width.basic.html ]]] -->
 10379 <p>Canvas test: 2d.line.width.basic</p>
 10380 <!-- Testing: lineWidth determines the width of line strokes -->
 10381 <canvas id="c328" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 10382 <script>
 10385 function test_2d_line_width_basic() {
 10387 var canvas = document.getElementById('c328');
 10388 var ctx = canvas.getContext('2d');
 10390 ctx.fillStyle = '#0f0';
 10391 ctx.fillRect(0, 0, 100, 50);
 10393 ctx.lineWidth = 20;
 10394 // Draw a green line over a red box, to check the line is not too small
 10395 ctx.fillStyle = '#f00';
 10396 ctx.strokeStyle = '#0f0';
 10397 ctx.fillRect(15, 15, 20, 20);
 10398 ctx.beginPath();
 10399 ctx.moveTo(25, 15);
 10400 ctx.lineTo(25, 35);
 10401 ctx.stroke();
 10403 // Draw a green box over a red line, to check the line is not too large
 10404 ctx.fillStyle = '#0f0';
 10405 ctx.strokeStyle = '#f00';
 10406 ctx.beginPath();
 10407 ctx.moveTo(75, 15);
 10408 ctx.lineTo(75, 35);
 10409 ctx.stroke();
 10410 ctx.fillRect(65, 15, 20, 20);
 10412 isPixel(ctx, 14,25, 0,255,0,255, 0);
 10413 isPixel(ctx, 15,25, 0,255,0,255, 0);
 10414 isPixel(ctx, 16,25, 0,255,0,255, 0);
 10415 isPixel(ctx, 25,25, 0,255,0,255, 0);
 10416 isPixel(ctx, 34,25, 0,255,0,255, 0);
 10417 isPixel(ctx, 35,25, 0,255,0,255, 0);
 10418 isPixel(ctx, 36,25, 0,255,0,255, 0);
 10420 isPixel(ctx, 64,25, 0,255,0,255, 0);
 10421 isPixel(ctx, 65,25, 0,255,0,255, 0);
 10422 isPixel(ctx, 66,25, 0,255,0,255, 0);
 10423 isPixel(ctx, 75,25, 0,255,0,255, 0);
 10424 isPixel(ctx, 84,25, 0,255,0,255, 0);
 10425 isPixel(ctx, 85,25, 0,255,0,255, 0);
 10426 isPixel(ctx, 86,25, 0,255,0,255, 0);
 10430 </script>
 10432 <!-- [[[ test_2d.line.width.invalid.html ]]] -->
 10434 <p>Canvas test: 2d.line.width.invalid</p>
 10435 <!-- Testing: Setting lineWidth to invalid values is ignored -->
 10436 <canvas id="c329" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 10437 <script>
 10439 function test_2d_line_width_invalid() {
 10441 var canvas = document.getElementById('c329');
 10442 var ctx = canvas.getContext('2d');
 10444 var _thrown_outer = false;
 10445 try {
 10447 ctx.lineWidth = 1.5;
 10448 ok(ctx.lineWidth === 1.5, "ctx.lineWidth === 1.5");
 10450 ctx.lineWidth = 1.5;
 10451 ctx.lineWidth = 0;
 10452 ok(ctx.lineWidth === 1.5, "ctx.lineWidth === 1.5");
 10454 ctx.lineWidth = 1.5;
 10455 ctx.lineWidth = -1;
 10456 ok(ctx.lineWidth === 1.5, "ctx.lineWidth === 1.5");
 10458 ctx.lineWidth = 1.5;
 10459 ctx.lineWidth = Infinity;
 10460 ok(ctx.lineWidth === 1.5, "ctx.lineWidth === 1.5");
 10462 ctx.lineWidth = 1.5;
 10463 ctx.lineWidth = -Infinity;
 10464 ok(ctx.lineWidth === 1.5, "ctx.lineWidth === 1.5");
 10466 ctx.lineWidth = 1.5;
 10467 ctx.lineWidth = NaN;
 10468 ok(ctx.lineWidth === 1.5, "ctx.lineWidth === 1.5");
 10470 } catch (e) {
 10471     _thrown_outer = true;
 10473 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 10477 </script>
 10479 <!-- [[[ test_2d.line.width.transformed.html ]]] -->
 10481 <p>Canvas test: 2d.line.width.transformed</p>
 10482 <!-- Testing: Line stroke widths are affected by scale transformations -->
 10483 <canvas id="c330" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 10484 <script>
 10487 function test_2d_line_width_transformed() {
 10489 var canvas = document.getElementById('c330');
 10490 var ctx = canvas.getContext('2d');
 10492 ctx.fillStyle = '#0f0';
 10493 ctx.fillRect(0, 0, 100, 50);
 10495 ctx.lineWidth = 4;
 10496 // Draw a green line over a red box, to check the line is not too small
 10497 ctx.fillStyle = '#f00';
 10498 ctx.strokeStyle = '#0f0';
 10499 ctx.fillRect(15, 15, 20, 20);
 10500 ctx.save();
 10501  ctx.scale(5, 1);
 10502  ctx.beginPath();
 10503  ctx.moveTo(5, 15);
 10504  ctx.lineTo(5, 35);
 10505  ctx.stroke();
 10506 ctx.restore();
 10508 // Draw a green box over a red line, to check the line is not too large
 10509 ctx.fillStyle = '#0f0';
 10510 ctx.strokeStyle = '#f00';
 10511 ctx.save();
 10512  ctx.scale(-5, 1);
 10513  ctx.beginPath();
 10514  ctx.moveTo(-15, 15);
 10515  ctx.lineTo(-15, 35);
 10516  ctx.stroke();
 10517 ctx.restore();
 10518 ctx.fillRect(65, 15, 20, 20);
 10520 isPixel(ctx, 14,25, 0,255,0,255, 0);
 10521 isPixel(ctx, 15,25, 0,255,0,255, 0);
 10522 isPixel(ctx, 16,25, 0,255,0,255, 0);
 10523 isPixel(ctx, 25,25, 0,255,0,255, 0);
 10524 isPixel(ctx, 34,25, 0,255,0,255, 0);
 10525 isPixel(ctx, 35,25, 0,255,0,255, 0);
 10526 isPixel(ctx, 36,25, 0,255,0,255, 0);
 10528 isPixel(ctx, 64,25, 0,255,0,255, 0);
 10529 isPixel(ctx, 65,25, 0,255,0,255, 0);
 10530 isPixel(ctx, 66,25, 0,255,0,255, 0);
 10531 isPixel(ctx, 75,25, 0,255,0,255, 0);
 10532 isPixel(ctx, 84,25, 0,255,0,255, 0);
 10533 isPixel(ctx, 85,25, 0,255,0,255, 0);
 10534 isPixel(ctx, 86,25, 0,255,0,255, 0);
 10538 </script>
 10540 <!-- [[[ test_2d.missingargs.html ]]] -->
 10542 <p>Canvas test: 2d.missingargs</p>
 10543 <!-- Testing: Missing arguments cause NOT_SUPPORTED_ERR -->
 10544 <canvas id="c331" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 10545 <script>
 10547 function test_2d_missingargs() {
 10549 var canvas = document.getElementById('c331');
 10550 var ctx = canvas.getContext('2d');
 10552 var _thrown = undefined; try {
 10553   ctx.scale();
 10554 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10555 var _thrown = undefined; try {
 10556   ctx.scale(1);
 10557 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10558 var _thrown = undefined; try {
 10559   ctx.rotate();
 10560 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10561 var _thrown = undefined; try {
 10562   ctx.translate();
 10563 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10564 var _thrown = undefined; try {
 10565   ctx.translate(0);
 10566 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10567 if (ctx.transform) { // (avoid spurious failures, since the aim here is not to test that all features are supported)
 10568     var _thrown = undefined; try {
 10569   ctx.transform();
 10570 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10571     var _thrown = undefined; try {
 10572   ctx.transform(1);
 10573 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10574     var _thrown = undefined; try {
 10575   ctx.transform(1, 0);
 10576 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10577     var _thrown = undefined; try {
 10578   ctx.transform(1, 0, 0);
 10579 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10580     var _thrown = undefined; try {
 10581   ctx.transform(1, 0, 0, 1);
 10582 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10583     var _thrown = undefined; try {
 10584   ctx.transform(1, 0, 0, 1, 0);
 10585 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10587 if (ctx.setTransform) {
 10588     var _thrown = undefined; try {
 10589   ctx.setTransform();
 10590 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10591     var _thrown = undefined; try {
 10592   ctx.setTransform(1);
 10593 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10594     var _thrown = undefined; try {
 10595   ctx.setTransform(1, 0);
 10596 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10597     var _thrown = undefined; try {
 10598   ctx.setTransform(1, 0, 0);
 10599 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10600     var _thrown = undefined; try {
 10601   ctx.setTransform(1, 0, 0, 1);
 10602 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10603     var _thrown = undefined; try {
 10604   ctx.setTransform(1, 0, 0, 1, 0);
 10605 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10607 var _thrown = undefined; try {
 10608   ctx.createLinearGradient();
 10609 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10610 var _thrown = undefined; try {
 10611   ctx.createLinearGradient(0);
 10612 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10613 var _thrown = undefined; try {
 10614   ctx.createLinearGradient(0, 0);
 10615 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10616 var _thrown = undefined; try {
 10617   ctx.createLinearGradient(0, 0, 1);
 10618 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10619 var _thrown = undefined; try {
 10620   ctx.createRadialGradient();
 10621 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10622 var _thrown = undefined; try {
 10623   ctx.createRadialGradient(0);
 10624 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10625 var _thrown = undefined; try {
 10626   ctx.createRadialGradient(0, 0);
 10627 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10628 var _thrown = undefined; try {
 10629   ctx.createRadialGradient(0, 0, 1);
 10630 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10631 var _thrown = undefined; try {
 10632   ctx.createRadialGradient(0, 0, 1, 0);
 10633 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10634 var _thrown = undefined; try {
 10635   ctx.createRadialGradient(0, 0, 1, 0, 0);
 10636 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10637 var _thrown = undefined; try {
 10638   ctx.createPattern(canvas);
 10639 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10640 var _thrown = undefined; try {
 10641   ctx.clearRect();
 10642 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10643 var _thrown = undefined; try {
 10644   ctx.clearRect(0);
 10645 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10646 var _thrown = undefined; try {
 10647   ctx.clearRect(0, 0);
 10648 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10649 var _thrown = undefined; try {
 10650   ctx.clearRect(0, 0, 0);
 10651 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10652 var _thrown = undefined; try {
 10653   ctx.fillRect();
 10654 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10655 var _thrown = undefined; try {
 10656   ctx.fillRect(0);
 10657 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10658 var _thrown = undefined; try {
 10659   ctx.fillRect(0, 0);
 10660 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10661 var _thrown = undefined; try {
 10662   ctx.fillRect(0, 0, 0);
 10663 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10664 var _thrown = undefined; try {
 10665   ctx.strokeRect();
 10666 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10667 var _thrown = undefined; try {
 10668   ctx.strokeRect(0);
 10669 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10670 var _thrown = undefined; try {
 10671   ctx.strokeRect(0, 0);
 10672 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10673 var _thrown = undefined; try {
 10674   ctx.strokeRect(0, 0, 0);
 10675 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10676 var _thrown = undefined; try {
 10677   ctx.moveTo();
 10678 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10679 var _thrown = undefined; try {
 10680   ctx.moveTo(0);
 10681 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10682 var _thrown = undefined; try {
 10683   ctx.lineTo();
 10684 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10685 var _thrown = undefined; try {
 10686   ctx.lineTo(0);
 10687 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10688 var _thrown = undefined; try {
 10689   ctx.quadraticCurveTo();
 10690 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10691 var _thrown = undefined; try {
 10692   ctx.quadraticCurveTo(0);
 10693 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10694 var _thrown = undefined; try {
 10695   ctx.quadraticCurveTo(0, 0);
 10696 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10697 var _thrown = undefined; try {
 10698   ctx.quadraticCurveTo(0, 0, 0);
 10699 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10700 var _thrown = undefined; try {
 10701   ctx.bezierCurveTo();
 10702 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10703 var _thrown = undefined; try {
 10704   ctx.bezierCurveTo(0);
 10705 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10706 var _thrown = undefined; try {
 10707   ctx.bezierCurveTo(0, 0);
 10708 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10709 var _thrown = undefined; try {
 10710   ctx.bezierCurveTo(0, 0, 0);
 10711 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10712 var _thrown = undefined; try {
 10713   ctx.bezierCurveTo(0, 0, 0, 0);
 10714 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10715 var _thrown = undefined; try {
 10716   ctx.bezierCurveTo(0, 0, 0, 0, 0);
 10717 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10718 var _thrown = undefined; try {
 10719   ctx.arcTo();
 10720 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10721 var _thrown = undefined; try {
 10722   ctx.arcTo(0);
 10723 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10724 var _thrown = undefined; try {
 10725   ctx.arcTo(0, 0);
 10726 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10727 var _thrown = undefined; try {
 10728   ctx.arcTo(0, 0, 0);
 10729 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10730 var _thrown = undefined; try {
 10731   ctx.arcTo(0, 0, 0, 0);
 10732 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10733 var _thrown = undefined; try {
 10734   ctx.rect();
 10735 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10736 var _thrown = undefined; try {
 10737   ctx.rect(0);
 10738 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10739 var _thrown = undefined; try {
 10740   ctx.rect(0, 0);
 10741 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10742 var _thrown = undefined; try {
 10743   ctx.rect(0, 0, 0);
 10744 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10745 var _thrown = undefined; try {
 10746   ctx.arc();
 10747 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10748 var _thrown = undefined; try {
 10749   ctx.arc(0);
 10750 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10751 var _thrown = undefined; try {
 10752   ctx.arc(0, 0);
 10753 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10754 var _thrown = undefined; try {
 10755   ctx.arc(0, 0, 1);
 10756 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10757 var _thrown = undefined; try {
 10758   ctx.arc(0, 0, 1, 0);
 10759 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10760 var _thrown = undefined; try {
 10761   ctx.arc(0, 0, 1, 0, 0);
 10762 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10763 if (ctx.isPointInPath) {
 10764     var _thrown = undefined; try {
 10765   ctx.isPointInPath();
 10766 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10767     var _thrown = undefined; try {
 10768   ctx.isPointInPath(0);
 10769 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10771 var _thrown = undefined; try {
 10772   ctx.drawImage();
 10773 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10774 var _thrown = undefined; try {
 10775   ctx.drawImage(canvas);
 10776 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10777 var _thrown = undefined; try {
 10778   ctx.drawImage(canvas, 0);
 10779 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10780 // TODO: n >= 3 args on drawImage could be either a valid overload,
 10781 // or too few for another overload, or too many for another
 10782 // overload - what should happen?
 10783 if (ctx.createImageData) {
 10784     var _thrown = undefined; try {
 10785   ctx.createImageData();
 10786 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10787     var _thrown = undefined; try {
 10788   ctx.createImageData(1);
 10789 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10791 if (ctx.getImageData) {
 10792     var _thrown = undefined; try {
 10793   ctx.getImageData();
 10794 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10795     var _thrown = undefined; try {
 10796   ctx.getImageData(0);
 10797 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10798     var _thrown = undefined; try {
 10799   ctx.getImageData(0, 0);
 10800 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10801     var _thrown = undefined; try {
 10802   ctx.getImageData(0, 0, 1);
 10803 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10805 if (ctx.putImageData) {
 10806     var imgdata = ctx.getImageData(0, 0, 1, 1);
 10807     var _thrown = undefined; try {
 10808   ctx.putImageData();
 10809 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10810     var _thrown = undefined; try {
 10811   ctx.putImageData(imgdata);
 10812 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10813     var _thrown = undefined; try {
 10814   ctx.putImageData(imgdata, 0);
 10815 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10817 var g = ctx.createLinearGradient(0, 0, 0, 0);
 10818 var _thrown = undefined; try {
 10819   g.addColorStop();
 10820 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10821 var _thrown = undefined; try {
 10822   g.addColorStop(0);
 10823 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 10827 </script>
 10829 <!-- [[[ test_2d.path.arc.angle.1.html ]]] -->
 10831 <p>Canvas test: 2d.path.arc.angle.1</p>
 10832 <!-- Testing: arc() draws pi/2 .. -pi anticlockwise correctly -->
 10833 <canvas id="c332" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 10834 <script>
 10837 function test_2d_path_arc_angle_1() {
 10839 var canvas = document.getElementById('c332');
 10840 var ctx = canvas.getContext('2d');
 10842 ctx.fillStyle = '#0f0';
 10843 ctx.fillRect(0, 0, 100, 50);
 10844 ctx.fillStyle = '#f00';
 10845 ctx.beginPath();
 10846 ctx.moveTo(100, 0);
 10847 ctx.arc(100, 0, 150, Math.PI/2, -Math.PI, true);
 10848 ctx.fill();
 10849 isPixel(ctx, 50,25, 0,255,0,255, 0);
 10853 </script>
 10855 <!-- [[[ test_2d.path.arc.angle.2.html ]]] -->
 10857 <p>Canvas test: 2d.path.arc.angle.2</p>
 10858 <!-- Testing: arc() draws -3pi/2 .. -pi anticlockwise correctly -->
 10859 <canvas id="c333" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 10860 <script>
 10863 function test_2d_path_arc_angle_2() {
 10865 var canvas = document.getElementById('c333');
 10866 var ctx = canvas.getContext('2d');
 10868 ctx.fillStyle = '#0f0';
 10869 ctx.fillRect(0, 0, 100, 50);
 10870 ctx.fillStyle = '#f00';
 10871 ctx.beginPath();
 10872 ctx.moveTo(100, 0);
 10873 ctx.arc(100, 0, 150, -3*Math.PI/2, -Math.PI, true);
 10874 ctx.fill();
 10875 isPixel(ctx, 50,25, 0,255,0,255, 0);
 10879 </script>
 10881 <!-- [[[ test_2d.path.arc.angle.3.html ]]] -->
 10883 <p>Canvas test: 2d.path.arc.angle.3</p>
 10884 <!-- Testing: arc() wraps angles mod 2pi when anticlockwise and end > start+2pi -->
 10885 <canvas id="c334" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 10886 <script>
 10889 function test_2d_path_arc_angle_3() {
 10891 var canvas = document.getElementById('c334');
 10892 var ctx = canvas.getContext('2d');
 10894 ctx.fillStyle = '#0f0';
 10895 ctx.fillRect(0, 0, 100, 50);
 10896 ctx.fillStyle = '#f00';
 10897 ctx.beginPath();
 10898 ctx.moveTo(100, 0);
 10899 ctx.arc(100, 0, 150, (512+1/2)*Math.PI, (1024-1)*Math.PI, true);
 10900 ctx.fill();
 10901 isPixel(ctx, 50,25, 0,255,0,255, 0);
 10905 </script>
 10907 <!-- [[[ test_2d.path.arc.angle.4.html ]]] -->
 10909 <p>Canvas test: 2d.path.arc.angle.4</p>
 10910 <!-- Testing: arc() draws a full circle when clockwise and end > start+2pi -->
 10911 <canvas id="c335" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 10912 <script>
 10915 function test_2d_path_arc_angle_4() {
 10917 var canvas = document.getElementById('c335');
 10918 var ctx = canvas.getContext('2d');
 10920 ctx.fillStyle = '#f00';
 10921 ctx.fillRect(0, 0, 100, 50);
 10922 ctx.fillStyle = '#0f0';
 10923 ctx.beginPath();
 10924 ctx.moveTo(50, 25);
 10925 ctx.arc(50, 25, 60, (512+1/2)*Math.PI, (1024-1)*Math.PI, false);
 10926 ctx.fill();
 10927 isPixel(ctx, 1,1, 0,255,0,255, 0);
 10928 isPixel(ctx, 98,1, 0,255,0,255, 0);
 10929 isPixel(ctx, 1,48, 0,255,0,255, 0);
 10930 isPixel(ctx, 98,48, 0,255,0,255, 0);
 10934 </script>
 10936 <!-- [[[ test_2d.path.arc.angle.5.html ]]] -->
 10938 <p>Canvas test: 2d.path.arc.angle.5</p>
 10939 <!-- Testing: arc() wraps angles mod 2pi when clockwise and start > end+2pi -->
 10940 <canvas id="c336" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 10941 <script>
 10944 function test_2d_path_arc_angle_5() {
 10946 var canvas = document.getElementById('c336');
 10947 var ctx = canvas.getContext('2d');
 10949 ctx.fillStyle = '#0f0';
 10950 ctx.fillRect(0, 0, 100, 50);
 10951 ctx.fillStyle = '#f00';
 10952 ctx.beginPath();
 10953 ctx.moveTo(100, 0);
 10954 ctx.arc(100, 0, 150, (1024-1)*Math.PI, (512+1/2)*Math.PI, false);
 10955 ctx.fill();
 10956 isPixel(ctx, 50,25, 0,255,0,255, 0);
 10960 </script>
 10962 <!-- [[[ test_2d.path.arc.angle.6.html ]]] -->
 10964 <p>Canvas test: 2d.path.arc.angle.6</p>
 10965 <!-- Testing: arc() draws a full circle when anticlockwise and start > end+2pi -->
 10966 <canvas id="c337" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 10967 <script>
 10970 function test_2d_path_arc_angle_6() {
 10972 var canvas = document.getElementById('c337');
 10973 var ctx = canvas.getContext('2d');
 10975 ctx.fillStyle = '#f00';
 10976 ctx.fillRect(0, 0, 100, 50);
 10977 ctx.fillStyle = '#0f0';
 10978 ctx.beginPath();
 10979 ctx.moveTo(50, 25);
 10980 ctx.arc(50, 25, 60, (1024-1)*Math.PI, (512+1/2)*Math.PI, true);
 10981 ctx.fill();
 10982 isPixel(ctx, 1,1, 0,255,0,255, 0);
 10983 isPixel(ctx, 98,1, 0,255,0,255, 0);
 10984 isPixel(ctx, 1,48, 0,255,0,255, 0);
 10985 isPixel(ctx, 98,48, 0,255,0,255, 0);
 10989 </script>
 10991 <!-- [[[ test_2d.path.arc.empty.html ]]] -->
 10993 <p>Canvas test: 2d.path.arc.empty</p>
 10994 <!-- Testing: arc() with an empty path does not draw a straight line to the start point -->
 10995 <canvas id="c338" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 10996 <script>
 10999 function test_2d_path_arc_empty() {
 11001 var canvas = document.getElementById('c338');
 11002 var ctx = canvas.getContext('2d');
 11004 ctx.fillStyle = '#0f0';
 11005 ctx.fillRect(0, 0, 100, 50);
 11006 ctx.lineWidth = 50;
 11007 ctx.strokeStyle = '#f00';
 11008 ctx.beginPath();
 11009 ctx.arc(200, 25, 5, 0, 2*Math.PI, true);
 11010 ctx.stroke();
 11011 isPixel(ctx, 50,25, 0,255,0,255, 0);
 11015 </script>
 11017 <!-- [[[ test_2d.path.arc.end.html ]]] -->
 11019 <p>Canvas test: 2d.path.arc.end</p>
 11020 <!-- Testing: arc() adds the end point of the arc to the subpath -->
 11021 <canvas id="c339" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11022 <script>
 11025 function test_2d_path_arc_end() {
 11027 var canvas = document.getElementById('c339');
 11028 var ctx = canvas.getContext('2d');
 11030 ctx.fillStyle = '#f00';
 11031 ctx.fillRect(0, 0, 100, 50);
 11032 ctx.lineWidth = 50;
 11033 ctx.strokeStyle = '#0f0';
 11034 ctx.beginPath();
 11035 ctx.moveTo(-100, 0);
 11036 ctx.arc(-100, 0, 25, -Math.PI/2, Math.PI/2, true);
 11037 ctx.lineTo(100, 25);
 11038 ctx.stroke();
 11039 isPixel(ctx, 50,25, 0,255,0,255, 0);
 11043 </script>
 11045 <!-- [[[ test_2d.path.arc.negative.html ]]] -->
 11047 <p>Canvas test: 2d.path.arc.negative</p>
 11048 <!-- Testing: arc() with negative radius throws INDEX_SIZE_ERR -->
 11049 <canvas id="c340" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11050 <script>
 11052 function test_2d_path_arc_negative() {
 11054 var canvas = document.getElementById('c340');
 11055 var ctx = canvas.getContext('2d');
 11057 var _thrown = undefined; try {
 11058   ctx.arc(0, 0, -1, 0, 0, true);
 11059 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
 11063 </script>
 11065 <!-- [[[ test_2d.path.arc.nonempty.html ]]] -->
 11067 <p>Canvas test: 2d.path.arc.nonempty</p>
 11068 <!-- Testing: arc() with a non-empty path does draw a straight line to the start point -->
 11069 <canvas id="c341" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11070 <script>
 11073 function test_2d_path_arc_nonempty() {
 11075 var canvas = document.getElementById('c341');
 11076 var ctx = canvas.getContext('2d');
 11078 ctx.fillStyle = '#f00';
 11079 ctx.fillRect(0, 0, 100, 50);
 11080 ctx.lineWidth = 50;
 11081 ctx.strokeStyle = '#0f0';
 11082 ctx.beginPath();
 11083 ctx.moveTo(0, 25);
 11084 ctx.arc(200, 25, 5, 0, 2*Math.PI, true);
 11085 ctx.stroke();
 11086 isPixel(ctx, 50,25, 0,255,0,255, 0);
 11090 </script>
 11092 <!-- [[[ test_2d.path.arc.nonfinite.html ]]] -->
 11094 <p>Canvas test: 2d.path.arc.nonfinite</p>
 11095 <!-- Testing: arc() with Infinity/NaN is ignored -->
 11096 <canvas id="c342" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11097 <script>
 11100 function test_2d_path_arc_nonfinite() {
 11102 var canvas = document.getElementById('c342');
 11103 var ctx = canvas.getContext('2d');
 11105 var _thrown_outer = false;
 11106 try {
 11108 ctx.fillStyle = '#f00';
 11109 ctx.fillRect(0, 0, 100, 50);
 11110 ctx.moveTo(0, 0);
 11111 ctx.lineTo(100, 0);
 11112 ctx.arc(Infinity, 50, 0, 2*Math.PI, true);
 11113 ctx.arc(-Infinity, 50, 0, 2*Math.PI, true);
 11114 ctx.arc(NaN, 50, 0, 2*Math.PI, true);
 11115 ctx.arc(0, Infinity, 0, 2*Math.PI, true);
 11116 ctx.arc(0, -Infinity, 0, 2*Math.PI, true);
 11117 ctx.arc(0, NaN, 0, 2*Math.PI, true);
 11118 ctx.arc(0, 50, Infinity, 2*Math.PI, true);
 11119 ctx.arc(0, 50, -Infinity, 2*Math.PI, true);
 11120 ctx.arc(0, 50, NaN, 2*Math.PI, true);
 11121 ctx.arc(0, 50, 0, Infinity, true);
 11122 ctx.arc(0, 50, 0, -Infinity, true);
 11123 ctx.arc(0, 50, 0, NaN, true);
 11124 ctx.arc(Infinity, Infinity, 0, 2*Math.PI, true);
 11125 ctx.arc(Infinity, Infinity, Infinity, 2*Math.PI, true);
 11126 ctx.arc(Infinity, Infinity, Infinity, Infinity, true);
 11127 ctx.arc(Infinity, Infinity, 0, Infinity, true);
 11128 ctx.arc(Infinity, 50, Infinity, 2*Math.PI, true);
 11129 ctx.arc(Infinity, 50, Infinity, Infinity, true);
 11130 ctx.arc(Infinity, 50, 0, Infinity, true);
 11131 ctx.arc(0, Infinity, Infinity, 2*Math.PI, true);
 11132 ctx.arc(0, Infinity, Infinity, Infinity, true);
 11133 ctx.arc(0, Infinity, 0, Infinity, true);
 11134 ctx.arc(0, 50, Infinity, Infinity, true);
 11135 ctx.lineTo(100, 50);
 11136 ctx.lineTo(0, 50);
 11137 ctx.fillStyle = '#0f0';
 11138 ctx.fill();
 11139 isPixel(ctx, 50,25, 0,255,0,255, 0);
 11140 isPixel(ctx, 90,45, 0,255,0,255, 0);
 11142 } catch (e) {
 11143     _thrown_outer = true;
 11145 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 11149 </script>
 11151 <!-- [[[ test_2d.path.arc.scale.1.html ]]] -->
 11153 <p>Canvas test: 2d.path.arc.scale.1</p>
 11154 <!-- Testing: Non-uniformly scaled arcs are the right shape -->
 11155 <canvas id="c343" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11156 <script>
 11159 function test_2d_path_arc_scale_1() {
 11161 var canvas = document.getElementById('c343');
 11162 var ctx = canvas.getContext('2d');
 11164 ctx.fillStyle = '#f00';
 11165 ctx.fillRect(0, 0, 100, 50);
 11166 ctx.scale(2, 0.5);
 11167 ctx.fillStyle = '#0f0';
 11168 ctx.beginPath();
 11169 var hypothenuse = Math.sqrt(50 * 50 + 25 * 25);
 11170 var tolerance = 0.5;
 11171 var radius = hypothenuse + tolerance;
 11172 ctx.arc(25, 50, radius, 0, 2*Math.PI, false);
 11173 ctx.fill();
 11174 ctx.fillStyle = '#f00';
 11175 ctx.beginPath();
 11176 ctx.moveTo(-25, 50);
 11177 ctx.arc(-25, 50, 24, 0, 2*Math.PI, false);
 11178 ctx.moveTo(75, 50);
 11179 ctx.arc(75, 50, 24, 0, 2*Math.PI, false);
 11180 ctx.moveTo(25, -25);
 11181 ctx.arc(25, -25, 24, 0, 2*Math.PI, false);
 11182 ctx.moveTo(25, 125);
 11183 ctx.arc(25, 125, 24, 0, 2*Math.PI, false);
 11184 ctx.fill();
 11186 isPixel(ctx, 0,0, 0,255,0,255, 0);
 11187 isPixel(ctx, 50,0, 0,255,0,255, 0);
 11188 isPixel(ctx, 99,0, 0,255,0,255, 0);
 11189 isPixel(ctx, 0,25, 0,255,0,255, 0);
 11190 isPixel(ctx, 50,25, 0,255,0,255, 0);
 11191 isPixel(ctx, 99,25, 0,255,0,255, 0);
 11192 isPixel(ctx, 0,49, 0,255,0,255, 0);
 11193 isPixel(ctx, 50,49, 0,255,0,255, 0);
 11194 isPixel(ctx, 99,49, 0,255,0,255, 0);
 11198 </script>
 11200 <!-- [[[ test_2d.path.arc.scale.2.html ]]] -->
 11202 <p>Canvas test: 2d.path.arc.scale.2</p>
 11203 <!-- Testing: Highly scaled arcs are the right shape -->
 11204 <canvas id="c344" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11205 <script>
 11208 function test_2d_path_arc_scale_2() {
 11210 var canvas = document.getElementById('c344');
 11211 var ctx = canvas.getContext('2d');
 11213 ctx.fillStyle = '#f00';
 11214 ctx.fillRect(0, 0, 100, 50);
 11215 ctx.scale(100, 100);
 11216 ctx.strokeStyle = '#0f0';
 11217 ctx.lineWidth = 1.2;
 11218 ctx.beginPath();
 11219 ctx.arc(0, 0, 0.6, 0, Math.PI/2, false);
 11220 ctx.stroke();
 11222 isPixel(ctx, 1,1, 0,255,0,255, 0);
 11223 isPixel(ctx, 50,1, 0,255,0,255, 0);
 11224 isPixel(ctx, 98,1, 0,255,0,255, 0);
 11225 isPixel(ctx, 1,25, 0,255,0,255, 0);
 11226 isPixel(ctx, 50,25, 0,255,0,255, 0);
 11227 isPixel(ctx, 98,25, 0,255,0,255, 0);
 11228 isPixel(ctx, 1,48, 0,255,0,255, 0);
 11229 isPixel(ctx, 50,48, 0,255,0,255, 0);
 11230 isPixel(ctx, 98,48, 0,255,0,255, 0);
 11234 </script>
 11236 <!-- [[[ test_2d.path.arc.selfintersect.1.html ]]] -->
 11238 <p>Canvas test: 2d.path.arc.selfintersect.1</p>
 11239 <!-- Testing: arc() with lineWidth > 2*radius is drawn sensibly -->
 11240 <canvas id="c345" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11241 <script>
 11244 function test_2d_path_arc_selfintersect_1() {
 11246 var canvas = document.getElementById('c345');
 11247 var ctx = canvas.getContext('2d');
 11249 ctx.fillStyle = '#0f0';
 11250 ctx.fillRect(0, 0, 100, 50);
 11251 ctx.lineWidth = 200;
 11252 ctx.strokeStyle = '#f00';
 11253 ctx.beginPath();
 11254 ctx.arc(100, 50, 25, 0, -Math.PI/2, true);
 11255 ctx.stroke();
 11256 ctx.beginPath();
 11257 ctx.arc(0, 0, 25, 0, -Math.PI/2, true);
 11258 ctx.stroke();
 11259 isPixel(ctx, 50,25, 0,255,0,255, 0);
 11263 </script>
 11265 <!-- [[[ test_2d.path.arc.selfintersect.2.html ]]] -->
 11267 <p>Canvas test: 2d.path.arc.selfintersect.2</p>
 11268 <!-- Testing: arc() with lineWidth > 2*radius is drawn sensibly -->
 11269 <canvas id="c346" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11270 <script>
 11273 function test_2d_path_arc_selfintersect_2() {
 11275 var canvas = document.getElementById('c346');
 11276 var ctx = canvas.getContext('2d');
 11278 ctx.fillStyle = '#f00';
 11279 ctx.fillRect(0, 0, 100, 50);
 11280 ctx.lineWidth = 180;
 11281 ctx.strokeStyle = '#0f0';
 11282 ctx.beginPath();
 11283 ctx.arc(-50, 50, 25, 0, -Math.PI/2, true);
 11284 ctx.stroke();
 11285 ctx.beginPath();
 11286 ctx.arc(100, 0, 25, 0, -Math.PI/2, true);
 11287 ctx.stroke();
 11288 isPixel(ctx, 50,25, 0,255,0,255, 0);
 11289 isPixel(ctx, 90,10, 0,255,0,255, 0);
 11290 isPixel(ctx, 97,1, 0,255,0,255, 0);
 11291 isPixel(ctx, 97,2, 0,255,0,255, 0);
 11292 isPixel(ctx, 97,3, 0,255,0,255, 0);
 11293 isPixel(ctx, 2,48, 0,255,0,255, 0);
 11297 </script>
 11299 <!-- [[[ test_2d.path.arc.shape.1.html ]]] -->
 11301 <p>Canvas test: 2d.path.arc.shape.1</p>
 11302 <!-- Testing: arc() from 0 to pi does not draw anything in the wrong half -->
 11303 <canvas id="c347" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11304 <script>
 11307 function test_2d_path_arc_shape_1() {
 11309 var canvas = document.getElementById('c347');
 11310 var ctx = canvas.getContext('2d');
 11312 ctx.fillStyle = '#0f0';
 11313 ctx.fillRect(0, 0, 100, 50);
 11314 ctx.lineWidth = 50;
 11315 ctx.strokeStyle = '#f00';
 11316 ctx.beginPath();
 11317 ctx.arc(50, 50, 50, 0, Math.PI, false);
 11318 ctx.stroke();
 11319 isPixel(ctx, 50,25, 0,255,0,255, 0);
 11320 isPixel(ctx, 1,1, 0,255,0,255, 0);
 11321 isPixel(ctx, 98,1, 0,255,0,255, 0);
 11322 isPixel(ctx, 1,48, 0,255,0,255, 0);
 11323 // Fails on Linux with Azure/Cairo only
 11324 // The arc is drawn badly due to Cairo limitations, the error only becomes
 11325 // apparent on Linux because of anti-aliasing, probably due to X.
 11326 // The limitation is that Cairo draws arcs by stroking perpendicular to the arc,
 11327 // and at very large stroke thicknesses, this becomes a fan. Where exactly the
 11328 // 'blades' of the fan appear seems to depend on exactly how the arc is defined
 11329 // and the platform. So if the blades of the fan are where pixels are tested it
 11330 // passes the test, if the testing pixels fall in between the blades, then we fail.
 11331 // With Thebes/Cairo, we were rendering wrong, but got lucky with the test, now
 11332 // we are not so lucky.
 11333 // Bug 764125
 11334 if (IsAzureCairo() && IsLinux()) {
 11335     todo_isPixel(ctx, 20,48, 0,255,0,255, 0);
 11336 } else {
 11337     isPixel(ctx, 20,48, 0,255,0,255, 0);
 11339 isPixel(ctx, 98,48, 0,255,0,255, 0);
 11342 </script>
 11344 <!-- [[[ test_2d.path.arc.shape.2.html ]]] -->
 11346 <p>Canvas test: 2d.path.arc.shape.2</p>
 11347 <!-- Testing: arc() from 0 to pi draws stuff in the right half -->
 11348 <canvas id="c348" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11349 <script>
 11352 function test_2d_path_arc_shape_2() {
 11354 var canvas = document.getElementById('c348');
 11355 var ctx = canvas.getContext('2d');
 11357 ctx.fillStyle = '#f00';
 11358 ctx.fillRect(0, 0, 100, 50);
 11359 ctx.lineWidth = 100;
 11360 ctx.strokeStyle = '#0f0';
 11361 ctx.beginPath();
 11362 ctx.arc(50, 50, 50, 0, Math.PI, true);
 11363 ctx.stroke();
 11364 isPixel(ctx, 50,25, 0,255,0,255, 0);
 11365 isPixel(ctx, 1,1, 0,255,0,255, 0);
 11366 isPixel(ctx, 98,1, 0,255,0,255, 0);
 11367 isPixel(ctx, 1,48, 0,255,0,255, 0);
 11368 isPixel(ctx, 20,48, 0,255,0,255, 0);
 11369 isPixel(ctx, 98,48, 0,255,0,255, 0);
 11373 </script>
 11375 <!-- [[[ test_2d.path.arc.shape.3.html ]]] -->
 11377 <p>Canvas test: 2d.path.arc.shape.3</p>
 11378 <!-- Testing: arc() from 0 to -pi/2 does not draw anything in the wrong quadrant -->
 11379 <canvas id="c349" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11380 <script>
 11384 function test_2d_path_arc_shape_3() {
 11386 var canvas = document.getElementById('c349');
 11387 var ctx = canvas.getContext('2d');
 11389 ctx.fillStyle = '#0f0';
 11390 ctx.fillRect(0, 0, 100, 50);
 11391 ctx.lineWidth = 100;
 11392 ctx.strokeStyle = '#f00';
 11393 ctx.beginPath();
 11394 ctx.arc(0, 50, 50, 0, -Math.PI/2, false);
 11395 ctx.stroke();
 11396 isPixel(ctx, 50,25, 0,255,0,255, 0);
 11397 isPixel(ctx, 1,1, 0,255,0,255, 0);
 11398 isPixel(ctx, 98,1, 0,255,0,255, 0);
 11399 isPixel(ctx, 1,48, 0,255,0,255, 0);
 11400 isPixel(ctx, 98,48, 0,255,0,255, 0);
 11404 </script>
 11406 <!-- [[[ test_2d.path.arc.shape.4.html ]]] -->
 11408 <p>Canvas test: 2d.path.arc.shape.4</p>
 11409 <!-- Testing: arc() from 0 to -pi/2 draws stuff in the right quadrant -->
 11410 <canvas id="c350" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11411 <script>
 11414 function test_2d_path_arc_shape_4() {
 11416 var canvas = document.getElementById('c350');
 11417 var ctx = canvas.getContext('2d');
 11419 ctx.fillStyle = '#f00';
 11420 ctx.fillRect(0, 0, 100, 50);
 11421 ctx.lineWidth = 150;
 11422 ctx.strokeStyle = '#0f0';
 11423 ctx.beginPath();
 11424 ctx.arc(-50, 50, 100, 0, -Math.PI/2, true);
 11425 ctx.stroke();
 11426 isPixel(ctx, 50,25, 0,255,0,255, 0);
 11427 isPixel(ctx, 1,1, 0,255,0,255, 0);
 11428 isPixel(ctx, 98,1, 0,255,0,255, 0);
 11429 isPixel(ctx, 1,48, 0,255,0,255, 0);
 11430 isPixel(ctx, 98,48, 0,255,0,255, 0);
 11434 </script>
 11436 <!-- [[[ test_2d.path.arc.shape.5.html ]]] -->
 11438 <p>Canvas test: 2d.path.arc.shape.5</p>
 11439 <!-- Testing: arc() from 0 to 5pi does not draw crazy things -->
 11440 <canvas id="c351" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11441 <script>
 11444 function test_2d_path_arc_shape_5() {
 11446 var canvas = document.getElementById('c351');
 11447 var ctx = canvas.getContext('2d');
 11449 ctx.fillStyle = '#0f0';
 11450 ctx.fillRect(0, 0, 100, 50);
 11451 ctx.lineWidth = 200;
 11452 ctx.strokeStyle = '#f00';
 11453 ctx.beginPath();
 11454 ctx.arc(300, 0, 100, 0, 5*Math.PI, false);
 11455 ctx.stroke();
 11456 isPixel(ctx, 50,25, 0,255,0,255, 0);
 11457 isPixel(ctx, 1,1, 0,255,0,255, 0);
 11458 isPixel(ctx, 98,1, 0,255,0,255, 0);
 11459 isPixel(ctx, 1,48, 0,255,0,255, 0);
 11460 isPixel(ctx, 98,48, 0,255,0,255, 0);
 11464 </script>
 11466 <!-- [[[ test_2d.path.arc.twopie.1.html ]]] -->
 11468 <p>Canvas test: 2d.path.arc.twopie.1</p>
 11469 <!-- Testing: arc() draws nothing when end = start + 2pi-e and anticlockwise -->
 11470 <canvas id="c352" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11471 <script>
 11474 function test_2d_path_arc_twopie_1() {
 11476 var canvas = document.getElementById('c352');
 11477 var ctx = canvas.getContext('2d');
 11479 ctx.fillStyle = '#0f0';
 11480 ctx.fillRect(0, 0, 100, 50);
 11481 ctx.strokeStyle = '#f00';
 11482 ctx.lineWidth = 100;
 11483 ctx.beginPath();
 11484 ctx.arc(50, 25, 50, 0, 2*Math.PI - 1e-4, true);
 11485 ctx.stroke();
 11486 isPixel(ctx, 50,20, 0,255,0,255, 0);
 11490 </script>
 11492 <!-- [[[ test_2d.path.arc.twopie.2.html ]]] -->
 11494 <p>Canvas test: 2d.path.arc.twopie.2</p>
 11495 <!-- Testing: arc() draws a full circle when end = start + 2pi-e and clockwise -->
 11496 <canvas id="c353" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11497 <script>
 11500 function test_2d_path_arc_twopie_2() {
 11502 var canvas = document.getElementById('c353');
 11503 var ctx = canvas.getContext('2d');
 11505 ctx.fillStyle = '#f00';
 11506 ctx.fillRect(0, 0, 100, 50);
 11507 ctx.strokeStyle = '#0f0';
 11508 ctx.lineWidth = 100;
 11509 ctx.beginPath();
 11510 ctx.arc(50, 25, 50, 0, 2*Math.PI - 1e-4, false);
 11511 ctx.stroke();
 11512 isPixel(ctx, 50,20, 0,255,0,255, 0);
 11516 </script>
 11518 <!-- [[[ test_2d.path.arc.twopie.3.html ]]] -->
 11520 <p>Canvas test: 2d.path.arc.twopie.3</p>
 11521 <!-- Testing: arc() draws a full circle when end = start + 2pi+e and anticlockwise -->
 11522 <canvas id="c354" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11523 <script>
 11526 function test_2d_path_arc_twopie_3() {
 11528 var canvas = document.getElementById('c354');
 11529 var ctx = canvas.getContext('2d');
 11531 ctx.fillStyle = '#f00';
 11532 ctx.fillRect(0, 0, 100, 50);
 11533 ctx.strokeStyle = '#0f0';
 11534 ctx.lineWidth = 100;
 11535 ctx.beginPath();
 11536 ctx.arc(50, 25, 50, 0, 2*Math.PI + 1e-4, true);
 11537 ctx.stroke();
 11538 isPixel(ctx, 50,20, 0,255,0,255, 0);
 11542 </script>
 11544 <!-- [[[ test_2d.path.arc.twopie.4.html ]]] -->
 11546 <p>Canvas test: 2d.path.arc.twopie.4</p>
 11547 <!-- Testing: arc() draws nothing when end = start + 2pi+e and clockwise -->
 11548 <canvas id="c355" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11549 <script>
 11552 function test_2d_path_arc_twopie_4() {
 11554 var canvas = document.getElementById('c355');
 11555 var ctx = canvas.getContext('2d');
 11557 ctx.fillStyle = '#f00';
 11558 ctx.fillRect(0, 0, 100, 50);
 11559 ctx.strokeStyle = '#0f0';
 11560 ctx.lineWidth = 100;
 11561 ctx.beginPath();
 11562 ctx.arc(50, 25, 50, 0, 2*Math.PI + 1e-4, false);
 11563 ctx.stroke();
 11564 isPixel(ctx, 50,20, 0,255,0,255, 0);
 11568 </script>
 11570 <!-- [[[ test_2d.path.arc.zero.1.html ]]] -->
 11572 <p>Canvas test: 2d.path.arc.zero.1</p>
 11573 <!-- Testing: arc() draws nothing when startAngle = endAngle and anticlockwise -->
 11574 <canvas id="c356" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11575 <script>
 11578 function test_2d_path_arc_zero_1() {
 11580 var canvas = document.getElementById('c356');
 11581 var ctx = canvas.getContext('2d');
 11583 ctx.fillStyle = '#0f0';
 11584 ctx.fillRect(0, 0, 100, 50);
 11585 ctx.strokeStyle = '#f00';
 11586 ctx.lineWidth = 100;
 11587 ctx.beginPath();
 11588 ctx.arc(50, 25, 50, 0, 0, true);
 11589 ctx.stroke();
 11590 isPixel(ctx, 50,20, 0,255,0,255, 0);
 11594 </script>
 11596 <!-- [[[ test_2d.path.arc.zero.2.html ]]] -->
 11598 <p>Canvas test: 2d.path.arc.zero.2</p>
 11599 <!-- Testing: arc() draws nothing when startAngle = endAngle and clockwise -->
 11600 <canvas id="c357" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11601 <script>
 11604 function test_2d_path_arc_zero_2() {
 11606 var canvas = document.getElementById('c357');
 11607 var ctx = canvas.getContext('2d');
 11609 ctx.fillStyle = '#0f0';
 11610 ctx.fillRect(0, 0, 100, 50);
 11611 ctx.strokeStyle = '#f00';
 11612 ctx.lineWidth = 100;
 11613 ctx.beginPath();
 11614 ctx.arc(50, 25, 50, 0, 0, false);
 11615 ctx.stroke();
 11616 isPixel(ctx, 50,20, 0,255,0,255, 0);
 11620 </script>
 11622 <!-- [[[ test_2d.path.arc.zeroradius.html ]]] -->
 11624 <p>Canvas test: 2d.path.arc.zeroradius</p>
 11625 <!-- Testing: arc() with zero radius draws a line to the start point -->
 11626 <canvas id="c358" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11627 <script>
 11631 function test_2d_path_arc_zeroradius() {
 11633 var canvas = document.getElementById('c358');
 11634 var ctx = canvas.getContext('2d');
 11636 ctx.fillStyle = '#f00'
 11637 ctx.fillRect(0, 0, 100, 50);
 11638 ctx.lineWidth = 50;
 11639 ctx.strokeStyle = '#0f0';
 11640 ctx.beginPath();
 11641 ctx.moveTo(0, 25);
 11642 ctx.arc(200, 25, 0, 0, Math.PI, true);
 11643 ctx.stroke();
 11645 isPixel(ctx, 50,25, 0,255,0,255, 0);
 11647 </script>
 11649 <!-- [[[ test_2d.path.arcTo.coincide.1.html ]]] -->
 11651 <p>Canvas test: 2d.path.arcTo.coincide.1</p>
 11652 <!-- Testing: arcTo() has no effect if P0 = P1 -->
 11653 <canvas id="c359" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11654 <script>
 11658 function test_2d_path_arcTo_coincide_1() {
 11660 var canvas = document.getElementById('c359');
 11661 var ctx = canvas.getContext('2d');
 11663 ctx.fillStyle = '#f00';
 11664 ctx.fillRect(0, 0, 100, 50);
 11665 ctx.lineWidth = 50;
 11667 ctx.strokeStyle = '#0f0';
 11668 ctx.beginPath();
 11669 ctx.moveTo(0, 25);
 11670 ctx.arcTo(0, 25, 50, 1000, 1);
 11671 ctx.lineTo(100, 25);
 11672 ctx.stroke();
 11674 ctx.strokeStyle = '#f00';
 11675 ctx.beginPath();
 11676 ctx.moveTo(50, 25);
 11677 ctx.arcTo(50, 25, 100, 25, 1);
 11678 ctx.stroke();
 11680 isPixel(ctx, 50,1, 0,255,0,255, 0);
 11681 isPixel(ctx, 50,25, 0,255,0,255, 0);
 11682 isPixel(ctx, 50,48, 0,255,0,255, 0);
 11686 </script>
 11688 <!-- [[[ test_2d.path.arcTo.coincide.2.html ]]] -->
 11690 <p>Canvas test: 2d.path.arcTo.coincide.2</p>
 11691 <!-- Testing: arcTo() draws a straight line to P1 if P1 = P2 -->
 11692 <canvas id="c360" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11693 <script>
 11696 function test_2d_path_arcTo_coincide_2() {
 11698 var canvas = document.getElementById('c360');
 11699 var ctx = canvas.getContext('2d');
 11701 ctx.fillStyle = '#f00';
 11702 ctx.fillRect(0, 0, 100, 50);
 11703 ctx.lineWidth = 50;
 11704 ctx.strokeStyle = '#0f0';
 11705 ctx.beginPath();
 11706 ctx.moveTo(0, 25);
 11707 ctx.arcTo(100, 25, 100, 25, 1);
 11708 ctx.stroke();
 11710 isPixel(ctx, 50,25, 0,255,0,255, 0);
 11714 </script>
 11716 <!-- [[[ test_2d.path.arcTo.collinear.1.html ]]] -->
 11718 <p>Canvas test: 2d.path.arcTo.collinear.1</p>
 11719 <!-- Testing: arcTo() with all points on a line, and P1 between P0/P2, draws a straight line to P1 -->
 11720 <canvas id="c361" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11721 <script>
 11725 function test_2d_path_arcTo_collinear_1() {
 11727 var canvas = document.getElementById('c361');
 11728 var ctx = canvas.getContext('2d');
 11730 ctx.fillStyle = '#f00';
 11731 ctx.fillRect(0, 0, 100, 50);
 11732 ctx.lineWidth = 50;
 11734 ctx.strokeStyle = '#0f0';
 11735 ctx.beginPath();
 11736 ctx.moveTo(0, 25);
 11737 ctx.arcTo(100, 25, 200, 25, 1);
 11738 ctx.stroke();
 11740 ctx.strokeStyle = '#f00';
 11741 ctx.beginPath();
 11742 ctx.moveTo(-100, 25);
 11743 ctx.arcTo(0, 25, 100, 25, 1);
 11744 ctx.stroke();
 11746 isPixel(ctx, 50,25, 0,255,0,255, 0);
 11750 </script>
 11752 <!-- [[[ test_2d.path.arcTo.collinear.2.html ]]] -->
 11754 <p>Canvas test: 2d.path.arcTo.collinear.2</p>
 11755 <!-- Testing: arcTo() with all points on a line, and P2 between P0/P1, draws an infinite line along P1..P2 -->
 11756 <canvas id="c362" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11757 <script>
 11761 function test_2d_path_arcTo_collinear_2() {
 11763 var canvas = document.getElementById('c362');
 11764 var ctx = canvas.getContext('2d');
 11766 ctx.fillStyle = '#f00';
 11767 ctx.fillRect(0, 0, 100, 50);
 11768 ctx.lineWidth = 50;
 11770 ctx.strokeStyle = '#0f0';
 11771 ctx.beginPath();
 11772 ctx.moveTo(1000, 25);
 11773 ctx.arcTo(1100, 25, 1050, 25, 1);
 11774 ctx.stroke();
 11776 ctx.strokeStyle = '#f00';
 11777 ctx.beginPath();
 11778 ctx.moveTo(0, 25);
 11779 ctx.arcTo(100, 25, -50, 25, 1);
 11780 ctx.stroke();
 11782 todo_isPixel(ctx, 50,25, 0,255,0,255, 0);
 11786 </script>
 11788 <!-- [[[ test_2d.path.arcTo.collinear.3.html ]]] -->
 11790 <p>Canvas test: 2d.path.arcTo.collinear.3</p>
 11791 <!-- Testing: arcTo() with all points on a line, and P0 between P1/P2, draws an infinite line along P1..P2 -->
 11792 <canvas id="c363" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11793 <script>
 11797 function test_2d_path_arcTo_collinear_3() {
 11799 var canvas = document.getElementById('c363');
 11800 var ctx = canvas.getContext('2d');
 11802 ctx.fillStyle = '#f00';
 11803 ctx.fillRect(0, 0, 100, 50);
 11804 ctx.lineWidth = 50;
 11806 ctx.strokeStyle = '#0f0';
 11807 ctx.beginPath();
 11808 ctx.moveTo(150, 25);
 11809 ctx.arcTo(200, 25, 100, 25, 1);
 11810 ctx.stroke();
 11812 ctx.strokeStyle = '#f00';
 11813 ctx.beginPath();
 11814 ctx.moveTo(0, 25);
 11815 ctx.arcTo(100, 25, 50, 25, 1);
 11816 ctx.stroke();
 11818 todo_isPixel(ctx, 50,25, 0,255,0,255, 0);
 11822 </script>
 11824 <!-- [[[ test_2d.path.arcTo.emptysubpath.html ]]] -->
 11826 <p>Canvas test: 2d.path.arcTo.emptysubpath</p>
 11827 <!-- Testing: arcTo() does nothing if there are no subpaths -->
 11828 <canvas id="c364" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11829 <script>
 11833 function test_2d_path_arcTo_emptysubpath() {
 11835 var canvas = document.getElementById('c364');
 11836 var ctx = canvas.getContext('2d');
 11838 ctx.fillStyle = '#0f0';
 11839 ctx.fillRect(0, 0, 100, 50);
 11840 ctx.lineWidth = 50;
 11841 ctx.strokeStyle = '#f00';
 11842 ctx.beginPath();
 11843 ctx.arcTo(0, 25, 0, 25, 0.1);
 11844 ctx.arcTo(100, 25, 100, 25, 0.1);
 11845 ctx.stroke();
 11846 todo_isPixel(ctx, 50,25, 0,255,0,255, 0);
 11850 </script>
 11852 <!-- [[[ test_2d.path.arcTo.negative.html ]]] -->
 11854 <p>Canvas test: 2d.path.arcTo.negative</p>
 11855 <!-- Testing: arcTo() with negative radius throws an exception -->
 11856 <canvas id="c365" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11857 <script>
 11859 function test_2d_path_arcTo_negative() {
 11861 var canvas = document.getElementById('c365');
 11862 var ctx = canvas.getContext('2d');
 11864 var _thrown = undefined; try {
 11865   ctx.arcTo(0, 0, 0, 0, -1);
 11866 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "IndexSizeError" && _thrown.code == DOMException.INDEX_SIZE_ERR, "should throw IndexSizeError");
 11870 </script>
 11872 <!-- [[[ test_2d.path.arcTo.nonfinite.html ]]] -->
 11874 <p>Canvas test: 2d.path.arcTo.nonfinite</p>
 11875 <!-- Testing: arcTo() with Infinity/NaN is ignored -->
 11876 <canvas id="c366" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11877 <script>
 11880 function test_2d_path_arcTo_nonfinite() {
 11882 var canvas = document.getElementById('c366');
 11883 var ctx = canvas.getContext('2d');
 11885 var _thrown_outer = false;
 11886 try {
 11888 ctx.moveTo(0, 0);
 11889 ctx.lineTo(100, 0);
 11890 ctx.arcTo(Infinity, 50, 0, 50, 0);
 11891 ctx.arcTo(-Infinity, 50, 0, 50, 0);
 11892 ctx.arcTo(NaN, 50, 0, 50, 0);
 11893 ctx.arcTo(0, Infinity, 0, 50, 0);
 11894 ctx.arcTo(0, -Infinity, 0, 50, 0);
 11895 ctx.arcTo(0, NaN, 0, 50, 0);
 11896 ctx.arcTo(0, 50, Infinity, 50, 0);
 11897 ctx.arcTo(0, 50, -Infinity, 50, 0);
 11898 ctx.arcTo(0, 50, NaN, 50, 0);
 11899 ctx.arcTo(0, 50, 0, Infinity, 0);
 11900 ctx.arcTo(0, 50, 0, -Infinity, 0);
 11901 ctx.arcTo(0, 50, 0, NaN, 0);
 11902 ctx.arcTo(0, 50, 0, 50, Infinity);
 11903 ctx.arcTo(0, 50, 0, 50, -Infinity);
 11904 ctx.arcTo(0, 50, 0, 50, NaN);
 11905 ctx.arcTo(Infinity, Infinity, 0, 50, 0);
 11906 ctx.arcTo(Infinity, Infinity, Infinity, 50, 0);
 11907 ctx.arcTo(Infinity, Infinity, Infinity, Infinity, 0);
 11908 ctx.arcTo(Infinity, Infinity, Infinity, Infinity, Infinity);
 11909 ctx.arcTo(Infinity, Infinity, Infinity, 50, Infinity);
 11910 ctx.arcTo(Infinity, Infinity, 0, Infinity, 0);
 11911 ctx.arcTo(Infinity, Infinity, 0, Infinity, Infinity);
 11912 ctx.arcTo(Infinity, Infinity, 0, 50, Infinity);
 11913 ctx.arcTo(Infinity, 50, Infinity, 50, 0);
 11914 ctx.arcTo(Infinity, 50, Infinity, Infinity, 0);
 11915 ctx.arcTo(Infinity, 50, Infinity, Infinity, Infinity);
 11916 ctx.arcTo(Infinity, 50, Infinity, 50, Infinity);
 11917 ctx.arcTo(Infinity, 50, 0, Infinity, 0);
 11918 ctx.arcTo(Infinity, 50, 0, Infinity, Infinity);
 11919 ctx.arcTo(Infinity, 50, 0, 50, Infinity);
 11920 ctx.arcTo(0, Infinity, Infinity, 50, 0);
 11921 ctx.arcTo(0, Infinity, Infinity, Infinity, 0);
 11922 ctx.arcTo(0, Infinity, Infinity, Infinity, Infinity);
 11923 ctx.arcTo(0, Infinity, Infinity, 50, Infinity);
 11924 ctx.arcTo(0, Infinity, 0, Infinity, 0);
 11925 ctx.arcTo(0, Infinity, 0, Infinity, Infinity);
 11926 ctx.arcTo(0, Infinity, 0, 50, Infinity);
 11927 ctx.arcTo(0, 50, Infinity, Infinity, 0);
 11928 ctx.arcTo(0, 50, Infinity, Infinity, Infinity);
 11929 ctx.arcTo(0, 50, Infinity, 50, Infinity);
 11930 ctx.arcTo(0, 50, 0, Infinity, Infinity);
 11931 ctx.lineTo(100, 50);
 11932 ctx.lineTo(0, 50);
 11933 ctx.fillStyle = '#0f0';
 11934 ctx.fill();
 11935 isPixel(ctx, 50,25, 0,255,0,255, 0);
 11936 isPixel(ctx, 90,45, 0,255,0,255, 0);
 11938 } catch (e) {
 11939     _thrown_outer = true;
 11941 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 11945 </script>
 11947 <!-- [[[ test_2d.path.arcTo.scale.html ]]] -->
 11949 <p>Canvas test: 2d.path.arcTo.scale</p>
 11950 <!-- Testing: arcTo scales the curve, not just the control points -->
 11951 <canvas id="c367" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11952 <script>
 11955 function test_2d_path_arcTo_scale() {
 11957 var canvas = document.getElementById('c367');
 11958 var ctx = canvas.getContext('2d');
 11960 ctx.fillStyle = '#f00';
 11961 ctx.fillRect(0, 0, 100, 50);
 11963 ctx.fillStyle = '#0f0';
 11964 ctx.beginPath();
 11965 ctx.moveTo(0, 50);
 11966 ctx.translate(100, 0);
 11967 ctx.scale(0.1, 1);
 11968 ctx.arcTo(50, 50, 50, 0, 50);
 11969 ctx.lineTo(-1000, 0);
 11970 ctx.fill();
 11972 isPixel(ctx, 0,0, 0,255,0,255, 0);
 11973 isPixel(ctx, 50,0, 0,255,0,255, 0);
 11974 isPixel(ctx, 99,0, 0,255,0,255, 0);
 11975 isPixel(ctx, 0,25, 0,255,0,255, 0);
 11976 isPixel(ctx, 50,25, 0,255,0,255, 0);
 11977 isPixel(ctx, 99,25, 0,255,0,255, 0);
 11978 isPixel(ctx, 0,49, 0,255,0,255, 0);
 11979 isPixel(ctx, 50,49, 0,255,0,255, 0);
 11980 isPixel(ctx, 99,49, 0,255,0,255, 0);
 11984 </script>
 11986 <!-- [[[ test_2d.path.arcTo.shape.curve1.html ]]] -->
 11988 <p>Canvas test: 2d.path.arcTo.shape.curve1</p>
 11989 <!-- Testing: arcTo() curves in the right kind of shape -->
 11990 <canvas id="c368" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 11991 <script>
 11995 function test_2d_path_arcTo_shape_curve1() {
 11997 var canvas = document.getElementById('c368');
 11998 var ctx = canvas.getContext('2d');
 12000 var tol = 1.5; // tolerance to avoid antialiasing artifacts
 12002 ctx.fillStyle = '#0f0';
 12003 ctx.fillRect(0, 0, 100, 50);
 12005 ctx.strokeStyle = '#f00';
 12006 ctx.lineWidth = 10;
 12007 ctx.beginPath();
 12008 ctx.moveTo(10, 25);
 12009 ctx.arcTo(75, 25, 75, 60, 20);
 12010 ctx.stroke();
 12012 ctx.fillStyle = '#0f0';
 12013 ctx.beginPath();
 12014 ctx.rect(10, 20, 45, 10);
 12015 ctx.moveTo(80, 45);
 12016 ctx.arc(55, 45, 25+tol, 0, -Math.PI/2, true);
 12017 ctx.arc(55, 45, 15-tol, -Math.PI/2, 0, false);
 12018 ctx.fill();
 12020 isPixel(ctx, 50,25, 0,255,0,255, 0);
 12021 isPixel(ctx, 55,19, 0,255,0,255, 0);
 12022 isPixel(ctx, 55,20, 0,255,0,255, 0);
 12023 isPixel(ctx, 55,21, 0,255,0,255, 0);
 12024 isPixel(ctx, 64,22, 0,255,0,255, 0);
 12025 isPixel(ctx, 65,21, 0,255,0,255, 0);
 12026 isPixel(ctx, 72,28, 0,255,0,255, 0);
 12027 isPixel(ctx, 73,27, 0,255,0,255, 0);
 12028 isPixel(ctx, 78,36, 0,255,0,255, 0);
 12029 isPixel(ctx, 79,35, 0,255,0,255, IsAzureSkia() ? 1 : 0);
 12030 isPixel(ctx, 80,44, 0,255,0,255, 0);
 12031 isPixel(ctx, 80,45, 0,255,0,255, 0);
 12032 isPixel(ctx, 80,46, 0,255,0,255, 0);
 12036 </script>
 12038 <!-- [[[ test_2d.path.arcTo.shape.curve2.html ]]] -->
 12040 <p>Canvas test: 2d.path.arcTo.shape.curve2</p>
 12041 <!-- Testing: arcTo() curves in the right kind of shape -->
 12042 <canvas id="c369" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 12043 <script>
 12047 function test_2d_path_arcTo_shape_curve2() {
 12049 var canvas = document.getElementById('c369');
 12050 var ctx = canvas.getContext('2d');
 12052 var tol = 1.5; // tolerance to avoid antialiasing artifacts
 12054 ctx.fillStyle = '#0f0';
 12055 ctx.fillRect(0, 0, 100, 50);
 12057 ctx.fillStyle = '#f00';
 12058 ctx.beginPath();
 12059 ctx.rect(10, 20, 45, 10);
 12060 ctx.moveTo(80, 45);
 12061 ctx.arc(55, 45, 25-tol, 0, -Math.PI/2, true);
 12062 ctx.arc(55, 45, 15+tol, -Math.PI/2, 0, false);
 12063 ctx.fill();
 12065 ctx.strokeStyle = '#0f0';
 12066 ctx.lineWidth = 10;
 12067 ctx.beginPath();
 12068 ctx.moveTo(10, 25);
 12069 ctx.arcTo(75, 25, 75, 60, 20);
 12070 ctx.stroke();
 12072 isPixel(ctx, 50,25, 0,255,0,255, 0);
 12073 isPixel(ctx, 55,19, 0,255,0,255, 0);
 12074 isPixel(ctx, 55,20, 0,255,0,255, 0);
 12075 isPixel(ctx, 55,21, 0,255,0,255, 0);
 12076 isPixel(ctx, 64,22, 0,255,0,255, IsAzureSkia() ? 1 : 0);
 12077 isPixel(ctx, 65,21, 0,255,0,255, 0);
 12078 isPixel(ctx, 72,28, 0,255,0,255, 0);
 12079 isPixel(ctx, 73,27, 0,255,0,255, IsAzureSkia() ? 1 : 0);
 12080 isPixel(ctx, 78,36, 0,255,0,255, IsAzureSkia() ? 1 : 0);
 12081 isPixel(ctx, 79,35, 0,255,0,255, 0);
 12082 isPixel(ctx, 80,44, 0,255,0,255, 0);
 12083 isPixel(ctx, 80,45, 0,255,0,255, 0);
 12084 isPixel(ctx, 80,46, 0,255,0,255, 0);
 12088 </script>
 12090 <!-- [[[ test_2d.path.arcTo.shape.end.html ]]] -->
 12092 <p>Canvas test: 2d.path.arcTo.shape.end</p>
 12093 <!-- Testing: arcTo() does not draw anything from P1 to P2 -->
 12094 <canvas id="c370" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 12095 <script>
 12099 function test_2d_path_arcTo_shape_end() {
 12101 var canvas = document.getElementById('c370');
 12102 var ctx = canvas.getContext('2d');
 12104 ctx.fillStyle = '#0f0';
 12105 ctx.fillRect(0, 0, 100, 50);
 12106 ctx.strokeStyle = '#f00';
 12107 ctx.lineWidth = 50;
 12108 ctx.beginPath();
 12109 ctx.moveTo(-100, -100);
 12110 ctx.arcTo(-100, 25, 200, 25, 10);
 12111 ctx.stroke();
 12113 isPixel(ctx, 1,1, 0,255,0,255, 0);
 12114 isPixel(ctx, 1,48, 0,255,0,255, 0);
 12115 isPixel(ctx, 50,25, 0,255,0,255, 0);
 12116 isPixel(ctx, 98,1, 0,255,0,255, 0);
 12117 isPixel(ctx, 98,48, 0,255,0,255, 0);
 12121 </script>
 12123 <!-- [[[ test_2d.path.arcTo.shape.start.html ]]] -->
 12125 <p>Canvas test: 2d.path.arcTo.shape.start</p>
 12126 <!-- Testing: arcTo() draws a straight line from P0 to P1 -->
 12127 <canvas id="c371" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 12128 <script>
 12132 function test_2d_path_arcTo_shape_start() {
 12134 var canvas = document.getElementById('c371');
 12135 var ctx = canvas.getContext('2d');
 12137 ctx.fillStyle = '#f00';
 12138 ctx.fillRect(0, 0, 100, 50);
 12139 ctx.strokeStyle = '#0f0';
 12140 ctx.lineWidth = 50;
 12141 ctx.beginPath();
 12142 ctx.moveTo(0, 25);
 12143 ctx.arcTo(200, 25, 200, 50, 10);
 12144 ctx.stroke();
 12146 isPixel(ctx, 1,1, 0,255,0,255, 0);
 12147 isPixel(ctx, 1,48, 0,255,0,255, 0);
 12148 isPixel(ctx, 50,25, 0,255,0,255, 0);
 12149 isPixel(ctx, 98,1, 0,255,0,255, 0);
 12150 isPixel(ctx, 98,48, 0,255,0,255, 0);
 12154 </script>
 12156 <!-- [[[ test_2d.path.arcTo.transformation.html ]]] -->
 12158 <p>Canvas test: 2d.path.arcTo.transformation</p>
 12159 <!-- Testing: arcTo joins up to the last subpath point correctly -->
 12160 <canvas id="c372" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 12161 <script>
 12164 function test_2d_path_arcTo_transformation() {
 12166 var canvas = document.getElementById('c372');
 12167 var ctx = canvas.getContext('2d');
 12169 ctx.fillStyle = '#f00';
 12170 ctx.fillRect(0, 0, 100, 50);
 12172 ctx.fillStyle = '#0f0';
 12173 ctx.beginPath();
 12174 ctx.moveTo(0, 50);
 12175 ctx.translate(100, 0);
 12176 ctx.arcTo(50, 50, 50, 0, 50);
 12177 ctx.lineTo(-100, 0);
 12178 ctx.fill();
 12180 isPixel(ctx, 0,0, 0,255,0,255, 0);
 12181 isPixel(ctx, 50,0, 0,255,0,255, 0);
 12182 isPixel(ctx, 99,0, 0,255,0,255, 0);
 12183 isPixel(ctx, 0,25, 0,255,0,255, 0);
 12184 isPixel(ctx, 50,25, 0,255,0,255, 0);
 12185 isPixel(ctx, 99,25, 0,255,0,255, 0);
 12186 isPixel(ctx, 0,49, 0,255,0,255, 0);
 12187 isPixel(ctx, 50,49, 0,255,0,255, 0);
 12188 isPixel(ctx, 99,49, 0,255,0,255, 0);
 12192 </script>
 12194 <!-- [[[ test_2d.path.arcTo.zero.1.html ]]] -->
 12196 <p>Canvas test: 2d.path.arcTo.zero.1</p>
 12197 <!-- Testing: arcTo() with zero radius draws a straight line from P0 to P1 -->
 12198 <canvas id="c373" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 12199 <script>
 12202 function test_2d_path_arcTo_zero_1() {
 12204 var canvas = document.getElementById('c373');
 12205 var ctx = canvas.getContext('2d');
 12207 var _thrown_outer = false;
 12208 try {
 12210 ctx.fillStyle = '#f00';
 12211 ctx.fillRect(0, 0, 100, 50);
 12212 ctx.lineWidth = 50;
 12214 ctx.strokeStyle = '#0f0';
 12215 ctx.beginPath();
 12216 ctx.moveTo(0, 25);
 12217 ctx.arcTo(100, 25, 100, 100, 0);
 12218 ctx.stroke();
 12220 ctx.strokeStyle = '#f00';
 12221 ctx.beginPath();
 12222 ctx.moveTo(0, -25);
 12223 ctx.arcTo(50, -25, 50, 50, 0);
 12224 ctx.stroke();
 12226 isPixel(ctx, 50,25, 0,255,0,255, 0);
 12228 } catch (e) {
 12229     _thrown_outer = true;
 12231 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 12235 </script>
 12237 <!-- [[[ test_2d.path.arcTo.zero.2.html ]]] -->
 12239 <p>Canvas test: 2d.path.arcTo.zero.2</p>
 12240 <!-- Testing: arcTo() with zero radius draws a straight line from P0 to P1, even when all points are collinear -->
 12241 <canvas id="c374" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 12242 <script>
 12245 function test_2d_path_arcTo_zero_2() {
 12247 var canvas = document.getElementById('c374');
 12248 var ctx = canvas.getContext('2d');
 12250 var _thrown_outer = false;
 12251 try {
 12253 ctx.fillStyle = '#f00';
 12254 ctx.fillRect(0, 0, 100, 50);
 12255 ctx.lineWidth = 50;
 12257 ctx.strokeStyle = '#0f0';
 12258 ctx.beginPath();
 12259 ctx.moveTo(0, 25);
 12260 ctx.arcTo(100, 25, -100, 25, 0);
 12261 ctx.stroke();
 12263 ctx.strokeStyle = '#f00';
 12264 ctx.beginPath();
 12265 ctx.moveTo(100, 25);
 12266 ctx.arcTo(200, 25, 50, 25, 0);
 12267 ctx.stroke();
 12269 isPixel(ctx, 50,25, 0,255,0,255, 0);
 12271 } catch (e) {
 12272     _thrown_outer = true;
 12274 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 12278 </script>
 12280 <!-- [[[ test_2d.path.beginPath.html ]]] -->
 12282 <p>Canvas test: 2d.path.beginPath</p>
 12283 <canvas id="c375" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
 12284 <script>
 12287 function test_2d_path_beginPath() {
 12289 var canvas = document.getElementById('c375');
 12290 var ctx = canvas.getContext('2d');
 12292 ctx.rect(0, 0, 100, 50);
 12293 ctx.beginPath();
 12294 ctx.fillStyle = '#f00';
 12295 ctx.fill();
 12296 isPixel(ctx, 50,25, 0,0,0,0, 0);
 12300 </script>
 12302 <!-- [[[ test_2d.path.bezierCurveTo.basic.html ]]] -->
 12304 <p>Canvas test: 2d.path.bezierCurveTo.basic</p>
 12305 <canvas id="c376" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
 12306 <script>
 12309 function test_2d_path_bezierCurveTo_basic() {
 12311 var canvas = document.getElementById('c376');
 12312 var ctx = canvas.getContext('2d');
 12314 ctx.strokeStyle = '#0f0';
 12315 ctx.lineWidth = 50;
 12316 ctx.beginPath();
 12317 ctx.moveTo(0, 25);
 12318 ctx.bezierCurveTo(100, 25, 100, 25, 100, 25);
 12319 ctx.stroke();
 12320 isPixel(ctx, 50,25, 0,255,0,255, 0);
 12324 </script>
 12326 <!-- [[[ test_2d.path.bezierCurveTo.emptysubpath.html ]]] -->
 12328 <p>Canvas test: 2d.path.bezierCurveTo.emptysubpath</p>
 12329 <canvas id="c377" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
 12330 <script>
 12334 function test_2d_path_bezierCurveTo_emptysubpath() {
 12336 var canvas = document.getElementById('c377');
 12337 var ctx = canvas.getContext('2d');
 12339 ctx.strokeStyle = '#f00';
 12340 ctx.lineWidth = 50;
 12341 ctx.beginPath();
 12342 ctx.bezierCurveTo(0, 25, 0, 25, 0, 25);
 12343 ctx.bezierCurveTo(100, 25, 100, 25, 100, 25);
 12344 ctx.stroke();
 12345 todo_isPixel(ctx, 50,25, 0,0,0,0, 0);
 12349 </script>
 12351 <!-- [[[ test_2d.path.bezierCurveTo.nonfinite.html ]]] -->
 12353 <p>Canvas test: 2d.path.bezierCurveTo.nonfinite</p>
 12354 <!-- Testing: bezierCurveTo() with Infinity/NaN is ignored -->
 12355 <canvas id="c378" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 12356 <script>
 12359 function test_2d_path_bezierCurveTo_nonfinite() {
 12361 var canvas = document.getElementById('c378');
 12362 var ctx = canvas.getContext('2d');
 12364 var _thrown_outer = false;
 12365 try {
 12367 ctx.moveTo(0, 0);
 12368 ctx.lineTo(100, 0);
 12369 ctx.bezierCurveTo(Infinity, 50, 0, 50, 0, 50);
 12370 ctx.bezierCurveTo(-Infinity, 50, 0, 50, 0, 50);
 12371 ctx.bezierCurveTo(NaN, 50, 0, 50, 0, 50);
 12372 ctx.bezierCurveTo(0, Infinity, 0, 50, 0, 50);
 12373 ctx.bezierCurveTo(0, -Infinity, 0, 50, 0, 50);
 12374 ctx.bezierCurveTo(0, NaN, 0, 50, 0, 50);
 12375 ctx.bezierCurveTo(0, 50, Infinity, 50, 0, 50);
 12376 ctx.bezierCurveTo(0, 50, -Infinity, 50, 0, 50);
 12377 ctx.bezierCurveTo(0, 50, NaN, 50, 0, 50);
 12378 ctx.bezierCurveTo(0, 50, 0, Infinity, 0, 50);
 12379 ctx.bezierCurveTo(0, 50, 0, -Infinity, 0, 50);
 12380 ctx.bezierCurveTo(0, 50, 0, NaN, 0, 50);
 12381 ctx.bezierCurveTo(0, 50, 0, 50, Infinity, 50);
 12382 ctx.bezierCurveTo(0, 50, 0, 50, -Infinity, 50);
 12383 ctx.bezierCurveTo(0, 50, 0, 50, NaN, 50);
 12384 ctx.bezierCurveTo(0, 50, 0, 50, 0, Infinity);
 12385 ctx.bezierCurveTo(0, 50, 0, 50, 0, -Infinity);
 12386 ctx.bezierCurveTo(0, 50, 0, 50, 0, NaN);
 12387 ctx.bezierCurveTo(Infinity, Infinity, 0, 50, 0, 50);
 12388 ctx.bezierCurveTo(Infinity, Infinity, Infinity, 50, 0, 50);
 12389 ctx.bezierCurveTo(Infinity, Infinity, Infinity, Infinity, 0, 50);
 12390 ctx.bezierCurveTo(Infinity, Infinity, Infinity, Infinity, Infinity, 50);
 12391 ctx.bezierCurveTo(Infinity, Infinity, Infinity, Infinity, Infinity, Infinity);
 12392 ctx.bezierCurveTo(Infinity, Infinity, Infinity, Infinity, 0, Infinity);
 12393 ctx.bezierCurveTo(Infinity, Infinity, Infinity, 50, Infinity, 50);
 12394 ctx.bezierCurveTo(Infinity, Infinity, Infinity, 50, Infinity, Infinity);
 12395 ctx.bezierCurveTo(Infinity, Infinity, Infinity, 50, 0, Infinity);
 12396 ctx.bezierCurveTo(Infinity, Infinity, 0, Infinity, 0, 50);
 12397 ctx.bezierCurveTo(Infinity, Infinity, 0, Infinity, Infinity, 50);
 12398 ctx.bezierCurveTo(Infinity, Infinity, 0, Infinity, Infinity, Infinity);
 12399 ctx.bezierCurveTo(Infinity, Infinity, 0, Infinity, 0, Infinity);
 12400 ctx.bezierCurveTo(Infinity, Infinity, 0, 50, Infinity, 50);
 12401 ctx.bezierCurveTo(Infinity, Infinity, 0, 50, Infinity, Infinity);
 12402 ctx.bezierCurveTo(Infinity, Infinity, 0, 50, 0, Infinity);
 12403 ctx.bezierCurveTo(Infinity, 50, Infinity, 50, 0, 50);
 12404 ctx.bezierCurveTo(Infinity, 50, Infinity, Infinity, 0, 50);
 12405 ctx.bezierCurveTo(Infinity, 50, Infinity, Infinity, Infinity, 50);
 12406 ctx.bezierCurveTo(Infinity, 50, Infinity, Infinity, Infinity, Infinity);
 12407 ctx.bezierCurveTo(Infinity, 50, Infinity, Infinity, 0, Infinity);
 12408 ctx.bezierCurveTo(Infinity, 50, Infinity, 50, Infinity, 50);
 12409 ctx.bezierCurveTo(Infinity, 50, Infinity, 50, Infinity, Infinity);
 12410 ctx.bezierCurveTo(Infinity, 50, Infinity, 50, 0, Infinity);
 12411 ctx.bezierCurveTo(Infinity, 50, 0, Infinity, 0, 50);
 12412 ctx.bezierCurveTo(Infinity, 50, 0, Infinity, Infinity, 50);
 12413 ctx.bezierCurveTo(Infinity, 50, 0, Infinity, Infinity, Infinity);
 12414 ctx.bezierCurveTo(Infinity, 50, 0, Infinity, 0, Infinity);
 12415 ctx.bezierCurveTo(Infinity, 50, 0, 50, Infinity, 50);
 12416 ctx.bezierCurveTo(Infinity, 50, 0, 50, Infinity, Infinity);
 12417 ctx.bezierCurveTo(Infinity, 50, 0, 50, 0, Infinity);
 12418 ctx.bezierCurveTo(0, Infinity, Infinity, 50, 0, 50);
 12419 ctx.bezierCurveTo(0, Infinity, Infinity, Infinity, 0, 50);
 12420 ctx.bezierCurveTo(0, Infinity, Infinity, Infinity, Infinity, 50);
 12421 ctx.bezierCurveTo(0, Infinity, Infinity, Infinity, Infinity, Infinity);
 12422 ctx.bezierCurveTo(0, Infinity, Infinity, Infinity, 0, Infinity);
 12423 ctx.bezierCurveTo(0, Infinity, Infinity, 50, Infinity, 50);
 12424 ctx.bezierCurveTo(0, Infinity, Infinity, 50, Infinity, Infinity);
 12425 ctx.bezierCurveTo(0, Infinity, Infinity, 50, 0, Infinity);
 12426 ctx.bezierCurveTo(0, Infinity, 0, Infinity, 0, 50);
 12427 ctx.bezierCurveTo(0, Infinity, 0, Infinity, Infinity, 50);
 12428 ctx.bezierCurveTo(0, Infinity, 0, Infinity, Infinity, Infinity);
 12429 ctx.bezierCurveTo(0, Infinity, 0, Infinity, 0, Infinity);
 12430 ctx.bezierCurveTo(0, Infinity, 0, 50, Infinity, 50);
 12431 ctx.bezierCurveTo(0, Infinity, 0, 50, Infinity, Infinity);
 12432 ctx.bezierCurveTo(0, Infinity, 0, 50, 0, Infinity);
 12433 ctx.bezierCurveTo(0, 50, Infinity, Infinity, 0, 50);
 12434 ctx.bezierCurveTo(0, 50, Infinity, Infinity, Infinity, 50);
 12435 ctx.bezierCurveTo(0, 50, Infinity, Infinity, Infinity, Infinity);
 12436 ctx.bezierCurveTo(0, 50, Infinity, Infinity, 0, Infinity);
 12437 ctx.bezierCurveTo(0, 50, Infinity, 50, Infinity, 50);
 12438 ctx.bezierCurveTo(0, 50, Infinity, 50, Infinity, Infinity);
 12439 ctx.bezierCurveTo(0, 50, Infinity, 50, 0, Infinity);
 12440 ctx.bezierCurveTo(0, 50, 0, Infinity, Infinity, 50);
 12441 ctx.bezierCurveTo(0, 50, 0, Infinity, Infinity, Infinity);
 12442 ctx.bezierCurveTo(0, 50, 0, Infinity, 0, Infinity);
 12443 ctx.bezierCurveTo(0, 50, 0, 50, Infinity, Infinity);
 12444 ctx.lineTo(100, 50);
 12445 ctx.lineTo(0, 50);
 12446 ctx.fillStyle = '#0f0';
 12447 ctx.fill();
 12448 isPixel(ctx, 50,25, 0,255,0,255, 0);
 12449 isPixel(ctx, 90,45, 0,255,0,255, 0);
 12451 } catch (e) {
 12452     _thrown_outer = true;
 12454 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 12458 </script>
 12460 <!-- [[[ test_2d.path.bezierCurveTo.scaled.html ]]] -->
 12462 <p>Canvas test: 2d.path.bezierCurveTo.scaled</p>
 12463 <canvas id="c379" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
 12464 <script>
 12467 function test_2d_path_bezierCurveTo_scaled() {
 12469 var canvas = document.getElementById('c379');
 12470 var ctx = canvas.getContext('2d');
 12472 ctx.scale(1000, 1000);
 12473 ctx.strokeStyle = '#0f0';
 12474 ctx.lineWidth = 0.055;
 12475 ctx.beginPath();
 12476 ctx.moveTo(-2, 3.1);
 12477 ctx.bezierCurveTo(-2, -1, 2.1, -1, 2.1, 3.1);
 12478 ctx.stroke();
 12479 isPixel(ctx, 50,25, 0,255,0,255, 0);
 12480 isPixel(ctx, 1,1, 0,255,0,255, 0);
 12481 isPixel(ctx, 98,1, 0,255,0,255, 0);
 12482 isPixel(ctx, 1,48, 0,255,0,255, 0);
 12483 isPixel(ctx, 98,48, 0,255,0,255, 0);
 12487 </script>
 12489 <!-- [[[ test_2d.path.bezierCurveTo.shape.html ]]] -->
 12491 <p>Canvas test: 2d.path.bezierCurveTo.shape</p>
 12492 <canvas id="c380" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
 12493 <script>
 12496 function test_2d_path_bezierCurveTo_shape() {
 12498 var canvas = document.getElementById('c380');
 12499 var ctx = canvas.getContext('2d');
 12501 ctx.strokeStyle = '#0f0';
 12502 ctx.lineWidth = 55;
 12503 ctx.beginPath();
 12504 ctx.moveTo(-2000, 3100);
 12505 ctx.bezierCurveTo(-2000, -1000, 2100, -1000, 2100, 3100);
 12506 ctx.stroke();
 12507 isPixel(ctx, 50,25, 0,255,0,255, 0);
 12508 isPixel(ctx, 1,1, 0,255,0,255, 0);
 12509 isPixel(ctx, 98,1, 0,255,0,255, 0);
 12510 isPixel(ctx, 1,48, 0,255,0,255, 0);
 12511 isPixel(ctx, 98,48, 0,255,0,255, 0);
 12515 </script>
 12517 <!-- [[[ test_2d.path.clip.basic.1.html ]]] -->
 12519 <p>Canvas test: 2d.path.clip.basic.1</p>
 12520 <canvas id="c381" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 12521 <script>
 12524 function test_2d_path_clip_basic_1() {
 12526 var canvas = document.getElementById('c381');
 12527 var ctx = canvas.getContext('2d');
 12529 ctx.fillStyle = '#f00';
 12530 ctx.fillRect(0, 0, 100, 50);
 12532 ctx.beginPath();
 12533 ctx.rect(0, 0, 100, 50);
 12534 ctx.clip();
 12536 ctx.fillStyle = '#0f0';
 12537 ctx.fillRect(0, 0, 100, 50);
 12539 isPixel(ctx, 50,25, 0,255,0,255, 0);
 12543 </script>
 12545 <!-- [[[ test_2d.path.clip.basic.2.html ]]] -->
 12547 <p>Canvas test: 2d.path.clip.basic.2</p>
 12548 <canvas id="c382" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 12549 <script>
 12552 function test_2d_path_clip_basic_2() {
 12554 var canvas = document.getElementById('c382');
 12555 var ctx = canvas.getContext('2d');
 12557 ctx.fillStyle = '#0f0';
 12558 ctx.fillRect(0, 0, 100, 50);
 12560 ctx.beginPath();
 12561 ctx.rect(-100, 0, 100, 50);
 12562 ctx.clip();
 12564 ctx.fillStyle = '#f00';
 12565 ctx.fillRect(0, 0, 100, 50);
 12567 isPixel(ctx, 50,25, 0,255,0,255, 0);
 12571 </script>
 12573 <!-- [[[ test_2d.path.clip.empty.html ]]] -->
 12575 <p>Canvas test: 2d.path.clip.empty</p>
 12576 <canvas id="c383" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 12577 <script>
 12580 function test_2d_path_clip_empty() {
 12582 var canvas = document.getElementById('c383');
 12583 var ctx = canvas.getContext('2d');
 12585 ctx.fillStyle = '#0f0';
 12586 ctx.fillRect(0, 0, 100, 50);
 12588 ctx.beginPath();
 12589 ctx.clip();
 12591 ctx.fillStyle = '#f00';
 12592 ctx.fillRect(0, 0, 100, 50);
 12594 isPixel(ctx, 50,25, 0,255,0,255, 0);
 12598 </script>
 12600 <!-- [[[ test_2d.path.clip.intersect.html ]]] -->
 12602 <p>Canvas test: 2d.path.clip.intersect</p>
 12603 <canvas id="c384" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 12604 <script>
 12607 function test_2d_path_clip_intersect() {
 12609 var canvas = document.getElementById('c384');
 12610 var ctx = canvas.getContext('2d');
 12612 ctx.fillStyle = '#0f0';
 12613 ctx.fillRect(0, 0, 100, 50);
 12615 ctx.beginPath();
 12616 ctx.rect(0, 0, 50, 50);
 12617 ctx.clip();
 12618 ctx.beginPath();
 12619 ctx.rect(50, 0, 50, 50)
 12620 ctx.clip();
 12622 ctx.fillStyle = '#f00';
 12623 ctx.fillRect(0, 0, 100, 50);
 12625 isPixel(ctx, 50,25, 0,255,0,255, 0);
 12629 </script>
 12631 <!-- [[[ test_2d.path.clip.unaffected.html ]]] -->
 12633 <p>Canvas test: 2d.path.clip.unaffected</p>
 12634 <canvas id="c385" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 12635 <script>
 12638 function test_2d_path_clip_unaffected() {
 12640 var canvas = document.getElementById('c385');
 12641 var ctx = canvas.getContext('2d');
 12643 ctx.fillStyle = '#f00';
 12644 ctx.fillRect(0, 0, 100, 50);
 12646 ctx.fillStyle = '#0f0';
 12648 ctx.beginPath();
 12649 ctx.lineTo(0, 0);
 12650 ctx.lineTo(0, 50);
 12651 ctx.lineTo(100, 50);
 12652 ctx.lineTo(100, 0);
 12653 ctx.clip();
 12655 ctx.lineTo(0, 0);
 12656 ctx.fill();
 12658 isPixel(ctx, 50,25, 0,255,0,255, 0);
 12662 </script>
 12664 <!-- [[[ test_2d.path.clip.winding.1.html ]]] -->
 12666 <p>Canvas test: 2d.path.clip.winding.1</p>
 12667 <canvas id="c386" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 12668 <script>
 12671 function test_2d_path_clip_winding_1() {
 12673 var canvas = document.getElementById('c386');
 12674 var ctx = canvas.getContext('2d');
 12676 ctx.fillStyle = '#0f0';
 12677 ctx.fillRect(0, 0, 100, 50);
 12679 ctx.beginPath();
 12680 ctx.moveTo(-10, -10);
 12681 ctx.lineTo(110, -10);
 12682 ctx.lineTo(110, 60);
 12683 ctx.lineTo(-10, 60);
 12684 ctx.lineTo(-10, -10);
 12685 ctx.lineTo(0, 0);
 12686 ctx.lineTo(0, 50);
 12687 ctx.lineTo(100, 50);
 12688 ctx.lineTo(100, 0);
 12689 ctx.clip();
 12691 ctx.fillStyle = '#f00';
 12692 ctx.fillRect(0, 0, 100, 50);
 12694 isPixel(ctx, 50,25, 0,255,0,255, 0);
 12698 </script>
 12700 <!-- [[[ test_2d.path.clip.winding.2.html ]]] -->
 12702 <p>Canvas test: 2d.path.clip.winding.2</p>
 12703 <canvas id="c387" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 12704 <script>
 12707 function test_2d_path_clip_winding_2() {
 12709 var canvas = document.getElementById('c387');
 12710 var ctx = canvas.getContext('2d');
 12712 ctx.fillStyle = '#f00';
 12713 ctx.fillRect(0, 0, 100, 50);
 12715 ctx.beginPath();
 12716 ctx.moveTo(-10, -10);
 12717 ctx.lineTo(110, -10);
 12718 ctx.lineTo(110, 60);
 12719 ctx.lineTo(-10, 60);
 12720 ctx.lineTo(-10, -10);
 12721 ctx.clip();
 12723 ctx.beginPath();
 12724 ctx.lineTo(0, 0);
 12725 ctx.lineTo(0, 50);
 12726 ctx.lineTo(100, 50);
 12727 ctx.lineTo(100, 0);
 12728 ctx.lineTo(0, 0);
 12729 ctx.clip();
 12731 ctx.fillStyle = '#0f0';
 12732 ctx.fillRect(0, 0, 100, 50);
 12734 isPixel(ctx, 50,25, 0,255,0,255, 0);
 12738 </script>
 12740 <!-- [[[ test_2d.path.closePath.empty.html ]]] -->
 12742 <p>Canvas test: 2d.path.closePath.empty</p>
 12743 <canvas id="c388" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
 12744 <script>
 12747 function test_2d_path_closePath_empty() {
 12749 var canvas = document.getElementById('c388');
 12750 var ctx = canvas.getContext('2d');
 12752 ctx.closePath();
 12753 ctx.fillStyle = '#f00';
 12754 ctx.fill();
 12755 isPixel(ctx, 50,25, 0,0,0,0, 0);
 12759 </script>
 12761 <!-- [[[ test_2d.path.closePath.newline.html ]]] -->
 12763 <p>Canvas test: 2d.path.closePath.newline</p>
 12764 <canvas id="c389" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
 12765 <script>
 12768 function test_2d_path_closePath_newline() {
 12770 var canvas = document.getElementById('c389');
 12771 var ctx = canvas.getContext('2d');
 12773 ctx.strokeStyle = '#0f0';
 12774 ctx.lineWidth = 50;
 12775 ctx.moveTo(-100, 25);
 12776 ctx.lineTo(-100, -100);
 12777 ctx.lineTo(200, -100);
 12778 ctx.lineTo(200, 25);
 12779 ctx.closePath();
 12780 ctx.stroke();
 12781 isPixel(ctx, 50,25, 0,255,0,255, 0);
 12785 </script>
 12787 <!-- [[[ test_2d.path.closePath.nextpoint.html ]]] -->
 12789 <p>Canvas test: 2d.path.closePath.nextpoint</p>
 12790 <canvas id="c390" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
 12791 <script>
 12794 function test_2d_path_closePath_nextpoint() {
 12796 var canvas = document.getElementById('c390');
 12797 var ctx = canvas.getContext('2d');
 12799 ctx.strokeStyle = '#0f0';
 12800 ctx.lineWidth = 50;
 12801 ctx.moveTo(-100, 25);
 12802 ctx.lineTo(-100, -1000);
 12803 ctx.closePath();
 12804 ctx.lineTo(1000, 25);
 12805 ctx.stroke();
 12806 isPixel(ctx, 50,25, 0,255,0,255, 0);
 12810 </script>
 12812 <!-- [[[ test_2d.path.fill.closed.basic.html ]]] -->
 12814 <p>Canvas test: 2d.path.fill.closed.basic</p>
 12815 <canvas id="c391" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 12816 <script>
 12819 function test_2d_path_fill_closed_basic() {
 12821 var canvas = document.getElementById('c391');
 12822 var ctx = canvas.getContext('2d');
 12824 ctx.fillStyle = '#f00';
 12825 ctx.fillRect(0, 0, 100, 50);
 12827 ctx.fillStyle = '#0f0';
 12828 ctx.moveTo(0, 0);
 12829 ctx.lineTo(100, 0);
 12830 ctx.lineTo(100, 50);
 12831 ctx.lineTo(0, 50);
 12832 ctx.fill();
 12834 isPixel(ctx, 50,25, 0,255,0,255, 0);
 12838 </script>
 12840 <!-- [[[ test_2d.path.fill.closed.unaffected.html ]]] -->
 12842 <p>Canvas test: 2d.path.fill.closed.unaffected</p>
 12843 <canvas id="c392" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 12844 <script>
 12847 function test_2d_path_fill_closed_unaffected() {
 12849 var canvas = document.getElementById('c392');
 12850 var ctx = canvas.getContext('2d');
 12852 ctx.fillStyle = '#00f';
 12853 ctx.fillRect(0, 0, 100, 50);
 12855 ctx.moveTo(0, 0);
 12856 ctx.lineTo(100, 0);
 12857 ctx.lineTo(100, 50);
 12858 ctx.fillStyle = '#f00';
 12859 ctx.fill();
 12860 ctx.lineTo(0, 50);
 12861 ctx.fillStyle = '#0f0';
 12862 ctx.fill();
 12864 isPixel(ctx, 90,10, 0,255,0,255, 0);
 12865 isPixel(ctx, 10,40, 0,255,0,255, 0);
 12869 </script>
 12871 <!-- [[[ test_2d.path.fill.overlap.html ]]] -->
 12873 <p>Canvas test: 2d.path.fill.overlap</p>
 12874 <canvas id="c393" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 12875 <script>
 12878 function test_2d_path_fill_overlap() {
 12880 var canvas = document.getElementById('c393');
 12881 var ctx = canvas.getContext('2d');
 12883 ctx.fillStyle = '#000';
 12884 ctx.fillRect(0, 0, 100, 50);
 12886 ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
 12887 ctx.rect(0, 0, 100, 50);
 12888 ctx.closePath();
 12889 ctx.rect(10, 10, 80, 30);
 12890 ctx.fill();
 12892 isPixel(ctx, 50,25, 0,127,0,255, 1);
 12896 </script>
 12898 <!-- [[[ test_2d.path.fill.winding.add.html ]]] -->
 12900 <p>Canvas test: 2d.path.fill.winding.add</p>
 12901 <canvas id="c394" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 12902 <script>
 12905 function test_2d_path_fill_winding_add() {
 12907 var canvas = document.getElementById('c394');
 12908 var ctx = canvas.getContext('2d');
 12910 ctx.fillStyle = '#f00';
 12911 ctx.fillRect(0, 0, 100, 50);
 12913 ctx.fillStyle = '#0f0';
 12914 ctx.moveTo(-10, -10);
 12915 ctx.lineTo(110, -10);
 12916 ctx.lineTo(110, 60);
 12917 ctx.lineTo(-10, 60);
 12918 ctx.lineTo(-10, -10);
 12919 ctx.lineTo(0, 0);
 12920 ctx.lineTo(100, 0);
 12921 ctx.lineTo(100, 50);
 12922 ctx.lineTo(0, 50);
 12923 ctx.fill();
 12925 isPixel(ctx, 50,25, 0,255,0,255, 0);
 12929 </script>
 12931 <!-- [[[ test_2d.path.fill.winding.subtract.1.html ]]] -->
 12933 <p>Canvas test: 2d.path.fill.winding.subtract.1</p>
 12934 <canvas id="c395" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 12935 <script>
 12938 function test_2d_path_fill_winding_subtract_1() {
 12940 var canvas = document.getElementById('c395');
 12941 var ctx = canvas.getContext('2d');
 12943 ctx.fillStyle = '#0f0';
 12944 ctx.fillRect(0, 0, 100, 50);
 12946 ctx.fillStyle = '#f00';
 12947 ctx.moveTo(-10, -10);
 12948 ctx.lineTo(110, -10);
 12949 ctx.lineTo(110, 60);
 12950 ctx.lineTo(-10, 60);
 12951 ctx.lineTo(-10, -10);
 12952 ctx.lineTo(0, 0);
 12953 ctx.lineTo(0, 50);
 12954 ctx.lineTo(100, 50);
 12955 ctx.lineTo(100, 0);
 12956 ctx.fill();
 12958 isPixel(ctx, 50,25, 0,255,0,255, 0);
 12962 </script>
 12964 <!-- [[[ test_2d.path.fill.winding.subtract.2.html ]]] -->
 12966 <p>Canvas test: 2d.path.fill.winding.subtract.2</p>
 12967 <canvas id="c396" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 12968 <script>
 12971 function test_2d_path_fill_winding_subtract_2() {
 12973 var canvas = document.getElementById('c396');
 12974 var ctx = canvas.getContext('2d');
 12976 ctx.fillStyle = '#0f0';
 12977 ctx.fillRect(0, 0, 100, 50);
 12979 ctx.fillStyle = '#f00';
 12980 ctx.moveTo(-10, -10);
 12981 ctx.lineTo(110, -10);
 12982 ctx.lineTo(110, 60);
 12983 ctx.lineTo(-10, 60);
 12984 ctx.moveTo(0, 0);
 12985 ctx.lineTo(0, 50);
 12986 ctx.lineTo(100, 50);
 12987 ctx.lineTo(100, 0);
 12988 ctx.fill();
 12990 isPixel(ctx, 50,25, 0,255,0,255, 0);
 12994 </script>
 12996 <!-- [[[ test_2d.path.fill.winding.subtract.3.html ]]] -->
 12998 <p>Canvas test: 2d.path.fill.winding.subtract.3</p>
 12999 <canvas id="c397" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 13000 <script>
 13003 function test_2d_path_fill_winding_subtract_3() {
 13005 var canvas = document.getElementById('c397');
 13006 var ctx = canvas.getContext('2d');
 13008 ctx.fillStyle = '#f00';
 13009 ctx.fillRect(0, 0, 100, 50);
 13011 ctx.fillStyle = '#0f0';
 13012 ctx.moveTo(-10, -10);
 13013 ctx.lineTo(110, -10);
 13014 ctx.lineTo(110, 60);
 13015 ctx.lineTo(-10, 60);
 13016 ctx.lineTo(-10, -10);
 13017 ctx.lineTo(-20, -20);
 13018 ctx.lineTo(120, -20);
 13019 ctx.lineTo(120, 70);
 13020 ctx.lineTo(-20, 70);
 13021 ctx.lineTo(-20, -20);
 13022 ctx.lineTo(0, 0);
 13023 ctx.lineTo(0, 50);
 13024 ctx.lineTo(100, 50);
 13025 ctx.lineTo(100, 0);
 13026 ctx.fill();
 13028 isPixel(ctx, 50,25, 0,255,0,255, 0);
 13032 </script>
 13034 <!-- [[[ test_2d.path.initial.html ]]] -->
 13036 <p>Canvas test: 2d.path.initial</p>
 13037 <canvas id="c398" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
 13038 <script>
 13042 function test_2d_path_initial() {
 13044 var canvas = document.getElementById('c398');
 13045 var ctx = canvas.getContext('2d');
 13047 ctx.lineTo(0, 0);
 13048 ctx.lineTo(100, 0);
 13049 ctx.lineTo(100, 50);
 13050 ctx.lineTo(0, 50);
 13051 ctx.closePath();
 13052 ctx.fillStyle = '#f00';
 13053 ctx.fill();
 13054 todo_isPixel(ctx, 50,25, 0,0,0,0, 0);
 13058 </script>
 13060 <!-- [[[ test_2d.path.isPointInPath.arc.html ]]] -->
 13062 <p>Canvas test: 2d.path.isPointInPath.arc</p>
 13063 <!-- Testing: isPointInPath() works on arcs -->
 13064 <canvas id="c399" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 13065 <script>
 13067 function test_2d_path_isPointInPath_arc() {
 13069 var canvas = document.getElementById('c399');
 13070 var ctx = canvas.getContext('2d');
 13072 ctx.arc(50, 25, 10, 0, Math.PI, false);
 13073 ok(ctx.isPointInPath(50, 10) === false, "ctx.isPointInPath(50, 10) === false");
 13074 ok(ctx.isPointInPath(50, 20) === false, "ctx.isPointInPath(50, 20) === false");
 13075 ok(ctx.isPointInPath(50, 30) === true, "ctx.isPointInPath(50, 30) === true");
 13076 ok(ctx.isPointInPath(50, 40) === false, "ctx.isPointInPath(50, 40) === false");
 13077 ok(ctx.isPointInPath(30, 20) === false, "ctx.isPointInPath(30, 20) === false");
 13078 ok(ctx.isPointInPath(70, 20) === false, "ctx.isPointInPath(70, 20) === false");
 13079 ok(ctx.isPointInPath(30, 30) === false, "ctx.isPointInPath(30, 30) === false");
 13080 ok(ctx.isPointInPath(70, 30) === false, "ctx.isPointInPath(70, 30) === false");
 13084 </script>
 13086 <!-- [[[ test_2d.path.isPointInPath.basic.1.html ]]] -->
 13088 <p>Canvas test: 2d.path.isPointInPath.basic.1</p>
 13089 <!-- Testing: isPointInPath() detects whether the point is inside the path -->
 13090 <canvas id="c400" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 13091 <script>
 13093 function test_2d_path_isPointInPath_basic_1() {
 13095 var canvas = document.getElementById('c400');
 13096 var ctx = canvas.getContext('2d');
 13098 ctx.rect(0, 0, 20, 20);
 13099 ok(ctx.isPointInPath(10, 10) === true, "ctx.isPointInPath(10, 10) === true");
 13100 ok(ctx.isPointInPath(30, 10) === false, "ctx.isPointInPath(30, 10) === false");
 13104 </script>
 13106 <!-- [[[ test_2d.path.isPointInPath.basic.2.html ]]] -->
 13108 <p>Canvas test: 2d.path.isPointInPath.basic.2</p>
 13109 <!-- Testing: isPointInPath() detects whether the point is inside the path -->
 13110 <canvas id="c401" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 13111 <script>
 13113 function test_2d_path_isPointInPath_basic_2() {
 13115 var canvas = document.getElementById('c401');
 13116 var ctx = canvas.getContext('2d');
 13118 ctx.rect(20, 0, 20, 20);
 13119 ok(ctx.isPointInPath(10, 10) === false, "ctx.isPointInPath(10, 10) === false");
 13120 ok(ctx.isPointInPath(30, 10) === true, "ctx.isPointInPath(30, 10) === true");
 13124 </script>
 13126 <!-- [[[ test_2d.path.isPointInPath.bezier.html ]]] -->
 13128 <p>Canvas test: 2d.path.isPointInPath.bezier</p>
 13129 <!-- Testing: isPointInPath() works on Bezier curves -->
 13130 <canvas id="c402" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 13131 <script>
 13133 function test_2d_path_isPointInPath_bezier() {
 13135 var canvas = document.getElementById('c402');
 13136 var ctx = canvas.getContext('2d');
 13138 ctx.moveTo(25, 25);
 13139 ctx.bezierCurveTo(50, -50, 50, 100, 75, 25);
 13140 ok(ctx.isPointInPath(25, 20) == false, "ctx.isPointInPath(25, 20) == false");
 13141 ok(ctx.isPointInPath(25, 30) == false, "ctx.isPointInPath(25, 30) == false");
 13142 ok(ctx.isPointInPath(30, 20) == true, "ctx.isPointInPath(30, 20) == true");
 13143 ok(ctx.isPointInPath(30, 30) == false, "ctx.isPointInPath(30, 30) == false");
 13144 ok(ctx.isPointInPath(40, 2) == false, "ctx.isPointInPath(40, 2) == false");
 13145 ok(ctx.isPointInPath(40, 20) == true, "ctx.isPointInPath(40, 20) == true");
 13146 ok(ctx.isPointInPath(40, 30) == false, "ctx.isPointInPath(40, 30) == false");
 13147 ok(ctx.isPointInPath(40, 47) == false, "ctx.isPointInPath(40, 47) == false");
 13148 ok(ctx.isPointInPath(45, 20) == true, "ctx.isPointInPath(45, 20) == true");
 13149 ok(ctx.isPointInPath(45, 30) == false, "ctx.isPointInPath(45, 30) == false");
 13150 ok(ctx.isPointInPath(55, 20) == false, "ctx.isPointInPath(55, 20) == false");
 13151 ok(ctx.isPointInPath(55, 30) == true, "ctx.isPointInPath(55, 30) == true");
 13152 ok(ctx.isPointInPath(60, 2) == false, "ctx.isPointInPath(60, 2) == false");
 13153 ok(ctx.isPointInPath(60, 20) == false, "ctx.isPointInPath(60, 20) == false");
 13154 ok(ctx.isPointInPath(60, 30) == true, "ctx.isPointInPath(60, 30) == true");
 13155 ok(ctx.isPointInPath(60, 47) == false, "ctx.isPointInPath(60, 47) == false");
 13156 ok(ctx.isPointInPath(70, 20) == false, "ctx.isPointInPath(70, 20) == false");
 13157 ok(ctx.isPointInPath(70, 30) == true, "ctx.isPointInPath(70, 30) == true");
 13158 ok(ctx.isPointInPath(75, 20) == false, "ctx.isPointInPath(75, 20) == false");
 13159 ok(ctx.isPointInPath(75, 30) == false, "ctx.isPointInPath(75, 30) == false");
 13163 </script>
 13165 <!-- [[[ test_2d.path.isPointInPath.bigarc.html ]]] -->
 13167 <p>Canvas test: 2d.path.isPointInPath.bigarc</p>
 13168 <!-- Testing: isPointInPath() works on unclosed arcs larger than 2pi -->
 13169 <canvas id="c403" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 13170 <script>
 13172 function test_2d_path_isPointInPath_bigarc() {
 13174 var canvas = document.getElementById('c403');
 13175 var ctx = canvas.getContext('2d');
 13177 ctx.arc(50, 25, 10, 0, 7, false);
 13178 ok(ctx.isPointInPath(50, 10) === false, "ctx.isPointInPath(50, 10) === false");
 13179 ok(ctx.isPointInPath(50, 20) === true, "ctx.isPointInPath(50, 20) === true");
 13180 ok(ctx.isPointInPath(50, 30) === true, "ctx.isPointInPath(50, 30) === true");
 13181 ok(ctx.isPointInPath(50, 40) === false, "ctx.isPointInPath(50, 40) === false");
 13182 ok(ctx.isPointInPath(30, 20) === false, "ctx.isPointInPath(30, 20) === false");
 13183 ok(ctx.isPointInPath(70, 20) === false, "ctx.isPointInPath(70, 20) === false");
 13184 ok(ctx.isPointInPath(30, 30) === false, "ctx.isPointInPath(30, 30) === false");
 13185 ok(ctx.isPointInPath(70, 30) === false, "ctx.isPointInPath(70, 30) === false");
 13189 </script>
 13191 <!-- [[[ test_2d.path.isPointInPath.edge.html ]]] -->
 13193 <p>Canvas test: 2d.path.isPointInPath.edge</p>
 13194 <!-- Testing: isPointInPath() counts points on the path as being inside -->
 13195 <canvas id="c404" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 13196 <script>
 13198 function test_2d_path_isPointInPath_edge() {
 13200 var canvas = document.getElementById('c404');
 13201 var ctx = canvas.getContext('2d');
 13203 ctx.rect(0, 0, 20, 20);
 13205 ok(ctx.isPointInPath(0, 0) === true, "ctx.isPointInPath(0, 0) === true");
 13206 ok(ctx.isPointInPath(10, 0) === true, "ctx.isPointInPath(10, 0) === true");
 13207 ok(ctx.isPointInPath(20, 0) === true, "ctx.isPointInPath(20, 0) === true");
 13208 ok(ctx.isPointInPath(20, 10) === true, "ctx.isPointInPath(20, 10) === true");
 13209 ok(ctx.isPointInPath(20, 20) === true, "ctx.isPointInPath(20, 20) === true");
 13210 ok(ctx.isPointInPath(10, 20) === true, "ctx.isPointInPath(10, 20) === true");
 13211 ok(ctx.isPointInPath(0, 20) === true, "ctx.isPointInPath(0, 20) === true");
 13212 ok(ctx.isPointInPath(0, 10) === true, "ctx.isPointInPath(0, 10) === true");
 13213 ok(ctx.isPointInPath(10, -0.01) === false, "ctx.isPointInPath(10, -0.01) === false");
 13214 ok(ctx.isPointInPath(10, 20.01) === false, "ctx.isPointInPath(10, 20.01) === false");
 13215 ok(ctx.isPointInPath(-0.01, 10) === false, "ctx.isPointInPath(-0.01, 10) === false");
 13216 ok(ctx.isPointInPath(20.01, 10) === false, "ctx.isPointInPath(20.01, 10) === false");
 13219 </script>
 13221 <!-- [[[ test_2d.path.isPointInPath.empty.html ]]] -->
 13223 <p>Canvas test: 2d.path.isPointInPath.empty</p>
 13224 <!-- Testing: isPointInPath() works when there is no path -->
 13225 <canvas id="c405" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 13226 <script>
 13228 function test_2d_path_isPointInPath_empty() {
 13230 var canvas = document.getElementById('c405');
 13231 var ctx = canvas.getContext('2d');
 13233 ok(ctx.isPointInPath(0, 0) === false, "ctx.isPointInPath(0, 0) === false");
 13237 </script>
 13239 <!-- [[[ test_2d.path.isPointInPath.nonfinite.html ]]] -->
 13241 <p>Canvas test: 2d.path.isPointInPath.nonfinite</p>
 13242 <!-- Testing: isPointInPath() returns false for non-finite arguments -->
 13243 <canvas id="c406" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 13244 <script>
 13246 function test_2d_path_isPointInPath_nonfinite() {
 13248 var canvas = document.getElementById('c406');
 13249 var ctx = canvas.getContext('2d');
 13251 var _thrown_outer = false;
 13252 try {
 13254 ctx.rect(-100, -50, 200, 100);
 13255 ok(ctx.isPointInPath(Infinity, 0) === false, "ctx.isPointInPath(Infinity, 0) === false");
 13256 ok(ctx.isPointInPath(-Infinity, 0) === false, "ctx.isPointInPath(-Infinity, 0) === false");
 13257 ok(ctx.isPointInPath(NaN, 0) === false, "ctx.isPointInPath(NaN, 0) === false");
 13258 ok(ctx.isPointInPath(0, Infinity) === false, "ctx.isPointInPath(0, Infinity) === false");
 13259 ok(ctx.isPointInPath(0, -Infinity) === false, "ctx.isPointInPath(0, -Infinity) === false");
 13260 ok(ctx.isPointInPath(0, NaN) === false, "ctx.isPointInPath(0, NaN) === false");
 13261 ok(ctx.isPointInPath(NaN, NaN) === false, "ctx.isPointInPath(NaN, NaN) === false");
 13263 } catch (e) {
 13264     _thrown_outer = true;
 13266 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 13270 </script>
 13272 <!-- [[[ test_2d.path.isPointInPath.outside.html ]]] -->
 13274 <p>Canvas test: 2d.path.isPointInPath.outside</p>
 13275 <!-- Testing: isPointInPath() works on paths outside the canvas -->
 13276 <canvas id="c407" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 13277 <script>
 13279 function test_2d_path_isPointInPath_outside() {
 13281 var canvas = document.getElementById('c407');
 13282 var ctx = canvas.getContext('2d');
 13284 ctx.rect(0, -100, 20, 20);
 13285 ctx.rect(20, -10, 20, 20);
 13286 ok(ctx.isPointInPath(10, -110) === false, "ctx.isPointInPath(10, -110) === false");
 13287 ok(ctx.isPointInPath(10, -90) === true, "ctx.isPointInPath(10, -90) === true");
 13288 ok(ctx.isPointInPath(10, -70) === false, "ctx.isPointInPath(10, -70) === false");
 13289 ok(ctx.isPointInPath(30, -20) === false, "ctx.isPointInPath(30, -20) === false");
 13290 ok(ctx.isPointInPath(30, 0) === true, "ctx.isPointInPath(30, 0) === true");
 13291 ok(ctx.isPointInPath(30, 20) === false, "ctx.isPointInPath(30, 20) === false");
 13295 </script>
 13297 <!-- [[[ test_2d.path.isPointInPath.subpath.html ]]] -->
 13299 <p>Canvas test: 2d.path.isPointInPath.subpath</p>
 13300 <!-- Testing: isPointInPath() uses the current path, not just the subpath -->
 13301 <canvas id="c408" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 13302 <script>
 13304 function test_2d_path_isPointInPath_subpath() {
 13306 var canvas = document.getElementById('c408');
 13307 var ctx = canvas.getContext('2d');
 13309 ctx.rect(0, 0, 20, 20);
 13310 ctx.beginPath();
 13311 ctx.rect(20, 0, 20, 20);
 13312 ctx.closePath();
 13313 ctx.rect(40, 0, 20, 20);
 13314 ok(ctx.isPointInPath(10, 10) === false, "ctx.isPointInPath(10, 10) === false");
 13315 ok(ctx.isPointInPath(30, 10) === true, "ctx.isPointInPath(30, 10) === true");
 13316 ok(ctx.isPointInPath(50, 10) === true, "ctx.isPointInPath(50, 10) === true");
 13320 </script>
 13322 <!-- [[[ test_2d.path.isPointInPath.transform.1.html ]]] -->
 13324 <p>Canvas test: 2d.path.isPointInPath.transform.1 - bug 405300</p>
 13325 <!-- Testing: isPointInPath() handles transformations correctly -->
 13326 <canvas id="c409" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 13327 <script>
 13329 function test_2d_path_isPointInPath_transform_1() {
 13331 var canvas = document.getElementById('c409');
 13332 var ctx = canvas.getContext('2d');
 13334 ctx.translate(50, 0);
 13335 ctx.rect(0, 0, 20, 20);
 13336 ok(ctx.isPointInPath(-40, 10) === false, "ctx.isPointInPath(-40, 10) === false");
 13337 ok(ctx.isPointInPath(10, 10) === false, "ctx.isPointInPath(10, 10) === false");
 13338 ok(ctx.isPointInPath(49, 10) === false, "ctx.isPointInPath(49, 10) === false");
 13339 ok(ctx.isPointInPath(51, 10) === true, "ctx.isPointInPath(51, 10) === true");
 13340 ok(ctx.isPointInPath(69, 10) === true, "ctx.isPointInPath(69, 10) === true");
 13341 ok(ctx.isPointInPath(71, 10) === false, "ctx.isPointInPath(71, 10) === false");
 13345 </script>
 13347 <!-- [[[ test_2d.path.isPointInPath.transform.2.html ]]] -->
 13349 <p>Canvas test: 2d.path.isPointInPath.transform.2 - bug 405300</p>
 13350 <!-- Testing: isPointInPath() handles transformations correctly -->
 13351 <canvas id="c410" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 13352 <script>
 13354 function test_2d_path_isPointInPath_transform_2() {
 13356 var canvas = document.getElementById('c410');
 13357 var ctx = canvas.getContext('2d');
 13359 ctx.rect(50, 0, 20, 20);
 13360 ctx.translate(50, 0);
 13361 ok(ctx.isPointInPath(-40, 10) === false, "ctx.isPointInPath(-40, 10) === false");
 13362 ok(ctx.isPointInPath(10, 10) === false, "ctx.isPointInPath(10, 10) === false");
 13363 ok(ctx.isPointInPath(49, 10) === false, "ctx.isPointInPath(49, 10) === false");
 13364 ok(ctx.isPointInPath(51, 10) === true, "ctx.isPointInPath(51, 10) === true");
 13365 ok(ctx.isPointInPath(69, 10) === true, "ctx.isPointInPath(69, 10) === true");
 13366 ok(ctx.isPointInPath(71, 10) === false, "ctx.isPointInPath(71, 10) === false");
 13370 </script>
 13372 <!-- [[[ test_2d.path.isPointInPath.transform.3.html ]]] -->
 13374 <p>Canvas test: 2d.path.isPointInPath.transform.3 - bug 405300</p>
 13375 <!-- Testing: isPointInPath() handles transformations correctly -->
 13376 <canvas id="c411" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 13377 <script>
 13379 function test_2d_path_isPointInPath_transform_3() {
 13381 var canvas = document.getElementById('c411');
 13382 var ctx = canvas.getContext('2d');
 13384 ctx.scale(-1, 1);
 13385 ctx.rect(-70, 0, 20, 20);
 13386 ok(ctx.isPointInPath(-40, 10) === false, "ctx.isPointInPath(-40, 10) === false");
 13387 ok(ctx.isPointInPath(10, 10) === false, "ctx.isPointInPath(10, 10) === false");
 13388 ok(ctx.isPointInPath(49, 10) === false, "ctx.isPointInPath(49, 10) === false");
 13389 ok(ctx.isPointInPath(51, 10) === true, "ctx.isPointInPath(51, 10) === true");
 13390 ok(ctx.isPointInPath(69, 10) === true, "ctx.isPointInPath(69, 10) === true");
 13391 ok(ctx.isPointInPath(71, 10) === false, "ctx.isPointInPath(71, 10) === false");
 13395 </script>
 13397 <!-- [[[ test_2d.path.isPointInPath.unclosed.html ]]] -->
 13399 <p>Canvas test: 2d.path.isPointInPath.unclosed</p>
 13400 <!-- Testing: isPointInPath() works on unclosed subpaths -->
 13401 <canvas id="c412" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 13402 <script>
 13404 function test_2d_path_isPointInPath_unclosed() {
 13406 var canvas = document.getElementById('c412');
 13407 var ctx = canvas.getContext('2d');
 13409 ctx.moveTo(0, 0);
 13410 ctx.lineTo(20, 0);
 13411 ctx.lineTo(20, 20);
 13412 ctx.lineTo(0, 20);
 13413 ok(ctx.isPointInPath(10, 10) === true, "ctx.isPointInPath(10, 10) === true");
 13414 ok(ctx.isPointInPath(30, 10) === false, "ctx.isPointInPath(30, 10) === false");
 13418 </script>
 13420 <!-- [[[ test_2d.path.isPointInPath.winding.html ]]] -->
 13422 <p>Canvas test: 2d.path.isPointInPath.winding</p>
 13423 <!-- Testing: isPointInPath() uses the non-zero winding number rule -->
 13424 <canvas id="c413" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 13425 <script>
 13427 function test_2d_path_isPointInPath_winding() {
 13429 var canvas = document.getElementById('c413');
 13430 var ctx = canvas.getContext('2d');
 13432 // Create a square ring, using opposite windings to make a hole in the centre
 13433 ctx.moveTo(0, 0);
 13434 ctx.lineTo(50, 0);
 13435 ctx.lineTo(50, 50);
 13436 ctx.lineTo(0, 50);
 13437 ctx.lineTo(0, 0);
 13438 ctx.lineTo(10, 10);
 13439 ctx.lineTo(10, 40);
 13440 ctx.lineTo(40, 40);
 13441 ctx.lineTo(40, 10);
 13442 ctx.lineTo(10, 10);
 13444 ok(ctx.isPointInPath(5, 5) === true, "ctx.isPointInPath(5, 5) === true");
 13445 ok(ctx.isPointInPath(25, 5) === true, "ctx.isPointInPath(25, 5) === true");
 13446 ok(ctx.isPointInPath(45, 5) === true, "ctx.isPointInPath(45, 5) === true");
 13447 ok(ctx.isPointInPath(5, 25) === true, "ctx.isPointInPath(5, 25) === true");
 13448 ok(ctx.isPointInPath(25, 25) === false, "ctx.isPointInPath(25, 25) === false");
 13449 ok(ctx.isPointInPath(45, 25) === true, "ctx.isPointInPath(45, 25) === true");
 13450 ok(ctx.isPointInPath(5, 45) === true, "ctx.isPointInPath(5, 45) === true");
 13451 ok(ctx.isPointInPath(25, 45) === true, "ctx.isPointInPath(25, 45) === true");
 13452 ok(ctx.isPointInPath(45, 45) === true, "ctx.isPointInPath(45, 45) === true");
 13456 </script>
 13458 <!-- [[[ test_2d.path.lineTo.basic.html ]]] -->
 13460 <p>Canvas test: 2d.path.lineTo.basic</p>
 13461 <canvas id="c414" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
 13462 <script>
 13465 function test_2d_path_lineTo_basic() {
 13467 var canvas = document.getElementById('c414');
 13468 var ctx = canvas.getContext('2d');
 13470 ctx.strokeStyle = '#0f0';
 13471 ctx.lineWidth = 50;
 13472 ctx.beginPath();
 13473 ctx.moveTo(0, 25);
 13474 ctx.lineTo(100, 25);
 13475 ctx.stroke();
 13476 isPixel(ctx, 50,25, 0,255,0,255, 0);
 13480 </script>
 13482 <!-- [[[ test_2d.path.lineTo.emptysubpath.html ]]] -->
 13484 <p>Canvas test: 2d.path.lineTo.emptysubpath</p>
 13485 <canvas id="c415" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
 13486 <script>
 13490 function test_2d_path_lineTo_emptysubpath() {
 13492 var canvas = document.getElementById('c415');
 13493 var ctx = canvas.getContext('2d');
 13495 ctx.strokeStyle = '#f00';
 13496 ctx.lineWidth = 50;
 13497 ctx.beginPath();
 13498 ctx.lineTo(0, 25);
 13499 ctx.lineTo(100, 25);
 13500 ctx.stroke();
 13501 todo_isPixel(ctx, 50,25, 0,0,0,0, 0);
 13505 </script>
 13507 <!-- [[[ test_2d.path.lineTo.nextpoint.html ]]] -->
 13509 <p>Canvas test: 2d.path.lineTo.nextpoint</p>
 13510 <canvas id="c416" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
 13511 <script>
 13514 function test_2d_path_lineTo_nextpoint() {
 13516 var canvas = document.getElementById('c416');
 13517 var ctx = canvas.getContext('2d');
 13519 ctx.strokeStyle = '#0f0';
 13520 ctx.lineWidth = 50;
 13521 ctx.beginPath();
 13522 ctx.moveTo(-100, -100);
 13523 ctx.lineTo(0, 25);
 13524 ctx.lineTo(100, 25);
 13525 ctx.stroke();
 13526 isPixel(ctx, 50,25, 0,255,0,255, 0);
 13530 </script>
 13532 <!-- [[[ test_2d.path.lineTo.nonfinite.html ]]] -->
 13534 <p>Canvas test: 2d.path.lineTo.nonfinite</p>
 13535 <!-- Testing: lineTo() with Infinity/NaN is ignored -->
 13536 <canvas id="c417" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 13537 <script>
 13540 function test_2d_path_lineTo_nonfinite() {
 13542 var canvas = document.getElementById('c417');
 13543 var ctx = canvas.getContext('2d');
 13545 var _thrown_outer = false;
 13546 try {
 13548 ctx.moveTo(0, 0);
 13549 ctx.lineTo(100, 0);
 13550 ctx.lineTo(Infinity, 50);
 13551 ctx.lineTo(-Infinity, 50);
 13552 ctx.lineTo(NaN, 50);
 13553 ctx.lineTo(0, Infinity);
 13554 ctx.lineTo(0, -Infinity);
 13555 ctx.lineTo(0, NaN);
 13556 ctx.lineTo(Infinity, Infinity);
 13557 ctx.lineTo(100, 50);
 13558 ctx.lineTo(0, 50);
 13559 ctx.fillStyle = '#0f0';
 13560 ctx.fill();
 13561 isPixel(ctx, 50,25, 0,255,0,255, 0);
 13562 isPixel(ctx, 90,45, 0,255,0,255, 0);
 13564 } catch (e) {
 13565     _thrown_outer = true;
 13567 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 13571 </script>
 13573 <!-- [[[ test_2d.path.moveTo.basic.html ]]] -->
 13575 <p>Canvas test: 2d.path.moveTo.basic</p>
 13576 <canvas id="c418" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
 13577 <script>
 13580 function test_2d_path_moveTo_basic() {
 13582 var canvas = document.getElementById('c418');
 13583 var ctx = canvas.getContext('2d');
 13585 ctx.rect(0, 0, 10, 50);
 13586 ctx.moveTo(100, 0);
 13587 ctx.lineTo(10, 0);
 13588 ctx.lineTo(10, 50);
 13589 ctx.lineTo(100, 50);
 13590 ctx.fillStyle = '#0f0';
 13591 ctx.fill();
 13592 isPixel(ctx, 90,25, 0,255,0,255, 0);
 13596 </script>
 13598 <!-- [[[ test_2d.path.moveTo.multiple.html ]]] -->
 13600 <p>Canvas test: 2d.path.moveTo.multiple</p>
 13601 <canvas id="c419" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
 13602 <script>
 13605 function test_2d_path_moveTo_multiple() {
 13607 var canvas = document.getElementById('c419');
 13608 var ctx = canvas.getContext('2d');
 13610 ctx.moveTo(0, 25);
 13611 ctx.moveTo(100, 25);
 13612 ctx.moveTo(0, 25);
 13613 ctx.lineTo(100, 25);
 13614 ctx.strokeStyle = '#0f0';
 13615 ctx.lineWidth = 50;
 13616 ctx.stroke();
 13617 isPixel(ctx, 50,25, 0,255,0,255, 0);
 13621 </script>
 13623 <!-- [[[ test_2d.path.moveTo.newsubpath.html ]]] -->
 13625 <p>Canvas test: 2d.path.moveTo.newsubpath</p>
 13626 <canvas id="c420" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
 13627 <script>
 13630 function test_2d_path_moveTo_newsubpath() {
 13632 var canvas = document.getElementById('c420');
 13633 var ctx = canvas.getContext('2d');
 13635 ctx.beginPath();
 13636 ctx.moveTo(0, 0);
 13637 ctx.moveTo(100, 0);
 13638 ctx.moveTo(100, 50);
 13639 ctx.moveTo(0, 50);
 13640 ctx.fillStyle = '#f00';
 13641 ctx.fill();
 13642 isPixel(ctx, 50,25, 0,0,0,0, 0);
 13646 </script>
 13648 <!-- [[[ test_2d.path.moveTo.nonfinite.html ]]] -->
 13650 <p>Canvas test: 2d.path.moveTo.nonfinite</p>
 13651 <!-- Testing: moveTo() with Infinity/NaN is ignored -->
 13652 <canvas id="c421" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 13653 <script>
 13656 function test_2d_path_moveTo_nonfinite() {
 13658 var canvas = document.getElementById('c421');
 13659 var ctx = canvas.getContext('2d');
 13661 var _thrown_outer = false;
 13662 try {
 13664 ctx.moveTo(0, 0);
 13665 ctx.lineTo(100, 0);
 13666 ctx.moveTo(Infinity, 50);
 13667 ctx.moveTo(-Infinity, 50);
 13668 ctx.moveTo(NaN, 50);
 13669 ctx.moveTo(0, Infinity);
 13670 ctx.moveTo(0, -Infinity);
 13671 ctx.moveTo(0, NaN);
 13672 ctx.moveTo(Infinity, Infinity);
 13673 ctx.lineTo(100, 50);
 13674 ctx.lineTo(0, 50);
 13675 ctx.fillStyle = '#0f0';
 13676 ctx.fill();
 13677 isPixel(ctx, 50,25, 0,255,0,255, 0);
 13679 } catch (e) {
 13680     _thrown_outer = true;
 13682 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 13686 </script>
 13688 <!-- [[[ test_2d.path.quadraticCurveTo.basic.html ]]] -->
 13690 <p>Canvas test: 2d.path.quadraticCurveTo.basic</p>
 13691 <canvas id="c422" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
 13692 <script>
 13695 function test_2d_path_quadraticCurveTo_basic() {
 13697 var canvas = document.getElementById('c422');
 13698 var ctx = canvas.getContext('2d');
 13700 ctx.strokeStyle = '#0f0';
 13701 ctx.lineWidth = 50;
 13702 ctx.beginPath();
 13703 ctx.moveTo(0, 25);
 13704 ctx.quadraticCurveTo(100, 25, 100, 25);
 13705 ctx.stroke();
 13706 isPixel(ctx, 50,25, 0,255,0,255, 0);
 13710 </script>
 13712 <!-- [[[ test_2d.path.quadraticCurveTo.emptysubpath.html ]]] -->
 13714 <p>Canvas test: 2d.path.quadraticCurveTo.emptysubpath</p>
 13715 <canvas id="c423" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
 13716 <script>
 13720 function test_2d_path_quadraticCurveTo_emptysubpath() {
 13722 var canvas = document.getElementById('c423');
 13723 var ctx = canvas.getContext('2d');
 13725 ctx.strokeStyle = '#f00';
 13726 ctx.lineWidth = 50;
 13727 ctx.beginPath();
 13728 ctx.quadraticCurveTo(0, 25, 0, 25);
 13729 ctx.quadraticCurveTo(100, 25, 100, 25);
 13730 ctx.stroke();
 13731 todo_isPixel(ctx, 50,25, 0,0,0,0, 0);
 13735 </script>
 13737 <!-- [[[ test_2d.path.quadraticCurveTo.nonfinite.html ]]] -->
 13739 <p>Canvas test: 2d.path.quadraticCurveTo.nonfinite</p>
 13740 <!-- Testing: quadraticCurveTo() with Infinity/NaN is ignored -->
 13741 <canvas id="c424" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 13742 <script>
 13745 function test_2d_path_quadraticCurveTo_nonfinite() {
 13747 var canvas = document.getElementById('c424');
 13748 var ctx = canvas.getContext('2d');
 13750 var _thrown_outer = false;
 13751 try {
 13753 ctx.moveTo(0, 0);
 13754 ctx.lineTo(100, 0);
 13755 ctx.quadraticCurveTo(Infinity, 50, 0, 50);
 13756 ctx.quadraticCurveTo(-Infinity, 50, 0, 50);
 13757 ctx.quadraticCurveTo(NaN, 50, 0, 50);
 13758 ctx.quadraticCurveTo(0, Infinity, 0, 50);
 13759 ctx.quadraticCurveTo(0, -Infinity, 0, 50);
 13760 ctx.quadraticCurveTo(0, NaN, 0, 50);
 13761 ctx.quadraticCurveTo(0, 50, Infinity, 50);
 13762 ctx.quadraticCurveTo(0, 50, -Infinity, 50);
 13763 ctx.quadraticCurveTo(0, 50, NaN, 50);
 13764 ctx.quadraticCurveTo(0, 50, 0, Infinity);
 13765 ctx.quadraticCurveTo(0, 50, 0, -Infinity);
 13766 ctx.quadraticCurveTo(0, 50, 0, NaN);
 13767 ctx.quadraticCurveTo(Infinity, Infinity, 0, 50);
 13768 ctx.quadraticCurveTo(Infinity, Infinity, Infinity, 50);
 13769 ctx.quadraticCurveTo(Infinity, Infinity, Infinity, Infinity);
 13770 ctx.quadraticCurveTo(Infinity, Infinity, 0, Infinity);
 13771 ctx.quadraticCurveTo(Infinity, 50, Infinity, 50);
 13772 ctx.quadraticCurveTo(Infinity, 50, Infinity, Infinity);
 13773 ctx.quadraticCurveTo(Infinity, 50, 0, Infinity);
 13774 ctx.quadraticCurveTo(0, Infinity, Infinity, 50);
 13775 ctx.quadraticCurveTo(0, Infinity, Infinity, Infinity);
 13776 ctx.quadraticCurveTo(0, Infinity, 0, Infinity);
 13777 ctx.quadraticCurveTo(0, 50, Infinity, Infinity);
 13778 ctx.lineTo(100, 50);
 13779 ctx.lineTo(0, 50);
 13780 ctx.fillStyle = '#0f0';
 13781 ctx.fill();
 13782 isPixel(ctx, 50,25, 0,255,0,255, 0);
 13783 isPixel(ctx, 90,45, 0,255,0,255, 0);
 13785 } catch (e) {
 13786     _thrown_outer = true;
 13788 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 13792 </script>
 13794 <!-- [[[ test_2d.path.quadraticCurveTo.scaled.html ]]] -->
 13796 <p>Canvas test: 2d.path.quadraticCurveTo.scaled</p>
 13797 <canvas id="c425" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
 13798 <script>
 13801 function test_2d_path_quadraticCurveTo_scaled() {
 13803 var canvas = document.getElementById('c425');
 13804 var ctx = canvas.getContext('2d');
 13806 ctx.scale(1000, 1000);
 13807 ctx.strokeStyle = '#0f0';
 13808 ctx.lineWidth = 0.055;
 13809 ctx.beginPath();
 13810 ctx.moveTo(-1, 1.05);
 13811 ctx.quadraticCurveTo(0, -1, 1.2, 1.05);
 13812 ctx.stroke();
 13813 isPixel(ctx, 50,25, 0,255,0,255, 0);
 13814 isPixel(ctx, 1,1, 0,255,0,255, 0);
 13815 isPixel(ctx, 98,1, 0,255,0,255, 0);
 13816 isPixel(ctx, 1,48, 0,255,0,255, 0);
 13817 isPixel(ctx, 98,48, 0,255,0,255, 0);
 13821 </script>
 13823 <!-- [[[ test_2d.path.quadraticCurveTo.shape.html ]]] -->
 13825 <p>Canvas test: 2d.path.quadraticCurveTo.shape</p>
 13826 <canvas id="c426" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
 13827 <script>
 13830 function test_2d_path_quadraticCurveTo_shape() {
 13832 var canvas = document.getElementById('c426');
 13833 var ctx = canvas.getContext('2d');
 13835 ctx.strokeStyle = '#0f0';
 13836 ctx.lineWidth = 55;
 13837 ctx.beginPath();
 13838 ctx.moveTo(-1000, 1050);
 13839 ctx.quadraticCurveTo(0, -1000, 1200, 1050);
 13840 ctx.stroke();
 13841 isPixel(ctx, 50,25, 0,255,0,255, 0);
 13842 isPixel(ctx, 1,1, 0,255,0,255, 0);
 13843 isPixel(ctx, 98,1, 0,255,0,255, 0);
 13844 isPixel(ctx, 1,48, 0,255,0,255, 0);
 13845 isPixel(ctx, 98,48, 0,255,0,255, 0);
 13849 </script>
 13851 <!-- [[[ test_2d.path.rect.basic.html ]]] -->
 13853 <p>Canvas test: 2d.path.rect.basic</p>
 13854 <canvas id="c427" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
 13855 <script>
 13858 function test_2d_path_rect_basic() {
 13860 var canvas = document.getElementById('c427');
 13861 var ctx = canvas.getContext('2d');
 13863 ctx.fillStyle = '#0f0';
 13864 ctx.rect(0, 0, 100, 50);
 13865 ctx.fill();
 13866 isPixel(ctx, 50,25, 0,255,0,255, 0);
 13870 </script>
 13872 <!-- [[[ test_2d.path.rect.closed.html ]]] -->
 13874 <p>Canvas test: 2d.path.rect.closed</p>
 13875 <canvas id="c428" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
 13876 <script>
 13879 function test_2d_path_rect_closed() {
 13881 var canvas = document.getElementById('c428');
 13882 var ctx = canvas.getContext('2d');
 13884 ctx.strokeStyle = '#0f0';
 13885 ctx.lineWidth = 200;
 13886 ctx.lineJoin = 'miter';
 13887 ctx.rect(100, 50, 100, 100);
 13888 ctx.stroke();
 13889 isPixel(ctx, 50,25, 0,255,0,255, 0);
 13893 </script>
 13895 <!-- [[[ test_2d.path.rect.end.1.html ]]] -->
 13897 <p>Canvas test: 2d.path.rect.end.1</p>
 13898 <canvas id="c429" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
 13899 <script>
 13902 function test_2d_path_rect_end_1() {
 13904 var canvas = document.getElementById('c429');
 13905 var ctx = canvas.getContext('2d');
 13907 ctx.strokeStyle = '#0f0';
 13908 ctx.lineWidth = 100;
 13909 ctx.rect(200, 100, 400, 1000);
 13910 ctx.lineTo(-2000, -1000);
 13911 ctx.stroke();
 13912 isPixel(ctx, 50,25, 0,255,0,255, 0);
 13916 </script>
 13918 <!-- [[[ test_2d.path.rect.end.2.html ]]] -->
 13920 <p>Canvas test: 2d.path.rect.end.2</p>
 13921 <canvas id="c430" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
 13922 <script>
 13925 function test_2d_path_rect_end_2() {
 13927 var canvas = document.getElementById('c430');
 13928 var ctx = canvas.getContext('2d');
 13930 ctx.strokeStyle = '#0f0';
 13931 ctx.lineWidth = 450;
 13932 ctx.lineCap = 'round';
 13933 ctx.lineJoin = 'bevel';
 13934 ctx.rect(150, 150, 2000, 2000);
 13935 ctx.lineTo(160, 160);
 13936 ctx.stroke();
 13937 isPixel(ctx, 1,1, 0,255,0,255, 0);
 13938 isPixel(ctx, 98,1, 0,255,0,255, 0);
 13939 isPixel(ctx, 1,48, 0,255,0,255, 0);
 13940 isPixel(ctx, 98,48, 0,255,0,255, 0);
 13944 </script>
 13946 <!-- [[[ test_2d.path.rect.negative.html ]]] -->
 13948 <p>Canvas test: 2d.path.rect.negative</p>
 13949 <canvas id="c431" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 13950 <script>
 13953 function test_2d_path_rect_negative() {
 13955 var canvas = document.getElementById('c431');
 13956 var ctx = canvas.getContext('2d');
 13958 ctx.fillStyle = '#f00';
 13959 ctx.fillRect(0, 0, 100, 50);
 13960 ctx.beginPath();
 13961 ctx.fillStyle = '#0f0';
 13962 ctx.rect(0, 0, 50, 25);
 13963 ctx.rect(100, 0, -50, 25);
 13964 ctx.rect(0, 50, 50, -25);
 13965 ctx.rect(100, 50, -50, -25);
 13966 ctx.fill();
 13967 isPixel(ctx, 25,12, 0,255,0,255, 0);
 13968 isPixel(ctx, 75,12, 0,255,0,255, 0);
 13969 isPixel(ctx, 25,37, 0,255,0,255, 0);
 13970 isPixel(ctx, 75,37, 0,255,0,255, 0);
 13974 </script>
 13976 <!-- [[[ test_2d.path.rect.newsubpath.html ]]] -->
 13978 <p>Canvas test: 2d.path.rect.newsubpath</p>
 13979 <canvas id="c432" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
 13980 <script>
 13983 function test_2d_path_rect_newsubpath() {
 13985 var canvas = document.getElementById('c432');
 13986 var ctx = canvas.getContext('2d');
 13988 ctx.beginPath();
 13989 ctx.strokeStyle = '#f00';
 13990 ctx.lineWidth = 50;
 13991 ctx.moveTo(-100, 25);
 13992 ctx.lineTo(-50, 25);
 13993 ctx.rect(200, 25, 1, 1);
 13994 ctx.stroke();
 13995 isPixel(ctx, 50,25, 0,0,0,0, 0);
 13999 </script>
 14001 <!-- [[[ test_2d.path.rect.nonfinite.html ]]] -->
 14003 <p>Canvas test: 2d.path.rect.nonfinite</p>
 14004 <!-- Testing: rect() with Infinity/NaN is ignored -->
 14005 <canvas id="c433" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 14006 <script>
 14009 function test_2d_path_rect_nonfinite() {
 14011 var canvas = document.getElementById('c433');
 14012 var ctx = canvas.getContext('2d');
 14014 var _thrown_outer = false;
 14015 try {
 14017 ctx.moveTo(0, 0);
 14018 ctx.lineTo(100, 0);
 14019 ctx.rect(Infinity, 50, 1, 1);
 14020 ctx.rect(-Infinity, 50, 1, 1);
 14021 ctx.rect(NaN, 50, 1, 1);
 14022 ctx.rect(0, Infinity, 1, 1);
 14023 ctx.rect(0, -Infinity, 1, 1);
 14024 ctx.rect(0, NaN, 1, 1);
 14025 ctx.rect(0, 50, Infinity, 1);
 14026 ctx.rect(0, 50, -Infinity, 1);
 14027 ctx.rect(0, 50, NaN, 1);
 14028 ctx.rect(0, 50, 1, Infinity);
 14029 ctx.rect(0, 50, 1, -Infinity);
 14030 ctx.rect(0, 50, 1, NaN);
 14031 ctx.rect(Infinity, Infinity, 1, 1);
 14032 ctx.rect(Infinity, Infinity, Infinity, 1);
 14033 ctx.rect(Infinity, Infinity, Infinity, Infinity);
 14034 ctx.rect(Infinity, Infinity, 1, Infinity);
 14035 ctx.rect(Infinity, 50, Infinity, 1);
 14036 ctx.rect(Infinity, 50, Infinity, Infinity);
 14037 ctx.rect(Infinity, 50, 1, Infinity);
 14038 ctx.rect(0, Infinity, Infinity, 1);
 14039 ctx.rect(0, Infinity, Infinity, Infinity);
 14040 ctx.rect(0, Infinity, 1, Infinity);
 14041 ctx.rect(0, 50, Infinity, Infinity);
 14042 ctx.lineTo(100, 50);
 14043 ctx.lineTo(0, 50);
 14044 ctx.fillStyle = '#0f0';
 14045 ctx.fill();
 14046 isPixel(ctx, 50,25, 0,255,0,255, 0);
 14047 isPixel(ctx, 90,45, 0,255,0,255, 0);
 14049 } catch (e) {
 14050     _thrown_outer = true;
 14052 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 14056 </script>
 14058 <!-- [[[ test_2d.path.rect.selfintersect.html ]]] -->
 14060 <p>Canvas test: 2d.path.rect.selfintersect</p>
 14061 <canvas id="c434" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
 14062 <script>
 14066 function test_2d_path_rect_selfintersect() {
 14068 var canvas = document.getElementById('c434');
 14069 var ctx = canvas.getContext('2d');
 14071 ctx.strokeStyle = '#0f0';
 14072 ctx.lineWidth = 90;
 14073 ctx.beginPath();
 14074 ctx.rect(45, 20, 10, 10);
 14075 ctx.stroke();
 14076 isPixel(ctx, 50,25, 0,255,0,255, 0);
 14080 </script>
 14082 <!-- [[[ test_2d.path.rect.winding.html ]]] -->
 14084 <p>Canvas test: 2d.path.rect.winding</p>
 14085 <canvas id="c435" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 14086 <script>
 14089 function test_2d_path_rect_winding() {
 14091 var canvas = document.getElementById('c435');
 14092 var ctx = canvas.getContext('2d');
 14094 ctx.fillStyle = '#0f0';
 14095 ctx.fillRect(0, 0, 100, 50);
 14096 ctx.beginPath();
 14097 ctx.fillStyle = '#f00';
 14098 ctx.rect(0, 0, 50, 50);
 14099 ctx.rect(100, 50, -50, -50);
 14100 ctx.rect(0, 25, 100, -25);
 14101 ctx.rect(100, 25, -100, 25);
 14102 ctx.fill();
 14103 isPixel(ctx, 25,12, 0,255,0,255, 0);
 14104 isPixel(ctx, 75,12, 0,255,0,255, 0);
 14105 isPixel(ctx, 25,37, 0,255,0,255, 0);
 14106 isPixel(ctx, 75,37, 0,255,0,255, 0);
 14110 </script>
 14112 <!-- [[[ test_2d.path.rect.zero.1.html ]]] -->
 14114 <p>Canvas test: 2d.path.rect.zero.1</p>
 14115 <canvas id="c436" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
 14116 <script>
 14119 function test_2d_path_rect_zero_1() {
 14121 var canvas = document.getElementById('c436');
 14122 var ctx = canvas.getContext('2d');
 14124 ctx.strokeStyle = '#0f0';
 14125 ctx.lineWidth = 100;
 14126 ctx.beginPath();
 14127 ctx.rect(0, 50, 100, 0);
 14128 ctx.stroke();
 14129 isPixel(ctx, 50,25, 0,255,0,255, 0);
 14133 </script>
 14135 <!-- [[[ test_2d.path.rect.zero.2.html ]]] -->
 14137 <p>Canvas test: 2d.path.rect.zero.2</p>
 14138 <canvas id="c437" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
 14139 <script>
 14142 function test_2d_path_rect_zero_2() {
 14144 var canvas = document.getElementById('c437');
 14145 var ctx = canvas.getContext('2d');
 14147 ctx.strokeStyle = '#0f0';
 14148 ctx.lineWidth = 100;
 14149 ctx.beginPath();
 14150 ctx.rect(50, -100, 0, 250);
 14151 ctx.stroke();
 14152 isPixel(ctx, 50,25, 0,255,0,255, 0);
 14156 </script>
 14158 <!-- [[[ test_2d.path.rect.zero.3.html ]]] -->
 14160 <p>Canvas test: 2d.path.rect.zero.3</p>
 14161 <canvas id="c438" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
 14162 <script>
 14165 function test_2d_path_rect_zero_3() {
 14167 var canvas = document.getElementById('c438');
 14168 var ctx = canvas.getContext('2d');
 14170 if (!IsD2DEnabled()) {
 14171     // Disabled for D2D until we can figure out Bug 587554.
 14172     ctx.strokeStyle = '#f00';
 14173     ctx.lineWidth = 100;
 14174     ctx.beginPath();
 14175     ctx.rect(50, 25, 0, 0);
 14176     ctx.stroke();
 14177     isPixel(ctx, 50,25, 0,0,0,0, 0);
 14181 </script>
 14183 <!-- [[[ test_2d.path.rect.zero.4.html ]]] -->
 14185 <p>Canvas test: 2d.path.rect.zero.4</p>
 14186 <canvas id="c439" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
 14187 <script>
 14190 function test_2d_path_rect_zero_4() {
 14192 var canvas = document.getElementById('c439');
 14193 var ctx = canvas.getContext('2d');
 14195 ctx.strokeStyle = '#0f0';
 14196 ctx.lineWidth = 50;
 14197 ctx.rect(100, 25, 0, 0);
 14198 ctx.lineTo(0, 25);
 14199 ctx.stroke();
 14200 isPixel(ctx, 50,25, 0,255,0,255, 0);
 14204 </script>
 14206 <!-- [[[ test_2d.path.rect.zero.5.html ]]] -->
 14208 <p>Canvas test: 2d.path.rect.zero.5</p>
 14209 <canvas id="c440" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
 14210 <script>
 14213 function test_2d_path_rect_zero_5() {
 14215 var canvas = document.getElementById('c440');
 14216 var ctx = canvas.getContext('2d');
 14218 ctx.strokeStyle = '#f00';
 14219 ctx.lineWidth = 50;
 14220 ctx.moveTo(0, 0);
 14221 ctx.rect(100, 25, 0, 0);
 14222 ctx.stroke();
 14223 isPixel(ctx, 50,25, 0,0,0,0, 0);
 14227 </script>
 14229 <!-- [[[ test_2d.path.rect.zero.6.html ]]] -->
 14231 <p>Canvas test: 2d.path.rect.zero.6</p>
 14232 <canvas id="c441" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
 14233 <script>
 14237 function test_2d_path_rect_zero_6() {
 14239 var canvas = document.getElementById('c441');
 14240 var ctx = canvas.getContext('2d');
 14242 ctx.strokeStyle = '#f00';
 14243 ctx.lineJoin = 'miter';
 14244 ctx.miterLimit = 1.5;
 14245 ctx.lineWidth = 200;
 14246 ctx.beginPath();
 14247 ctx.rect(100, 25, 1000, 0);
 14248 ctx.stroke();
 14249 todo_isPixel(ctx, 50,25, 0,0,0,0, 0);
 14253 </script>
 14255 <!-- [[[ test_2d.path.stroke.empty.html ]]] -->
 14257 <p>Canvas test: 2d.path.stroke.empty</p>
 14258 <!-- Testing: Empty subpaths are not stroked -->
 14259 <canvas id="c442" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 14260 <script>
 14263 function test_2d_path_stroke_empty() {
 14265 var canvas = document.getElementById('c442');
 14266 var ctx = canvas.getContext('2d');
 14268 ctx.fillStyle = '#0f0';
 14269 ctx.fillRect(0, 0, 100, 50);
 14271 ctx.strokeStyle = '#f00';
 14272 ctx.lineWidth = 100;
 14273 ctx.lineCap = 'round';
 14274 ctx.lineJoin = 'round';
 14276 ctx.beginPath();
 14277 ctx.moveTo(40, 25);
 14278 ctx.moveTo(60, 25);
 14279 ctx.stroke();
 14281 isPixel(ctx, 50,25, 0,255,0,255, 0);
 14285 </script>
 14287 <!-- [[[ test_2d.path.stroke.overlap.html ]]] -->
 14289 <p>Canvas test: 2d.path.stroke.overlap</p>
 14290 <!-- Testing: Stroked subpaths are combined before being drawn -->
 14291 <canvas id="c443" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 14292 <script>
 14295 function test_2d_path_stroke_overlap() {
 14297 var canvas = document.getElementById('c443');
 14298 var ctx = canvas.getContext('2d');
 14300 ctx.fillStyle = '#000';
 14301 ctx.fillRect(0, 0, 100, 50);
 14303 ctx.strokeStyle = 'rgba(0, 255, 0, 0.5)';
 14304 ctx.lineWidth = 50;
 14305 ctx.moveTo(0, 20);
 14306 ctx.lineTo(100, 20);
 14307 ctx.moveTo(0, 30);
 14308 ctx.lineTo(100, 30);
 14309 ctx.stroke();
 14311 isPixel(ctx, 50,25, 0,127,0,255, 1);
 14315 </script>
 14317 <!-- [[[ test_2d.path.stroke.prune.arc.html ]]] -->
 14319 <p>Canvas test: 2d.path.stroke.prune.arc</p>
 14320 <!-- Testing: Zero-length line segments from arcTo and arc are removed before stroking -->
 14321 <canvas id="c444" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 14322 <script>
 14326 function test_2d_path_stroke_prune_arc() {
 14328 var canvas = document.getElementById('c444');
 14329 var ctx = canvas.getContext('2d');
 14331 ctx.fillStyle = '#0f0';
 14332 ctx.fillRect(0, 0, 100, 50);
 14334 ctx.strokeStyle = '#f00';
 14335 ctx.lineWidth = 100;
 14336 ctx.lineCap = 'round';
 14337 ctx.lineJoin = 'round';
 14339 ctx.beginPath();
 14340 ctx.moveTo(50, 25);
 14341 ctx.arcTo(50, 25, 150, 25, 10);
 14342 ctx.stroke();
 14344 ctx.beginPath();
 14345 ctx.moveTo(50, 25);
 14346 ctx.arc(50, 25, 10, 0, 0, false);
 14347 ctx.stroke();
 14349 todo_isPixel(ctx, 50,25, 0,255,0,255, 0);
 14353 </script>
 14355 <!-- [[[ test_2d.path.stroke.prune.closed.html ]]] -->
 14357 <p>Canvas test: 2d.path.stroke.prune.closed</p>
 14358 <!-- Testing: Zero-length line segments from closed paths are removed before stroking -->
 14359 <canvas id="c445" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 14360 <script>
 14364 function test_2d_path_stroke_prune_closed() {
 14366 var canvas = document.getElementById('c445');
 14367 var ctx = canvas.getContext('2d');
 14369 ctx.fillStyle = '#0f0';
 14370 ctx.fillRect(0, 0, 100, 50);
 14372 ctx.strokeStyle = '#f00';
 14373 ctx.lineWidth = 100;
 14374 ctx.lineCap = 'round';
 14375 ctx.lineJoin = 'round';
 14377 ctx.beginPath();
 14378 ctx.moveTo(50, 25);
 14379 ctx.lineTo(50, 25);
 14380 ctx.closePath();
 14381 ctx.stroke();
 14383 if (IsAzureSkia()) {
 14384   isPixel(ctx, 50,25, 0,255,0,255, 0);
 14385 } else {
 14386   todo_isPixel(ctx, 50,25, 0,255,0,255, 0);
 14390 </script>
 14392 <!-- [[[ test_2d.path.stroke.prune.corner.html ]]] -->
 14394 <p>Canvas test: 2d.path.stroke.prune.corner</p>
 14395 <!-- Testing: Zero-length line segments are removed before stroking with miters -->
 14396 <canvas id="c446" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 14397 <script>
 14400 function test_2d_path_stroke_prune_corner() {
 14402 var canvas = document.getElementById('c446');
 14403 var ctx = canvas.getContext('2d');
 14405 ctx.fillStyle = '#0f0';
 14406 ctx.fillRect(0, 0, 100, 50);
 14408 ctx.strokeStyle = '#f00';
 14409 ctx.lineWidth = 400;
 14410 ctx.lineJoin = 'miter';
 14411 ctx.miterLimit = 1.4;
 14413 ctx.beginPath();
 14414 ctx.moveTo(-1000, 200, 0, 0);
 14415 ctx.lineTo(-100, 200);
 14416 ctx.lineTo(-100, 200);
 14417 ctx.lineTo(-100, 200);
 14418 ctx.lineTo(-100, 1000);
 14419 ctx.stroke();
 14421 isPixel(ctx, 50,25, 0,255,0,255, 0);
 14425 </script>
 14427 <!-- [[[ test_2d.path.stroke.prune.curve.html ]]] -->
 14429 <p>Canvas test: 2d.path.stroke.prune.curve</p>
 14430 <!-- Testing: Zero-length line segments from quadraticCurveTo and bezierCurveTo are removed before stroking -->
 14431 <canvas id="c447" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 14432 <script>
 14436 function test_2d_path_stroke_prune_curve() {
 14438 var canvas = document.getElementById('c447');
 14439 var ctx = canvas.getContext('2d');
 14441 ctx.fillStyle = '#0f0';
 14442 ctx.fillRect(0, 0, 100, 50);
 14444 ctx.strokeStyle = '#f00';
 14445 ctx.lineWidth = 100;
 14446 ctx.lineCap = 'round';
 14447 ctx.lineJoin = 'round';
 14449 ctx.beginPath();
 14450 ctx.moveTo(50, 25);
 14451 ctx.quadraticCurveTo(50, 25, 50, 25);
 14452 ctx.stroke();
 14454 ctx.beginPath();
 14455 ctx.moveTo(50, 25);
 14456 ctx.bezierCurveTo(50, 25, 50, 25, 50, 25);
 14457 ctx.stroke();
 14459 if (IsAzureSkia()) {
 14460   isPixel(ctx, 50,25, 0,255,0,255, 0);
 14461 } else {
 14462   todo_isPixel(ctx, 50,25, 0,255,0,255, 0);
 14467 </script>
 14469 <!-- [[[ test_2d.path.stroke.prune.line.html ]]] -->
 14471 <p>Canvas test: 2d.path.stroke.prune.line</p>
 14472 <!-- Testing: Zero-length line segments from lineTo are removed before stroking -->
 14473 <canvas id="c448" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 14474 <script>
 14478 function test_2d_path_stroke_prune_line() {
 14480 var canvas = document.getElementById('c448');
 14481 var ctx = canvas.getContext('2d');
 14483 ctx.fillStyle = '#0f0';
 14484 ctx.fillRect(0, 0, 100, 50);
 14486 ctx.strokeStyle = '#f00';
 14487 ctx.lineWidth = 100;
 14488 ctx.lineCap = 'round';
 14489 ctx.lineJoin = 'round';
 14491 ctx.beginPath();
 14492 ctx.moveTo(50, 25);
 14493 ctx.lineTo(50, 25);
 14494 ctx.stroke();
 14496 if (IsAzureSkia()) {
 14497   isPixel(ctx, 50,25, 0,255,0,255, 0);
 14498 } else {
 14499   todo_isPixel(ctx, 50,25, 0,255,0,255, 0);
 14503 </script>
 14505 <!-- [[[ test_2d.path.stroke.prune.rect.html ]]] -->
 14507 <p>Canvas test: 2d.path.stroke.prune.rect</p>
 14508 <!-- Testing: Zero-length line segments from rect and strokeRect are removed before stroking -->
 14509 <canvas id="c449" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 14510 <script>
 14514 function test_2d_path_stroke_prune_rect() {
 14516 var canvas = document.getElementById('c449');
 14517 var ctx = canvas.getContext('2d');
 14519 ctx.fillStyle = '#0f0';
 14520 ctx.fillRect(0, 0, 100, 50);
 14522 ctx.strokeStyle = '#f00';
 14523 ctx.lineWidth = 100;
 14524 ctx.lineCap = 'round';
 14525 ctx.lineJoin = 'round';
 14527 ctx.beginPath();
 14528 ctx.rect(50, 25, 0, 0);
 14529 ctx.stroke();
 14531 ctx.strokeRect(50, 25, 0, 0);
 14533 if (IsAzureSkia()) {
 14534   isPixel(ctx, 50,25, 0,255,0,255, 0);
 14535 } else {
 14536   todo_isPixel(ctx, 50,25, 0,255,0,255, 0);
 14540 </script>
 14542 <!-- [[[ test_2d.path.stroke.scale1.html ]]] -->
 14544 <p>Canvas test: 2d.path.stroke.scale1</p>
 14545 <!-- Testing: Stroke line widths are scaled by the current transformation matrix -->
 14546 <canvas id="c450" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 14547 <script>
 14550 function test_2d_path_stroke_scale1() {
 14552 var canvas = document.getElementById('c450');
 14553 var ctx = canvas.getContext('2d');
 14555 ctx.fillStyle = '#f00';
 14556 ctx.fillRect(0, 0, 100, 50);
 14558 ctx.beginPath();
 14559 ctx.rect(25, 12.5, 50, 25);
 14560 ctx.save();
 14561 ctx.scale(50, 25);
 14562 ctx.strokeStyle = '#0f0';
 14563 ctx.stroke();
 14564 ctx.restore();
 14566 ctx.beginPath();
 14567 ctx.rect(-25, -12.5, 150, 75);
 14568 ctx.save();
 14569 ctx.scale(50, 25);
 14570 ctx.strokeStyle = '#f00';
 14571 ctx.stroke();
 14572 ctx.restore();
 14574 isPixel(ctx, 0,0, 0,255,0,255, 0);
 14575 isPixel(ctx, 50,0, 0,255,0,255, 0);
 14576 isPixel(ctx, 99,0, 0,255,0,255, 0);
 14577 isPixel(ctx, 0,25, 0,255,0,255, 0);
 14578 isPixel(ctx, 50,25, 0,255,0,255, 0);
 14579 isPixel(ctx, 99,25, 0,255,0,255, 0);
 14580 isPixel(ctx, 0,49, 0,255,0,255, 0);
 14581 isPixel(ctx, 50,49, 0,255,0,255, 0);
 14582 isPixel(ctx, 99,49, 0,255,0,255, 0);
 14586 </script>
 14588 <!-- [[[ test_2d.path.stroke.scale2.html ]]] -->
 14590 <p>Canvas test: 2d.path.stroke.scale2</p>
 14591 <!-- Testing: Stroke line widths are scaled by the current transformation matrix -->
 14592 <canvas id="c451" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 14593 <script>
 14596 function test_2d_path_stroke_scale2() {
 14598 var canvas = document.getElementById('c451');
 14599 var ctx = canvas.getContext('2d');
 14601 if (!IsD2DEnabled()) {
 14602     // On D2D a rasterization bug causes a small discrepancy here. See bug 587316
 14603     ctx.fillStyle = '#f00';
 14604     ctx.fillRect(0, 0, 100, 50);
 14606     ctx.beginPath();
 14607     ctx.rect(25, 12.5, 50, 25);
 14608     ctx.save();
 14609     ctx.rotate(Math.PI/2);
 14610     ctx.scale(25, 50);
 14611     ctx.strokeStyle = '#0f0';
 14612     ctx.stroke();
 14613     ctx.restore();
 14615     ctx.beginPath();
 14616     ctx.rect(-25, -12.5, 150, 75);
 14617     ctx.save();
 14618     ctx.rotate(Math.PI/2);
 14619     ctx.scale(25, 50);
 14620     ctx.strokeStyle = '#f00';
 14621     ctx.stroke();
 14622     ctx.restore();
 14624     isPixel(ctx, 0,0, 0,255,0,255, 0);
 14625     isPixel(ctx, 50,0, 0,255,0,255, 0);
 14626     isPixel(ctx, 99,0, 0,255,0,255, 0);
 14627     isPixel(ctx, 0,25, 0,255,0,255, 0);
 14628     isPixel(ctx, 50,25, 0,255,0,255, 0);
 14629     isPixel(ctx, 99,25, 0,255,0,255, 0);
 14630     isPixel(ctx, 0,49, 0,255,0,255, 0);
 14631     isPixel(ctx, 50,49, 0,255,0,255, 0);
 14632     isPixel(ctx, 99,49, 0,255,0,255, 0);
 14636 </script>
 14638 <!-- [[[ test_2d.path.stroke.skew.html ]]] -->
 14640 <p>Canvas test: 2d.path.stroke.skew</p>
 14641 <!-- Testing: Strokes lines are skewed by the current transformation matrix -->
 14642 <canvas id="c452" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 14643 <script>
 14646 function test_2d_path_stroke_skew() {
 14648 var canvas = document.getElementById('c452');
 14649 var ctx = canvas.getContext('2d');
 14651 ctx.fillStyle = '#f00';
 14652 ctx.fillRect(0, 0, 100, 50);
 14654 ctx.save();
 14655 ctx.beginPath();
 14656 ctx.moveTo(49, -50);
 14657 ctx.lineTo(201, -50);
 14658 ctx.rotate(Math.PI/4);
 14659 ctx.scale(1, 283);
 14660 ctx.strokeStyle = '#0f0';
 14661 ctx.stroke();
 14662 ctx.restore();
 14664 ctx.save();
 14665 ctx.beginPath();
 14666 ctx.translate(-150, 0);
 14667 ctx.moveTo(49, -50);
 14668 ctx.lineTo(199, -50);
 14669 ctx.rotate(Math.PI/4);
 14670 ctx.scale(1, 142);
 14671 ctx.strokeStyle = '#f00';
 14672 ctx.stroke();
 14673 ctx.restore();
 14675 ctx.save();
 14676 ctx.beginPath();
 14677 ctx.translate(-150, 0);
 14678 ctx.moveTo(49, -50);
 14679 ctx.lineTo(199, -50);
 14680 ctx.rotate(Math.PI/4);
 14681 ctx.scale(1, 142);
 14682 ctx.strokeStyle = '#f00';
 14683 ctx.stroke();
 14684 ctx.restore();
 14686 isPixel(ctx, 0,0, 0,255,0,255, 0);
 14687 isPixel(ctx, 50,0, 0,255,0,255, 0);
 14688 isPixel(ctx, 99,0, 0,255,0,255, 0);
 14689 isPixel(ctx, 0,25, 0,255,0,255, 0);
 14690 isPixel(ctx, 50,25, 0,255,0,255, 0);
 14691 isPixel(ctx, 99,25, 0,255,0,255, 0);
 14692 isPixel(ctx, 0,49, 0,255,0,255, 0);
 14693 isPixel(ctx, 50,49, 0,255,0,255, 0);
 14694 isPixel(ctx, 99,49, 0,255,0,255, 0);
 14697 </script>
 14699 <!-- [[[ test_2d.path.stroke.unaffected.html ]]] -->
 14701 <p>Canvas test: 2d.path.stroke.unaffected</p>
 14702 <!-- Testing: Stroking does not start a new path or subpath -->
 14703 <canvas id="c453" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 14704 <script>
 14707 function test_2d_path_stroke_unaffected() {
 14709 var canvas = document.getElementById('c453');
 14710 var ctx = canvas.getContext('2d');
 14712 ctx.fillStyle = '#f00';
 14713 ctx.fillRect(0, 0, 100, 50);
 14715 ctx.lineWidth = 50;
 14716 ctx.moveTo(-100, 25);
 14717 ctx.lineTo(-100, -100);
 14718 ctx.lineTo(200, -100);
 14719 ctx.lineTo(200, 25);
 14720 ctx.strokeStyle = '#f00';
 14721 ctx.stroke();
 14723 ctx.closePath();
 14724 ctx.strokeStyle = '#0f0';
 14725 ctx.stroke();
 14727 isPixel(ctx, 50,25, 0,255,0,255, 0);
 14731 </script>
 14733 <!-- [[[ test_2d.path.stroke.union.html ]]] -->
 14735 <p>Canvas test: 2d.path.stroke.union</p>
 14736 <!-- Testing: Strokes in opposite directions are unioned, not subtracted -->
 14737 <canvas id="c454" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 14738 <script>
 14741 function test_2d_path_stroke_union() {
 14743 var canvas = document.getElementById('c454');
 14744 var ctx = canvas.getContext('2d');
 14746 ctx.fillStyle = '#f00';
 14747 ctx.fillRect(0, 0, 100, 50);
 14749 ctx.strokeStyle = '#0f0';
 14750 ctx.lineWidth = 40;
 14751 ctx.moveTo(0, 10);
 14752 ctx.lineTo(100, 10);
 14753 ctx.moveTo(100, 40);
 14754 ctx.lineTo(0, 40);
 14755 ctx.stroke();
 14757 isPixel(ctx, 50,25, 0,255,0,255, 0);
 14761 </script>
 14763 <!-- [[[ test_2d.path.transformation.basic.html ]]] -->
 14765 <p>Canvas test: 2d.path.transformation.basic</p>
 14766 <canvas id="c455" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 14767 <script>
 14770 function test_2d_path_transformation_basic() {
 14772 var canvas = document.getElementById('c455');
 14773 var ctx = canvas.getContext('2d');
 14775 ctx.fillStyle = '#f00';
 14776 ctx.fillRect(0, 0, 100, 50);
 14778 ctx.translate(-100, 0);
 14779 ctx.rect(100, 0, 100, 50);
 14780 ctx.translate(0, -100);
 14781 ctx.fillStyle = '#0f0';
 14782 ctx.fill();
 14784 isPixel(ctx, 50,25, 0,255,0,255, 0);
 14788 </script>
 14790 <!-- [[[ test_2d.path.transformation.changing.html ]]] -->
 14792 <p>Canvas test: 2d.path.transformation.changing</p>
 14793 <!-- Testing: Transformations are applied while building paths, not when drawing -->
 14794 <canvas id="c456" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 14795 <script>
 14798 function test_2d_path_transformation_changing() {
 14800 var canvas = document.getElementById('c456');
 14801 var ctx = canvas.getContext('2d');
 14803 ctx.fillStyle = '#f00';
 14804 ctx.fillRect(0, 0, 100, 50);
 14805 ctx.fillStyle = '#0f0';
 14806 ctx.moveTo(0, 0);
 14807 ctx.translate(100, 0);
 14808 ctx.lineTo(0, 0);
 14809 ctx.translate(0, 50);
 14810 ctx.lineTo(0, 0);
 14811 ctx.translate(-100, 0);
 14812 ctx.lineTo(0, 0);
 14813 ctx.translate(1000, 1000);
 14814 ctx.rotate(Math.PI/2);
 14815 ctx.scale(0.1, 0.1);
 14816 ctx.fill();
 14818 isPixel(ctx, 50,25, 0,255,0,255, 0);
 14822 </script>
 14824 <!-- [[[ test_2d.path.transformation.multiple.html ]]] -->
 14826 <p>Canvas test: 2d.path.transformation.multiple</p>
 14827 <canvas id="c457" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 14828 <script>
 14831 function test_2d_path_transformation_multiple() {
 14833 var canvas = document.getElementById('c457');
 14834 var ctx = canvas.getContext('2d');
 14836 ctx.fillStyle = '#f00';
 14837 ctx.fillRect(0, 0, 100, 50);
 14839 ctx.rect(0, 0, 100, 50);
 14840 ctx.fill();
 14841 ctx.translate(-100, 0);
 14842 ctx.fillStyle = '#0f0';
 14843 ctx.fill();
 14845 isPixel(ctx, 50,25, 0,255,0,255, 0);
 14849 </script>
 14851 <!-- [[[ test_2d.pattern.animated.gif.html ]]] -->
 14853 <p>Canvas test: 2d.pattern.animated.gif</p>
 14854 <!-- Testing: createPattern() of an animated GIF draws the first frame -->
 14855 <canvas id="c458" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 14856 <script>
 14858 var canvas458 = document.getElementById('c458');
 14859 var ctx458 = canvas458.getContext('2d');
 14860 var isDone_test_2d_pattern_animated_gif = false;
 14862 function test_2d_pattern_animated_gif() {
 14864 deferTest();
 14865 setTimeout(function () {
 14866     var pattern = ctx458.createPattern(document.getElementById('anim-gr_2.gif'), 'repeat');
 14867     ctx458.fillStyle = pattern;
 14868     ctx458.fillRect(0, 0, 50, 50);
 14869     setTimeout(wrapFunction(function () {
 14870         ctx458.fillRect(50, 0, 50, 50);
 14871         isPixel(ctx458, 25,25, 0,255,0,255, 2);
 14872         isPixel(ctx458, 75,25, 0,255,0,255, 2);
 14873 		isDone_test_2d_pattern_animated_gif = true;
 14874     }), 2500);
 14875 }, 2500);
 14879 </script>
 14880 <img src="image_anim-gr.gif" id="anim-gr_2.gif" class="resource">
 14882 <!-- [[[ test_2d.pattern.basic.canvas.html ]]] -->
 14884 <p>Canvas test: 2d.pattern.basic.canvas</p>
 14885 <canvas id="c459" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 14886 <script>
 14889 function test_2d_pattern_basic_canvas() {
 14891 var canvas = document.getElementById('c459');
 14892 var ctx = canvas.getContext('2d');
 14894 ctx.fillStyle = '#f00';
 14895 ctx.fillRect(0, 0, 100, 50);
 14897 var canvas2 = document.createElement('canvas');
 14898 canvas2.width = 100;
 14899 canvas2.height = 50;
 14900 var ctx2 = canvas2.getContext('2d');
 14901 ctx2.fillStyle = '#0f0';
 14902 ctx2.fillRect(0, 0, 100, 50);
 14904 var pattern = ctx.createPattern(canvas2, 'no-repeat');
 14905 ctx.fillStyle = pattern;
 14906 ctx.fillRect(0, 0, 100, 50);
 14908 isPixel(ctx, 1,1, 0,255,0,255, 0);
 14909 isPixel(ctx, 50,1, 0,255,0,255, 0);
 14910 isPixel(ctx, 98,1, 0,255,0,255, 0);
 14911 isPixel(ctx, 1,25, 0,255,0,255, 0);
 14912 isPixel(ctx, 50,25, 0,255,0,255, 0);
 14913 isPixel(ctx, 98,25, 0,255,0,255, 0);
 14914 isPixel(ctx, 1,48, 0,255,0,255, 0);
 14915 isPixel(ctx, 50,48, 0,255,0,255, 0);
 14916 isPixel(ctx, 98,48, 0,255,0,255, 0);
 14920 </script>
 14922 <!-- [[[ test_2d.pattern.basic.image.html ]]] -->
 14924 <p>Canvas test: 2d.pattern.basic.image</p>
 14925 <canvas id="c460" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 14926 <script>
 14929 function test_2d_pattern_basic_image() {
 14931 var canvas = document.getElementById('c460');
 14932 var ctx = canvas.getContext('2d');
 14934 ctx.fillStyle = '#f00';
 14935 ctx.fillRect(0, 0, 100, 50);
 14936 var img = document.getElementById('green_8.png');
 14937 var pattern = ctx.createPattern(img, 'no-repeat');
 14938 ctx.fillStyle = pattern;
 14939 ctx.fillRect(0, 0, 100, 50);
 14941 isPixel(ctx, 1,1, 0,255,0,255, 0);
 14942 isPixel(ctx, 98,1, 0,255,0,255, 0);
 14943 isPixel(ctx, 1,48, 0,255,0,255, 0);
 14944 isPixel(ctx, 98,48, 0,255,0,255, 0);
 14948 </script>
 14949 <img src="image_green.png" id="green_8.png" class="resource">
 14951 <!-- [[[ test_2d.pattern.basic.nocontext.html ]]] -->
 14953 <p>Canvas test: 2d.pattern.basic.nocontext</p>
 14954 <canvas id="c461" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 14955 <script>
 14958 function test_2d_pattern_basic_nocontext() {
 14960 var canvas = document.getElementById('c461');
 14961 var ctx = canvas.getContext('2d');
 14963 var canvas2 = document.createElement('canvas');
 14964 canvas2.width = 100;
 14965 canvas2.height = 50;
 14966 var pattern = ctx.createPattern(canvas2, 'no-repeat');
 14968 ctx.fillStyle = '#0f0';
 14969 ctx.fillRect(0, 0, 100, 50);
 14970 ctx.fillStyle = pattern;
 14971 ctx.fillRect(0, 0, 100, 50);
 14973 isPixel(ctx, 1,1, 0,255,0,255, 0);
 14974 isPixel(ctx, 98,1, 0,255,0,255, 0);
 14975 isPixel(ctx, 1,48, 0,255,0,255, 0);
 14976 isPixel(ctx, 98,48, 0,255,0,255, 0);
 14980 </script>
 14982 <!-- [[[ test_2d.pattern.basic.type.html ]]] -->
 14984 <p>Canvas test: 2d.pattern.basic.type</p>
 14985 <canvas id="c462" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 14986 <script>
 14988 function test_2d_pattern_basic_type() {
 14990 var canvas = document.getElementById('c462');
 14991 var ctx = canvas.getContext('2d');
 14993 ok(window.CanvasPattern !== undefined, "window.CanvasPattern !== undefined");
 14995 window.CanvasPattern.prototype.thisImplementsCanvasPattern = true;
 14997 var img = document.getElementById('green_9.png');
 14998 var pattern = ctx.createPattern(img, 'no-repeat');
 14999 ok(pattern.thisImplementsCanvasPattern, "pattern.thisImplementsCanvasPattern");
 15003 </script>
 15004 <img src="image_green.png" id="green_9.png" class="resource">
 15006 <!-- [[[ test_2d.pattern.basic.zerocanvas.html ]]] -->
 15008 <p>Canvas test: 2d.pattern.basic.zerocanvas</p>
 15009 <canvas id="c463" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15010 <script>
 15014 function test_2d_pattern_basic_zerocanvas() {
 15016 var canvas = document.getElementById('c463');
 15017 var ctx = canvas.getContext('2d');
 15019 canvas.width = 0;
 15020 canvas.height = 10;
 15021 ok(canvas.width === 0, "canvas.width === 0");
 15022 ok(canvas.height === 10, "canvas.height === 10");
 15023 var _thrown = undefined; try {
 15024   ctx.createPattern(canvas, 'repeat');
 15025 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "InvalidStateError" && _thrown.code == DOMException.INVALID_STATE_ERR, "should throw InvalidStateError");
 15027 canvas.width = 10;
 15028 canvas.height = 0;
 15029 ok(canvas.width === 10, "canvas.width === 10");
 15030 ok(canvas.height === 0, "canvas.height === 0");
 15031 var _thrown = undefined; try {
 15032   ctx.createPattern(canvas, 'repeat');
 15033 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "InvalidStateError" && _thrown.code == DOMException.INVALID_STATE_ERR, "should throw InvalidStateError");
 15035 canvas.width = 0;
 15036 canvas.height = 0;
 15037 ok(canvas.width === 0, "canvas.width === 0");
 15038 ok(canvas.height === 0, "canvas.height === 0");
 15039 var _thrown = undefined; try {
 15040   ctx.createPattern(canvas, 'repeat');
 15041 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "InvalidStateError" && _thrown.code == DOMException.INVALID_STATE_ERR, "should throw InvalidStateError");
 15045 </script>
 15047 <!-- [[[ test_2d.pattern.crosscanvas.html ]]] -->
 15049 <p>Canvas test: 2d.pattern.crosscanvas</p>
 15050 <canvas id="c464" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15051 <script>
 15054 function test_2d_pattern_crosscanvas() {
 15056 var canvas = document.getElementById('c464');
 15057 var ctx = canvas.getContext('2d');
 15059 var img = document.getElementById('green_10.png');
 15061 var pattern = document.createElement('canvas').getContext('2d').createPattern(img, 'no-repeat');
 15062 ctx.fillStyle = '#f00';
 15063 ctx.fillRect(0, 0, 100, 50);
 15064 ctx.fillStyle = pattern;
 15065 ctx.fillRect(0, 0, 100, 50);
 15067 isPixel(ctx, 50,25, 0,255,0,255, 0);
 15071 </script>
 15072 <img src="image_green.png" id="green_10.png" class="resource">
 15074 <!-- [[[ test_2d.pattern.image.broken.html ]]] -->
 15076 <p>Canvas test: 2d.pattern.image.broken</p>
 15077 <canvas id="c465" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15078 <script>
 15080 function test_2d_pattern_image_broken() {
 15082 var canvas = document.getElementById('c465');
 15083 var ctx = canvas.getContext('2d');
 15085 var img = document.getElementById('broken_2.png');
 15086 todo(img.complete === false, "img.complete === false");
 15087 var _thrown = undefined; try {
 15088   ctx.createPattern(img, 'repeat');
 15089 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "InvalidStateError" && _thrown.code == DOMException.INVALID_STATE_ERR, "should throw InvalidStateError");
 15093 </script>
 15094 <img src="image_broken.png" id="broken_2.png" class="resource">
 15096 <!-- [[[ test_2d.pattern.image.incomplete.html ]]] -->
 15098 <p>Canvas test: 2d.pattern.image.incomplete</p>
 15099 <canvas id="c466" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15100 <script>
 15102 function test_2d_pattern_image_incomplete() {
 15104 var canvas = document.getElementById('c466');
 15105 var ctx = canvas.getContext('2d');
 15107 var img = new Image();
 15108 todo(img.complete === false, "img.complete === false");
 15109 var _thrown = undefined; try {
 15110   ctx.createPattern(img, 'repeat');
 15111 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "InvalidStateError" && _thrown.code == DOMException.INVALID_STATE_ERR, "should throw InvalidStateError");
 15115 </script>
 15117 <!-- [[[ test_2d.pattern.image.null.html ]]] -->
 15119 <p>Canvas test: 2d.pattern.image.null</p>
 15120 <canvas id="c467" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15121 <script>
 15123 function test_2d_pattern_image_null() {
 15125 var canvas = document.getElementById('c467');
 15126 var ctx = canvas.getContext('2d');
 15128 var _thrown = undefined; try {
 15129   ctx.createPattern(null, 'repeat');
 15130 } catch (e) { _thrown = e };
 15131 ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
 15133 </script>
 15135 <!-- [[[ test_2d.pattern.image.string.html ]]] -->
 15137 <p>Canvas test: 2d.pattern.image.string</p>
 15138 <canvas id="c468" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15139 <script>
 15141 function test_2d_pattern_image_string() {
 15143 var canvas = document.getElementById('c468');
 15144 var ctx = canvas.getContext('2d');
 15146 var _thrown = undefined; try {
 15147   ctx.createPattern('image_red.png', 'repeat');
 15148 } catch (e) { _thrown = e };
 15149 ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
 15151 </script>
 15153 <!-- [[[ test_2d.pattern.image.undefined.html ]]] -->
 15155 <p>Canvas test: 2d.pattern.image.undefined</p>
 15156 <canvas id="c469" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15157 <script>
 15159 function test_2d_pattern_image_undefined() {
 15161 var canvas = document.getElementById('c469');
 15162 var ctx = canvas.getContext('2d');
 15164 var _thrown = undefined; try {
 15165   ctx.createPattern(undefined, 'repeat');
 15166 } catch (e) { _thrown = e };
 15167 ok(_thrown && _thrown.name == "TypeError", "should throw TypeError");
 15169 </script>
 15171 <!-- [[[ test_2d.pattern.modify.canvas1.html ]]] -->
 15173 <p>Canvas test: 2d.pattern.modify.canvas1</p>
 15174 <canvas id="c470" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15175 <script>
 15178 function test_2d_pattern_modify_canvas1() {
 15180 var canvas = document.getElementById('c470');
 15181 var ctx = canvas.getContext('2d');
 15183 var canvas2 = document.createElement('canvas');
 15184 canvas2.width = 100;
 15185 canvas2.height = 50;
 15186 var ctx2 = canvas2.getContext('2d');
 15187 ctx2.fillStyle = '#0f0';
 15188 ctx2.fillRect(0, 0, 100, 50);
 15190 var pattern = ctx.createPattern(canvas2, 'no-repeat');
 15192 ctx2.fillStyle = '#f00';
 15193 ctx2.fillRect(0, 0, 100, 50);
 15195 ctx.fillStyle = pattern;
 15196 ctx.fillRect(0, 0, 100, 50);
 15198 isPixel(ctx, 1,1, 0,255,0,255, 0);
 15199 isPixel(ctx, 98,1, 0,255,0,255, 0);
 15200 isPixel(ctx, 1,48, 0,255,0,255, 0);
 15201 isPixel(ctx, 98,48, 0,255,0,255, 0);
 15205 </script>
 15207 <!-- [[[ test_2d.pattern.modify.canvas2.html ]]] -->
 15209 <p>Canvas test: 2d.pattern.modify.canvas2</p>
 15210 <canvas id="c471" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15211 <script>
 15214 function test_2d_pattern_modify_canvas2() {
 15216 var canvas = document.getElementById('c471');
 15217 var ctx = canvas.getContext('2d');
 15219 var canvas2 = document.createElement('canvas');
 15220 canvas2.width = 100;
 15221 canvas2.height = 50;
 15222 var ctx2 = canvas2.getContext('2d');
 15223 ctx2.fillStyle = '#0f0';
 15224 ctx2.fillRect(0, 0, 100, 50);
 15226 var pattern = ctx.createPattern(canvas2, 'no-repeat');
 15227 ctx.fillStyle = pattern;
 15228 ctx.fillRect(0, 0, 100, 50);
 15229 ctx.fillStyle = '#f00';
 15230 ctx.fillRect(0, 0, 100, 50);
 15232 ctx2.fillStyle = '#f00';
 15233 ctx2.fillRect(0, 0, 100, 50);
 15235 ctx.fillStyle = pattern;
 15236 ctx.fillRect(0, 0, 100, 50);
 15238 isPixel(ctx, 1,1, 0,255,0,255, 0);
 15239 isPixel(ctx, 98,1, 0,255,0,255, 0);
 15240 isPixel(ctx, 1,48, 0,255,0,255, 0);
 15241 isPixel(ctx, 98,48, 0,255,0,255, 0);
 15245 </script>
 15247 <!-- [[[ test_2d.pattern.modify.image1.html ]]] -->
 15249 <p>Canvas test: 2d.pattern.modify.image1</p>
 15250 <canvas id="c472" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15251 <script>
 15253 var canvas472 = document.getElementById('c472');
 15254 var ctx472 = canvas472.getContext('2d');
 15256 function test_2d_pattern_modify_image1() {
 15258 var img = document.getElementById('green_11.png');
 15259 var pattern = ctx472.createPattern(img, 'no-repeat');
 15260 deferTest();
 15261 img.onload = wrapFunction(function ()
 15263     ctx472.fillStyle = pattern;
 15264     ctx472.fillRect(0, 0, 100, 50);
 15266     isPixel(ctx472, 1,1, 0,255,0,255, 0);
 15267     isPixel(ctx472, 98,1, 0,255,0,255, 0);
 15268     isPixel(ctx472, 1,48, 0,255,0,255, 0);
 15269     isPixel(ctx472, 98,48, 0,255,0,255, 0);
 15270 });
 15271 img.src = 'image_red.png';
 15275 </script>
 15276 <img src="image_green.png" id="green_11.png" class="resource">
 15278 <!-- [[[ test_2d.pattern.modify.image2.html ]]] -->
 15280 <p>Canvas test: 2d.pattern.modify.image2</p>
 15281 <canvas id="c473" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15282 <script>
 15285 var canvas473 = document.getElementById('c473');
 15286 var ctx473 = canvas473.getContext('2d');
 15288 function test_2d_pattern_modify_image2() {
 15290 var img = document.getElementById('green_12.png');
 15291 var pattern = ctx473.createPattern(img, 'no-repeat');
 15292 ctx473.fillStyle = pattern;
 15293 ctx473.fillRect(0, 0, 100, 50);
 15294 ctx473.fillStyle = '#00f';
 15295 ctx473.fillRect(0, 0, 100, 50);
 15296 deferTest();
 15297 img.onload = wrapFunction(function ()
 15299     ctx473.fillStyle = pattern;
 15300     ctx473.fillRect(0, 0, 100, 50);
 15302     isPixel(ctx473, 1,1, 0,255,0,255, 0);
 15303     isPixel(ctx473, 98,1, 0,255,0,255, 0);
 15304     isPixel(ctx473, 1,48, 0,255,0,255, 0);
 15305     isPixel(ctx473, 98,48, 0,255,0,255, 0);
 15306 });
 15307 img.src = 'image_red.png';
 15311 </script>
 15312 <img src="image_green.png" id="green_12.png" class="resource">
 15314 <!-- [[[ test_2d.pattern.paint.norepeat.basic.html ]]] -->
 15316 <p>Canvas test: 2d.pattern.paint.norepeat.basic</p>
 15317 <canvas id="c474" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15318 <script>
 15321 function test_2d_pattern_paint_norepeat_basic() {
 15323 var canvas = document.getElementById('c474');
 15324 var ctx = canvas.getContext('2d');
 15326 ctx.fillStyle = '#f00';
 15327 ctx.fillRect(0, 0, 100, 50);
 15329 var img = document.getElementById('green_13.png');
 15330 var pattern = ctx.createPattern(img, 'no-repeat');
 15331 ctx.fillStyle = pattern;
 15332 ctx.fillRect(0, 0, 100, 50);
 15334 isPixel(ctx, 1,1, 0,255,0,255, 0);
 15335 isPixel(ctx, 98,1, 0,255,0,255, 0);
 15336 isPixel(ctx, 1,48, 0,255,0,255, 0);
 15337 isPixel(ctx, 98,48, 0,255,0,255, 0);
 15341 </script>
 15342 <img src="image_green.png" id="green_13.png" class="resource">
 15344 <!-- [[[ test_2d.pattern.paint.norepeat.coord1.html ]]] -->
 15346 <p>Canvas test: 2d.pattern.paint.norepeat.coord1</p>
 15347 <canvas id="c475" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15348 <script>
 15351 function test_2d_pattern_paint_norepeat_coord1() {
 15353 var canvas = document.getElementById('c475');
 15354 var ctx = canvas.getContext('2d');
 15356 ctx.fillStyle = '#0f0';
 15357 ctx.fillRect(0, 0, 50, 50);
 15358 ctx.fillStyle = '#f00';
 15359 ctx.fillRect(50, 0, 50, 50);
 15361 var img = document.getElementById('green_14.png');
 15362 var pattern = ctx.createPattern(img, 'no-repeat');
 15363 ctx.fillStyle = pattern;
 15364 ctx.translate(50, 0);
 15365 ctx.fillRect(-50, 0, 100, 50);
 15367 isPixel(ctx, 1,1, 0,255,0,255, 0);
 15368 isPixel(ctx, 98,1, 0,255,0,255, 0);
 15369 isPixel(ctx, 1,48, 0,255,0,255, 0);
 15370 isPixel(ctx, 98,48, 0,255,0,255, 0);
 15374 </script>
 15375 <img src="image_green.png" id="green_14.png" class="resource">
 15377 <!-- [[[ test_2d.pattern.paint.norepeat.coord2.html ]]] -->
 15379 <p>Canvas test: 2d.pattern.paint.norepeat.coord2</p>
 15380 <canvas id="c476" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15381 <script>
 15384 function test_2d_pattern_paint_norepeat_coord2() {
 15386 var canvas = document.getElementById('c476');
 15387 var ctx = canvas.getContext('2d');
 15389 var img = document.getElementById('green_15.png');
 15390 var pattern = ctx.createPattern(img, 'no-repeat');
 15391 ctx.fillStyle = pattern;
 15392 ctx.fillRect(0, 0, 50, 50);
 15394 ctx.fillStyle = '#f00';
 15395 ctx.fillRect(50, 0, 50, 50);
 15397 ctx.fillStyle = pattern;
 15398 ctx.translate(50, 0);
 15399 ctx.fillRect(-50, 0, 100, 50);
 15401 isPixel(ctx, 1,1, 0,255,0,255, 0);
 15402 isPixel(ctx, 98,1, 0,255,0,255, 0);
 15403 isPixel(ctx, 1,48, 0,255,0,255, 0);
 15404 isPixel(ctx, 98,48, 0,255,0,255, 0);
 15408 </script>
 15409 <img src="image_green.png" id="green_15.png" class="resource">
 15411 <!-- [[[ test_2d.pattern.paint.norepeat.coord3.html ]]] -->
 15413 <p>Canvas test: 2d.pattern.paint.norepeat.coord3</p>
 15414 <canvas id="c477" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15415 <script>
 15418 function test_2d_pattern_paint_norepeat_coord3() {
 15420 var canvas = document.getElementById('c477');
 15421 var ctx = canvas.getContext('2d');
 15423 ctx.fillStyle = '#0f0';
 15424 ctx.fillRect(0, 0, 100, 50);
 15426 var img = document.getElementById('red_15.png');
 15427 var pattern = ctx.createPattern(img, 'no-repeat');
 15428 ctx.fillStyle = pattern;
 15429 ctx.translate(50, 25);
 15430 ctx.fillRect(-50, -25, 100, 50);
 15432 ctx.fillStyle = '#0f0';
 15433 ctx.fillRect(0, 0, 50, 25);
 15435 isPixel(ctx, 1,1, 0,255,0,255, 0);
 15436 isPixel(ctx, 98,1, 0,255,0,255, 0);
 15437 isPixel(ctx, 1,48, 0,255,0,255, 0);
 15438 isPixel(ctx, 98,48, 0,255,0,255, 0);
 15442 </script>
 15443 <img src="image_red.png" id="red_15.png" class="resource">
 15445 <!-- [[[ test_2d.pattern.paint.norepeat.outside.html ]]] -->
 15447 <p>Canvas test: 2d.pattern.paint.norepeat.outside</p>
 15448 <canvas id="c478" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15449 <script>
 15452 function test_2d_pattern_paint_norepeat_outside() {
 15454 var canvas = document.getElementById('c478');
 15455 var ctx = canvas.getContext('2d');
 15457 ctx.fillStyle = '#f00';
 15458 ctx.fillRect(0, 0, 100, 50);
 15460 var img = document.getElementById('red_16.png');
 15461 var pattern = ctx.createPattern(img, 'no-repeat');
 15462 ctx.fillStyle = '#0f0';
 15463 ctx.fillRect(0, 0, 100, 50);
 15465 ctx.fillStyle = pattern;
 15466 ctx.fillRect(0, -50, 100, 50);
 15467 ctx.fillRect(-100, 0, 100, 50);
 15468 ctx.fillRect(0, 50, 100, 50);
 15469 ctx.fillRect(100, 0, 100, 50);
 15471 isPixel(ctx, 1,1, 0,255,0,255, 0);
 15472 isPixel(ctx, 98,1, 0,255,0,255, 0);
 15473 isPixel(ctx, 1,48, 0,255,0,255, 0);
 15474 isPixel(ctx, 98,48, 0,255,0,255, 0);
 15478 </script>
 15479 <img src="image_red.png" id="red_16.png" class="resource">
 15481 <!-- [[[ test_2d.pattern.paint.orientation.canvas.html ]]] -->
 15483 <p>Canvas test: 2d.pattern.paint.orientation.canvas</p>
 15484 <!-- Testing: Canvas patterns do not get flipped when painted -->
 15485 <canvas id="c479" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15486 <script>
 15489 function test_2d_pattern_paint_orientation_canvas() {
 15491 var canvas = document.getElementById('c479');
 15492 var ctx = canvas.getContext('2d');
 15494 ctx.fillStyle = '#f00';
 15495 ctx.fillRect(0, 0, 100, 50);
 15497 var canvas2 = document.createElement('canvas');
 15498 canvas2.width = 100;
 15499 canvas2.height = 50;
 15500 var ctx2 = canvas2.getContext('2d');
 15501 ctx2.fillStyle = '#f00';
 15502 ctx2.fillRect(0, 0, 100, 25);
 15503 ctx2.fillStyle = '#0f0';
 15504 ctx2.fillRect(0, 25, 100, 25);
 15506 var pattern = ctx.createPattern(canvas2, 'no-repeat');
 15507 ctx.fillStyle = pattern;
 15508 ctx.fillRect(0, 0, 100, 50);
 15509 ctx.fillStyle = '#0f0';
 15510 ctx.fillRect(0, 0, 100, 25);
 15512 isPixel(ctx, 1,1, 0,255,0,255, 0);
 15513 isPixel(ctx, 98,1, 0,255,0,255, 0);
 15514 isPixel(ctx, 1,48, 0,255,0,255, 0);
 15515 isPixel(ctx, 98,48, 0,255,0,255, 0);
 15519 </script>
 15521 <!-- [[[ test_2d.pattern.paint.orientation.image.html ]]] -->
 15523 <p>Canvas test: 2d.pattern.paint.orientation.image</p>
 15524 <!-- Testing: Image patterns do not get flipped when painted -->
 15525 <canvas id="c480" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15526 <script>
 15529 function test_2d_pattern_paint_orientation_image() {
 15531 var canvas = document.getElementById('c480');
 15532 var ctx = canvas.getContext('2d');
 15534 ctx.fillStyle = '#f00';
 15535 ctx.fillRect(0, 0, 100, 50);
 15537 var img = document.getElementById('rrgg-256x256_1.png');
 15538 var pattern = ctx.createPattern(img, 'no-repeat');
 15539 ctx.fillStyle = pattern;
 15540 ctx.save();
 15541 ctx.translate(0, -103);
 15542 ctx.fillRect(0, 103, 100, 50);
 15543 ctx.restore();
 15545 ctx.fillStyle = '#0f0';
 15546 ctx.fillRect(0, 0, 100, 25);
 15548 isPixel(ctx, 1,1, 0,255,0,255, 0);
 15549 isPixel(ctx, 98,1, 0,255,0,255, 0);
 15550 isPixel(ctx, 1,48, 0,255,0,255, 0);
 15551 isPixel(ctx, 98,48, 0,255,0,255, 0);
 15555 </script>
 15556 <img src="image_rrgg-256x256.png" id="rrgg-256x256_1.png" class="resource">
 15558 <!-- [[[ test_2d.pattern.paint.repeat.basic.html ]]] -->
 15560 <p>Canvas test: 2d.pattern.paint.repeat.basic</p>
 15561 <canvas id="c481" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15562 <script>
 15565 function test_2d_pattern_paint_repeat_basic() {
 15567 var canvas = document.getElementById('c481');
 15568 var ctx = canvas.getContext('2d');
 15570 ctx.fillStyle = '#f00';
 15571 ctx.fillRect(0, 0, 100, 50);
 15573 var img = document.getElementById('green-16x16_1.png');
 15574 var pattern = ctx.createPattern(img, 'repeat');
 15575 ctx.fillStyle = pattern;
 15576 ctx.fillRect(0, 0, 100, 50);
 15578 isPixel(ctx, 1,1, 0,255,0,255, 0);
 15579 isPixel(ctx, 98,1, 0,255,0,255, 0);
 15580 isPixel(ctx, 1,48, 0,255,0,255, 0);
 15581 isPixel(ctx, 98,48, 0,255,0,255, 0);
 15585 </script>
 15586 <img src="image_green-16x16.png" id="green-16x16_1.png" class="resource">
 15588 <!-- [[[ test_2d.pattern.paint.repeat.coord1.html ]]] -->
 15590 <p>Canvas test: 2d.pattern.paint.repeat.coord1</p>
 15591 <canvas id="c482" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15592 <script>
 15595 function test_2d_pattern_paint_repeat_coord1() {
 15597 var canvas = document.getElementById('c482');
 15598 var ctx = canvas.getContext('2d');
 15600 ctx.fillStyle = '#f00';
 15601 ctx.fillRect(0, 0, 100, 50);
 15603 var img = document.getElementById('rgrg-256x256_3.png');
 15604 var pattern = ctx.createPattern(img, 'repeat');
 15605 ctx.fillStyle = pattern;
 15606 ctx.translate(-128, -78);
 15607 ctx.fillRect(128, 78, 100, 50);
 15609 isPixel(ctx, 1,1, 0,255,0,255, 0);
 15610 isPixel(ctx, 98,1, 0,255,0,255, 0);
 15611 isPixel(ctx, 1,48, 0,255,0,255, 0);
 15612 isPixel(ctx, 98,48, 0,255,0,255, 0);
 15616 </script>
 15617 <img src="image_rgrg-256x256.png" id="rgrg-256x256_3.png" class="resource">
 15619 <!-- [[[ test_2d.pattern.paint.repeat.coord2.html ]]] -->
 15621 <p>Canvas test: 2d.pattern.paint.repeat.coord2</p>
 15622 <canvas id="c483" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15623 <script>
 15626 function test_2d_pattern_paint_repeat_coord2() {
 15628 var canvas = document.getElementById('c483');
 15629 var ctx = canvas.getContext('2d');
 15631 var img = document.getElementById('ggrr-256x256_3.png');
 15632 var pattern = ctx.createPattern(img, 'repeat');
 15633 ctx.fillStyle = pattern;
 15634 ctx.fillRect(0, 0, 100, 50);
 15636 isPixel(ctx, 1,1, 0,255,0,255, 0);
 15637 isPixel(ctx, 98,1, 0,255,0,255, 0);
 15638 isPixel(ctx, 1,48, 0,255,0,255, 0);
 15639 isPixel(ctx, 98,48, 0,255,0,255, 0);
 15643 </script>
 15644 <img src="image_ggrr-256x256.png" id="ggrr-256x256_3.png" class="resource">
 15646 <!-- [[[ test_2d.pattern.paint.repeat.coord3.html ]]] -->
 15648 <p>Canvas test: 2d.pattern.paint.repeat.coord3</p>
 15649 <canvas id="c484" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15650 <script>
 15654 function test_2d_pattern_paint_repeat_coord3() {
 15656 var canvas = document.getElementById('c484');
 15657 var ctx = canvas.getContext('2d');
 15659 var img = document.getElementById('rgrg-256x256_4.png');
 15660 var pattern = ctx.createPattern(img, 'repeat');
 15661 ctx.fillStyle = pattern;
 15662 ctx.fillRect(0, 0, 100, 50);
 15664 ctx.translate(-128, -78);
 15665 ctx.fillRect(128, 78, 100, 50);
 15667 isPixel(ctx, 1,1, 0,255,0,255, 0);
 15668 isPixel(ctx, 98,1, 0,255,0,255, 0);
 15669 isPixel(ctx, 1,48, 0,255,0,255, 0);
 15670 isPixel(ctx, 98,48, 0,255,0,255, 0);
 15672 </script>
 15673 <img src="image_rgrg-256x256.png" id="rgrg-256x256_4.png" class="resource">
 15675 <!-- [[[ test_2d.pattern.paint.repeat.outside.html ]]] -->
 15677 <p>Canvas test: 2d.pattern.paint.repeat.outside</p>
 15678 <canvas id="c485" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15679 <script>
 15682 function test_2d_pattern_paint_repeat_outside() {
 15684 var canvas = document.getElementById('c485');
 15685 var ctx = canvas.getContext('2d');
 15687 ctx.fillStyle = '#f00';
 15688 ctx.fillRect(0, 0, 100, 50);
 15690 var img = document.getElementById('green-16x16_2.png');
 15691 var pattern = ctx.createPattern(img, 'repeat');
 15692 ctx.fillStyle = pattern;
 15693 ctx.translate(50, 25);
 15694 ctx.fillRect(-50, -25, 100, 50);
 15696 isPixel(ctx, 1,1, 0,255,0,255, 0);
 15697 isPixel(ctx, 98,1, 0,255,0,255, 0);
 15698 isPixel(ctx, 1,48, 0,255,0,255, 0);
 15699 isPixel(ctx, 98,48, 0,255,0,255, 0);
 15703 </script>
 15704 <img src="image_green-16x16.png" id="green-16x16_2.png" class="resource">
 15706 <!-- [[[ test_2d.pattern.paint.repeatx.basic.html ]]] -->
 15708 <p>Canvas test: 2d.pattern.paint.repeatx.basic</p>
 15709 <canvas id="c486" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15710 <script>
 15713 function test_2d_pattern_paint_repeatx_basic() {
 15715 var canvas = document.getElementById('c486');
 15716 var ctx = canvas.getContext('2d');
 15718 ctx.fillStyle = '#0f0';
 15719 ctx.fillRect(0, 0, 100, 50);
 15720 ctx.fillStyle = '#f00';
 15721 ctx.fillRect(0, 0, 100, 16);
 15723 var img = document.getElementById('green-16x16_3.png');
 15724 var pattern = ctx.createPattern(img, 'repeat-x');
 15725 ctx.fillStyle = pattern;
 15726 ctx.fillRect(0, 0, 100, 50);
 15728 isPixel(ctx, 1,1, 0,255,0,255, 0);
 15729 isPixel(ctx, 98,1, 0,255,0,255, 0);
 15730 isPixel(ctx, 1,48, 0,255,0,255, 0);
 15731 isPixel(ctx, 98,48, 0,255,0,255, 0);
 15735 </script>
 15736 <img src="image_green-16x16.png" id="green-16x16_3.png" class="resource">
 15738 <!-- [[[ test_2d.pattern.paint.repeatx.coord1.html ]]] -->
 15740 <p>Canvas test: 2d.pattern.paint.repeatx.coord1</p>
 15741 <canvas id="c487" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15742 <script>
 15746 function test_2d_pattern_paint_repeatx_coord1() {
 15748 var canvas = document.getElementById('c487');
 15749 var ctx = canvas.getContext('2d');
 15751 ctx.fillStyle = '#0f0';
 15752 ctx.fillRect(0, 0, 100, 50);
 15754 var img = document.getElementById('red-16x16_1.png');
 15755 var pattern = ctx.createPattern(img, 'repeat-x');
 15756 ctx.fillStyle = pattern;
 15757 ctx.translate(0, 16);
 15758 ctx.fillRect(0, -16, 100, 50);
 15760 ctx.fillStyle = '#0f0';
 15761 ctx.fillRect(0, 0, 100, 16);
 15763 isPixel(ctx, 1,1, 0,255,0,255, 0);
 15764 isPixel(ctx, 98,1, 0,255,0,255, 0);
 15765 isPixel(ctx, 1,48, 0,255,0,255, 0);
 15766 isPixel(ctx, 98,48, 0,255,0,255, 0);
 15767 isPixel(ctx, 1,25, 0,255,0,255, 0);
 15768 isPixel(ctx, 98,25, 0,255,0,255, 0);
 15770 </script>
 15771 <img src="image_red-16x16.png" id="red-16x16_1.png" class="resource">
 15773 <!-- [[[ test_2d.pattern.paint.repeatx.outside.html ]]] -->
 15775 <p>Canvas test: 2d.pattern.paint.repeatx.outside</p>
 15776 <canvas id="c488" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15777 <script>
 15781 function test_2d_pattern_paint_repeatx_outside() {
 15783 var canvas = document.getElementById('c488');
 15784 var ctx = canvas.getContext('2d');
 15786 ctx.fillStyle = '#0f0';
 15787 ctx.fillRect(0, 0, 100, 50);
 15789 var img = document.getElementById('red-16x16_2.png');
 15790 var pattern = ctx.createPattern(img, 'repeat-x');
 15791 ctx.fillStyle = pattern;
 15792 ctx.fillRect(0, 0, 100, 50);
 15794 ctx.fillStyle = '#0f0';
 15795 ctx.fillRect(0, 0, 100, 16);
 15797 isPixel(ctx, 1,1, 0,255,0,255, 0);
 15798 isPixel(ctx, 98,1, 0,255,0,255, 0);
 15799 isPixel(ctx, 1,48, 0,255,0,255, 0);
 15800 isPixel(ctx, 98,48, 0,255,0,255, 0);
 15802 </script>
 15803 <img src="image_red-16x16.png" id="red-16x16_2.png" class="resource">
 15805 <!-- [[[ test_2d.pattern.paint.repeaty.basic.html ]]] -->
 15807 <p>Canvas test: 2d.pattern.paint.repeaty.basic</p>
 15808 <canvas id="c489" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15809 <script>
 15812 function test_2d_pattern_paint_repeaty_basic() {
 15814 var canvas = document.getElementById('c489');
 15815 var ctx = canvas.getContext('2d');
 15817 ctx.fillStyle = '#0f0';
 15818 ctx.fillRect(0, 0, 100, 50);
 15819 ctx.fillStyle = '#f00';
 15820 ctx.fillRect(0, 0, 16, 50);
 15822 var img = document.getElementById('green-16x16_4.png');
 15823 var pattern = ctx.createPattern(img, 'repeat-y');
 15824 ctx.fillStyle = pattern;
 15825 ctx.fillRect(0, 0, 100, 50);
 15827 isPixel(ctx, 1,1, 0,255,0,255, 0);
 15828 isPixel(ctx, 98,1, 0,255,0,255, 0);
 15829 isPixel(ctx, 1,48, 0,255,0,255, 0);
 15830 isPixel(ctx, 98,48, 0,255,0,255, 0);
 15834 </script>
 15835 <img src="image_green-16x16.png" id="green-16x16_4.png" class="resource">
 15837 <!-- [[[ test_2d.pattern.paint.repeaty.coord1.html ]]] -->
 15839 <p>Canvas test: 2d.pattern.paint.repeaty.coord1</p>
 15840 <canvas id="c490" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15841 <script>
 15845 function test_2d_pattern_paint_repeaty_coord1() {
 15847 var canvas = document.getElementById('c490');
 15848 var ctx = canvas.getContext('2d');
 15850 ctx.fillStyle = '#0f0';
 15851 ctx.fillRect(0, 0, 100, 50);
 15853 var img = document.getElementById('red-16x16_3.png');
 15854 var pattern = ctx.createPattern(img, 'repeat-y');
 15855 ctx.fillStyle = pattern;
 15856 ctx.translate(48, 0);
 15857 ctx.fillRect(-48, 0, 100, 50);
 15859 ctx.fillStyle = '#0f0';
 15860 ctx.fillRect(0, 0, 16, 50);
 15862 isPixel(ctx, 50,1, 0,255,0,255, 0);
 15863 isPixel(ctx, 50,48, 0,255,0,255, 0);
 15865 isPixel(ctx, 1,1, 0,255,0,255, 0);
 15866 isPixel(ctx, 98,1, 0,255,0,255, 0);
 15867 isPixel(ctx, 1,48, 0,255,0,255, 0);
 15868 isPixel(ctx, 98,48, 0,255,0,255, 0);
 15870 </script>
 15871 <img src="image_red-16x16.png" id="red-16x16_3.png" class="resource">
 15873 <!-- [[[ test_2d.pattern.paint.repeaty.outside.html ]]] -->
 15875 <p>Canvas test: 2d.pattern.paint.repeaty.outside</p>
 15876 <canvas id="c491" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15877 <script>
 15881 function test_2d_pattern_paint_repeaty_outside() {
 15883 var canvas = document.getElementById('c491');
 15884 var ctx = canvas.getContext('2d');
 15886 ctx.fillStyle = '#0f0';
 15887 ctx.fillRect(0, 0, 100, 50);
 15889 var img = document.getElementById('red-16x16_4.png');
 15890 var pattern = ctx.createPattern(img, 'repeat-y');
 15891 ctx.fillStyle = pattern;
 15892 ctx.fillRect(0, 0, 100, 50);
 15894 ctx.fillStyle = '#0f0';
 15895 ctx.fillRect(0, 0, 16, 50);
 15897 isPixel(ctx, 1,1, 0,255,0,255, 0);
 15898 isPixel(ctx, 1,48, 0,255,0,255, 0);
 15899 isPixel(ctx, 98,1, 0,255,0,255, 0);
 15900 isPixel(ctx, 98,48, 0,255,0,255, 0);
 15902 </script>
 15903 <img src="image_red-16x16.png" id="red-16x16_4.png" class="resource">
 15905 <!-- [[[ test_2d.pattern.repeat.case.html ]]] -->
 15907 <p>Canvas test: 2d.pattern.repeat.case</p>
 15908 <canvas id="c492" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15909 <script>
 15911 function test_2d_pattern_repeat_case() {
 15913 var canvas = document.getElementById('c492');
 15914 var ctx = canvas.getContext('2d');
 15916 var _thrown = undefined; try {
 15917   ctx.createPattern(canvas, "Repeat");
 15918 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "SyntaxError" && _thrown.code == DOMException.SYNTAX_ERR, "should throw SyntaxError");
 15922 </script>
 15924 <!-- [[[ test_2d.pattern.repeat.empty.html ]]] -->
 15926 <p>Canvas test: 2d.pattern.repeat.empty</p>
 15927 <canvas id="c493" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15928 <script>
 15931 function test_2d_pattern_repeat_empty() {
 15933 var canvas = document.getElementById('c493');
 15934 var ctx = canvas.getContext('2d');
 15936 ctx.fillStyle = '#f00';
 15937 ctx.fillRect(0, 0, 100, 50);
 15938 var img = document.getElementById('green-1x1_1.png');
 15939 var pattern = ctx.createPattern(img, "");
 15940 ctx.fillStyle = pattern;
 15941 ctx.fillRect(0, 0, 200, 50);
 15943 isPixel(ctx, 1,1, 0,255,0,255, 0);
 15944 isPixel(ctx, 98,1, 0,255,0,255, 0);
 15945 isPixel(ctx, 1,48, 0,255,0,255, 0);
 15946 isPixel(ctx, 98,48, 0,255,0,255, 0);
 15950 </script>
 15951 <img src="image_green-1x1.png" id="green-1x1_1.png" class="resource">
 15953 <!-- [[[ test_2d.pattern.repeat.null.html ]]] -->
 15955 <p>Canvas test: 2d.pattern.repeat.null</p>
 15956 <canvas id="c494" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15957 <script>
 15960 function test_2d_pattern_repeat_null() {
 15962 var canvas = document.getElementById('c494');
 15963 var ctx = canvas.getContext('2d');
 15965 ctx.fillStyle = '#f00';
 15966 ctx.fillRect(0, 0, 100, 50);
 15967 var img = document.getElementById('green-1x1_2.png');
 15968 var pattern = ctx.createPattern(img, null);
 15969 ctx.fillStyle = pattern;
 15970 ctx.fillRect(0, 0, 100, 50);
 15972 isPixel(ctx, 1,1, 0,255,0,255, 0);
 15973 isPixel(ctx, 98,1, 0,255,0,255, 0);
 15974 isPixel(ctx, 1,48, 0,255,0,255, 0);
 15975 isPixel(ctx, 98,48, 0,255,0,255, 0);
 15979 </script>
 15980 <img src="image_green-1x1.png" id="green-1x1_2.png" class="resource">
 15982 <!-- [[[ test_2d.pattern.repeat.nullsuffix.html ]]] -->
 15984 <p>Canvas test: 2d.pattern.repeat.nullsuffix</p>
 15985 <canvas id="c495" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 15986 <script>
 15988 function test_2d_pattern_repeat_nullsuffix() {
 15990 var canvas = document.getElementById('c495');
 15991 var ctx = canvas.getContext('2d');
 15993 var _thrown = undefined; try {
 15994   ctx.createPattern(canvas, "repeat\0");
 15995 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "SyntaxError" && _thrown.code == DOMException.SYNTAX_ERR, "should throw SyntaxError");
 15999 </script>
 16001 <!-- [[[ test_2d.pattern.repeat.undefined.html ]]] -->
 16003 <p>Canvas test: 2d.pattern.repeat.undefined</p>
 16004 <canvas id="c496" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16005 <script>
 16007 function test_2d_pattern_repeat_undefined() {
 16009 var canvas = document.getElementById('c496');
 16010 var ctx = canvas.getContext('2d');
 16012 var _thrown = undefined; try {
 16013   ctx.createPattern(canvas, undefined);
 16014 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "SyntaxError" && _thrown.code == DOMException.SYNTAX_ERR, "should throw SyntaxError");
 16018 </script>
 16020 <!-- [[[ test_2d.pattern.repeat.unrecognised.html ]]] -->
 16022 <p>Canvas test: 2d.pattern.repeat.unrecognised</p>
 16023 <canvas id="c497" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16024 <script>
 16026 function test_2d_pattern_repeat_unrecognised() {
 16028 var canvas = document.getElementById('c497');
 16029 var ctx = canvas.getContext('2d');
 16031 var _thrown = undefined; try {
 16032   ctx.createPattern(canvas, "invalid");
 16033 } catch (e) { _thrown = e }; ok(_thrown && _thrown.name == "SyntaxError" && _thrown.code == DOMException.SYNTAX_ERR, "should throw SyntaxError");
 16037 </script>
 16039 <!-- [[[ test_2d.scaled.html ]]] -->
 16041 <p>Canvas test: 2d.scaled</p>
 16042 <!-- Testing: CSS-scaled canvases get drawn correctly -->
 16043 <canvas id="c498" width="50" height="25" style="width: 100px; height: 50px"><p class="fallback">FAIL (fallback content)</p></canvas>
 16044 <script>
 16046 function test_2d_scaled() {
 16048 var canvas = document.getElementById('c498');
 16049 var ctx = canvas.getContext('2d');
 16051 ctx.fillStyle = '#00f';
 16052 ctx.fillRect(0, 0, 50, 25);
 16053 ctx.fillStyle = '#0ff';
 16054 ctx.fillRect(0, 0, 25, 10);
 16056 todo(false, "test completed successfully"); // (Bug 483989)
 16060 </script>
 16061 <!-- [[[ test_2d.shadow.alpha.1.html ]]] -->
 16063 <p>Canvas test: 2d.shadow.alpha.1</p>
 16064 <canvas id="c499" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16065 <script>
 16068 function test_2d_shadow_alpha_1() {
 16070 var canvas = document.getElementById('c499');
 16071 var ctx = canvas.getContext('2d');
 16073 ctx.fillStyle = '#0f0';
 16074 ctx.fillRect(0, 0, 100, 50);
 16075 ctx.shadowColor = 'rgba(255, 0, 0, 0.01)';
 16076 ctx.shadowOffsetY = 50;
 16077 ctx.fillRect(0, -50, 100, 50);
 16079 isPixel(ctx, 50,25, 0,255,0,255, 4);
 16083 </script>
 16085 <!-- [[[ test_2d.shadow.alpha.2.html ]]] -->
 16087 <p>Canvas test: 2d.shadow.alpha.2</p>
 16088 <canvas id="c500" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16089 <script>
 16093 function test_2d_shadow_alpha_2() {
 16095 var canvas = document.getElementById('c500');
 16096 var ctx = canvas.getContext('2d');
 16098 ctx.fillStyle = '#f00';
 16099 ctx.fillRect(0, 0, 100, 50);
 16100 ctx.shadowColor = 'rgba(0, 0, 255, 0.5)';
 16101 ctx.shadowOffsetY = 50;
 16102 ctx.fillRect(0, -50, 100, 50);
 16104 isPixel(ctx, 50,25, 127,0,127,255, 2);
 16108 </script>
 16110 <!-- [[[ test_2d.shadow.alpha.3.html ]]] -->
 16112 <p>Canvas test: 2d.shadow.alpha.3</p>
 16113 <canvas id="c501" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16114 <script>
 16118 function test_2d_shadow_alpha_3() {
 16120 var canvas = document.getElementById('c501');
 16121 var ctx = canvas.getContext('2d');
 16123 ctx.fillStyle = '#f00';
 16124 ctx.fillRect(0, 0, 100, 50);
 16125 ctx.fillStyle = '#f00'; // (work around broken Firefox globalAlpha caching)
 16126 ctx.shadowColor = '#00f';
 16127 ctx.shadowOffsetY = 50;
 16128 ctx.globalAlpha = 0.5;
 16129 ctx.fillRect(0, -50, 100, 50);
 16131 isPixel(ctx, 50,25, 127,0,127,255, 2);
 16135 </script>
 16137 <!-- [[[ test_2d.shadow.alpha.4.html ]]] -->
 16139 <p>Canvas test: 2d.shadow.alpha.4</p>
 16140 <canvas id="c502" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16141 <script>
 16145 function test_2d_shadow_alpha_4() {
 16147 var canvas = document.getElementById('c502');
 16148 var ctx = canvas.getContext('2d');
 16150 ctx.fillStyle = '#f00';
 16151 ctx.fillRect(0, 0, 100, 50);
 16152 ctx.fillStyle = '#f00'; // (work around broken Firefox globalAlpha caching)
 16153 ctx.shadowColor = 'rgba(0, 0, 255, 0.707)';
 16154 ctx.shadowOffsetY = 50;
 16155 ctx.globalAlpha = 0.707;
 16156 ctx.fillRect(0, -50, 100, 50);
 16158 isPixel(ctx, 50,25, 127,0,127,255, 2);
 16162 </script>
 16164 <!-- [[[ test_2d.shadow.alpha.5.html ]]] -->
 16166 <p>Canvas test: 2d.shadow.alpha.5</p>
 16167 <canvas id="c503" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16168 <script>
 16172 function test_2d_shadow_alpha_5() {
 16174 var canvas = document.getElementById('c503');
 16175 var ctx = canvas.getContext('2d');
 16177 ctx.fillStyle = '#f00';
 16178 ctx.fillRect(0, 0, 100, 50);
 16179 ctx.fillStyle = 'rgba(64, 0, 0, 0.5)';
 16180 ctx.shadowColor = '#00f';
 16181 ctx.shadowOffsetY = 50;
 16182 ctx.fillRect(0, -50, 100, 50);
 16184 isPixel(ctx, 50,25, 127,0,127,255, 2);
 16188 </script>
 16190 <!-- [[[ test_2d.shadow.attributes.shadowBlur.1.html ]]] -->
 16192 <p>Canvas test: 2d.shadow.attributes.shadowBlur.1</p>
 16193 <canvas id="c504" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16194 <script>
 16196 function test_2d_shadow_attributes_shadowBlur_1() {
 16198 var canvas = document.getElementById('c504');
 16199 var ctx = canvas.getContext('2d');
 16201 ctx.shadowBlur = 1;
 16202 ok(ctx.shadowBlur === 1, "ctx.shadowBlur === 1");
 16203 ctx.shadowBlur = 0.5;
 16204 ok(ctx.shadowBlur === 0.5, "ctx.shadowBlur === 0.5");
 16205 ctx.shadowBlur = 1e6;
 16206 ok(ctx.shadowBlur === 1e6, "ctx.shadowBlur === 1e6");
 16207 ctx.shadowBlur = 1;
 16208 ctx.shadowBlur = -2;
 16209 ok(ctx.shadowBlur === 1, "ctx.shadowBlur === 1");
 16210 ctx.shadowBlur = 0;
 16211 ok(ctx.shadowBlur === 0, "ctx.shadowBlur === 0");
 16215 </script>
 16217 <!-- [[[ test_2d.shadow.attributes.shadowBlur.2.html ]]] -->
 16219 <p>Canvas test: 2d.shadow.attributes.shadowBlur.2</p>
 16220 <canvas id="c505" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16221 <script>
 16223 function test_2d_shadow_attributes_shadowBlur_2() {
 16225 var canvas = document.getElementById('c505');
 16226 var ctx = canvas.getContext('2d');
 16228 ctx.shadowBlur = 1;
 16229 ctx.shadowBlur = -2;
 16230 ok(ctx.shadowBlur === 1, "ctx.shadowBlur === 1");
 16232 ctx.shadowBlur = 1;
 16233 ctx.shadowBlur = Infinity;
 16234 ok(ctx.shadowBlur === 1, "ctx.shadowBlur === 1");
 16236 ctx.shadowBlur = 1;
 16237 ctx.shadowBlur = -Infinity;
 16238 ok(ctx.shadowBlur === 1, "ctx.shadowBlur === 1");
 16240 ctx.shadowBlur = 1;
 16241 ctx.shadowBlur = NaN;
 16242 ok(ctx.shadowBlur === 1, "ctx.shadowBlur === 1");
 16245 </script>
 16247 <!-- [[[ test_2d.shadow.attributes.shadowColor.1.html ]]] -->
 16249 <p>Canvas test: 2d.shadow.attributes.shadowColor.1</p>
 16250 <canvas id="c506" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16251 <script>
 16253 function test_2d_shadow_attributes_shadowColor_1() {
 16255 var canvas = document.getElementById('c506');
 16256 var ctx = canvas.getContext('2d');
 16258 ctx.shadowColor = 'lime';
 16259 ok(ctx.shadowColor === '#00ff00', "ctx.shadowColor === '#00ff00'");
 16260 ctx.shadowColor = 'RGBA(0,255, 0,0)';
 16261 is(ctx.shadowColor, 'rgba(0, 255, 0, 0)', "ctx.shadowColor should be what we set it to");
 16265 </script>
 16267 <!-- [[[ test_2d.shadow.attributes.shadowColor.2.html ]]] -->
 16269 <p>Canvas test: 2d.shadow.attributes.shadowColor.2</p>
 16270 <canvas id="c507" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16271 <script>
 16273 function test_2d_shadow_attributes_shadowColor_2() {
 16275 var canvas = document.getElementById('c507');
 16276 var ctx = canvas.getContext('2d');
 16278 ctx.shadowColor = '#00ff00';
 16279 ctx.shadowColor = 'bogus';
 16280 ok(ctx.shadowColor === '#00ff00', "ctx.shadowColor === '#00ff00'");
 16281 ctx.shadowColor = ctx;
 16282 ok(ctx.shadowColor === '#00ff00', "ctx.shadowColor === '#00ff00'");
 16283 ctx.shadowColor = undefined;
 16284 ok(ctx.shadowColor === '#00ff00', "ctx.shadowColor === '#00ff00'");
 16288 </script>
 16290 <!-- [[[ test_2d.shadow.attributes.shadowOffset.1.html ]]] -->
 16292 <p>Canvas test: 2d.shadow.attributes.shadowOffset.1</p>
 16293 <canvas id="c508" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16294 <script>
 16296 function test_2d_shadow_attributes_shadowOffset_1() {
 16298 var canvas = document.getElementById('c508');
 16299 var ctx = canvas.getContext('2d');
 16301 ctx.shadowOffsetX = 1;
 16302 ctx.shadowOffsetY = 2;
 16303 ok(ctx.shadowOffsetX === 1, "ctx.shadowOffsetX === 1");
 16304 ok(ctx.shadowOffsetY === 2, "ctx.shadowOffsetY === 2");
 16305 ctx.shadowOffsetX = 0.5;
 16306 ctx.shadowOffsetY = 0.25;
 16307 ok(ctx.shadowOffsetX === 0.5, "ctx.shadowOffsetX === 0.5");
 16308 ok(ctx.shadowOffsetY === 0.25, "ctx.shadowOffsetY === 0.25");
 16309 ctx.shadowOffsetX = -0.5;
 16310 ctx.shadowOffsetY = -0.25;
 16311 ok(ctx.shadowOffsetX === -0.5, "ctx.shadowOffsetX === -0.5");
 16312 ok(ctx.shadowOffsetY === -0.25, "ctx.shadowOffsetY === -0.25");
 16313 ctx.shadowOffsetX = 1e6;
 16314 ctx.shadowOffsetY = 1e6;
 16315 ok(ctx.shadowOffsetX === 1e6, "ctx.shadowOffsetX === 1e6");
 16316 ok(ctx.shadowOffsetY === 1e6, "ctx.shadowOffsetY === 1e6");
 16320 </script>
 16322 <!-- [[[ test_2d.shadow.attributes.shadowOffset.2.html ]]] -->
 16324 <p>Canvas test: 2d.shadow.attributes.shadowOffset.2</p>
 16325 <canvas id="c509" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16326 <script>
 16328 function test_2d_shadow_attributes_shadowOffset_2() {
 16330 var canvas = document.getElementById('c509');
 16331 var ctx = canvas.getContext('2d');
 16333 ctx.shadowOffsetX = 1;
 16334 ctx.shadowOffsetY = 2;
 16335 ctx.shadowOffsetX = Infinity;
 16336 ctx.shadowOffsetY = Infinity;
 16337 ok(ctx.shadowOffsetX === 1, "ctx.shadowOffsetX === 1");
 16338 ok(ctx.shadowOffsetY === 2, "ctx.shadowOffsetY === 2");
 16340 ctx.shadowOffsetX = 1;
 16341 ctx.shadowOffsetY = 2;
 16342 ctx.shadowOffsetX = -Infinity;
 16343 ctx.shadowOffsetY = -Infinity;
 16344 ok(ctx.shadowOffsetX === 1, "ctx.shadowOffsetX === 1");
 16345 ok(ctx.shadowOffsetY === 2, "ctx.shadowOffsetY === 2");
 16347 ctx.shadowOffsetX = 1;
 16348 ctx.shadowOffsetY = 2;
 16349 ctx.shadowOffsetX = NaN;
 16350 ctx.shadowOffsetY = NaN;
 16351 ok(ctx.shadowOffsetX === 1, "ctx.shadowOffsetX === 1");
 16352 ok(ctx.shadowOffsetY === 2, "ctx.shadowOffsetY === 2");
 16355 </script>
 16357 <!-- [[[ test_2d.shadow.basic.1.html ]]] -->
 16359 <p>Canvas test: 2d.shadow.basic.1</p>
 16360 <canvas id="c510" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16361 <script>
 16364 function test_2d_shadow_basic_1() {
 16366 var canvas = document.getElementById('c510');
 16367 var ctx = canvas.getContext('2d');
 16369 ctx.shadowColor = '#f00';
 16370 ctx.fillStyle = '#0f0';
 16371 ctx.fillRect(0, 0, 100, 50);
 16372 isPixel(ctx, 50,25, 0,255,0,255, 0);
 16376 </script>
 16378 <!-- [[[ test_2d.shadow.basic.2.html ]]] -->
 16380 <p>Canvas test: 2d.shadow.basic.2</p>
 16381 <canvas id="c511" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16382 <script>
 16385 function test_2d_shadow_basic_2() {
 16387 var canvas = document.getElementById('c511');
 16388 var ctx = canvas.getContext('2d');
 16390 ctx.fillStyle = '#0f0';
 16391 ctx.fillRect(0, 0, 100, 50);
 16392 ctx.fillStyle = '#f00';
 16393 ctx.shadowColor = '#f00';
 16394 ctx.fillRect(0, -50, 100, 50);
 16395 isPixel(ctx, 50,25, 0,255,0,255, 0);
 16399 </script>
 16401 <!-- [[[ test_2d.shadow.blur.high.html ]]] -->
 16403 <p>Canvas test: 2d.shadow.blur.high</p>
 16404 <canvas id="c512" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16405 <script>
 16407 function test_2d_shadow_blur_high() {
 16409 var canvas = document.getElementById('c512');
 16410 var ctx = canvas.getContext('2d');
 16412 ctx.fillStyle = '#ff0';
 16413 ctx.fillRect(0, 0, 100, 50);
 16414 ctx.shadowColor = '#00f';
 16415 ctx.shadowOffsetY = 0;
 16416 ctx.shadowBlur = 555.6;
 16417 ctx.fillRect(-200, -200, 200, 400);
 16419 todo(false, "test completed successfully"); // (Bug 483989)
 16423 </script>
 16424 <!-- [[[ test_2d.shadow.blur.low.html ]]] -->
 16426 <p>Canvas test: 2d.shadow.blur.low</p>
 16427 <canvas id="c513" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16428 <script>
 16430 function test_2d_shadow_blur_low() {
 16432 var canvas = document.getElementById('c513');
 16433 var ctx = canvas.getContext('2d');
 16435 ctx.fillStyle = '#ff0';
 16436 ctx.fillRect(0, 0, 100, 50);
 16437 ctx.shadowColor = '#00f';
 16438 ctx.shadowOffsetY = 25;
 16439 for (var x = 0; x < 100; ++x) {
 16440     ctx.save();
 16441     ctx.beginPath();
 16442     ctx.rect(x, 0, 1, 50);
 16443     ctx.clip();
 16444     ctx.shadowBlur = x;
 16445     ctx.fillRect(-200, -200, 500, 200);
 16446     ctx.restore();
 16449 todo(false, "test completed successfully"); // (Bug 483989)
 16452 </script>
 16453 <!-- [[[ test_2d.shadow.canvas.alpha.html ]]] -->
 16455 <p>Canvas test: 2d.shadow.canvas.alpha</p>
 16456 <canvas id="c514" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16457 <script>
 16461 function test_2d_shadow_canvas_alpha() {
 16463 var canvas = document.getElementById('c514');
 16464 var ctx = canvas.getContext('2d');
 16466 var canvas2 = document.createElement('canvas');
 16467 canvas2.width = 100;
 16468 canvas2.height = 50;
 16469 var ctx2 = canvas2.getContext('2d');
 16470 ctx2.fillStyle = 'rgba(255, 0, 0, 0.5)';
 16471 ctx2.fillRect(0, 0, 100, 50);
 16473 ctx.fillStyle = '#f00';
 16474 ctx.fillRect(0, 0, 100, 50);
 16475 ctx.shadowOffsetY = 50;
 16476 ctx.shadowColor = '#00f';
 16477 ctx.drawImage(canvas2, 0, -50);
 16479 isPixel(ctx, 50,25, 127,0,127,255, 2);
 16483 </script>
 16484 <img src="image_transparent50.png" id="transparent50_1.png" class="resource">
 16486 <!-- [[[ test_2d.shadow.canvas.basic.html ]]] -->
 16488 <p>Canvas test: 2d.shadow.canvas.basic</p>
 16489 <canvas id="c515" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16490 <script>
 16494 function test_2d_shadow_canvas_basic() {
 16496 var canvas = document.getElementById('c515');
 16497 var ctx = canvas.getContext('2d');
 16499 var canvas2 = document.createElement('canvas');
 16500 canvas2.width = 100;
 16501 canvas2.height = 50;
 16502 var ctx2 = canvas2.getContext('2d');
 16503 ctx2.fillStyle = '#f00';
 16504 ctx2.fillRect(0, 0, 100, 50);
 16506 ctx.fillStyle = '#f00';
 16507 ctx.fillRect(0, 0, 100, 50);
 16508 ctx.shadowColor = '#0f0';
 16509 ctx.shadowOffsetY = 50;
 16510 ctx.drawImage(canvas2, 0, -50);
 16512 isPixel(ctx, 50,25, 0,255,0,255, 0);
 16516 </script>
 16518 <!-- [[[ test_2d.shadow.canvas.transparent.1.html ]]] -->
 16520 <p>Canvas test: 2d.shadow.canvas.transparent.1</p>
 16521 <canvas id="c516" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16522 <script>
 16525 function test_2d_shadow_canvas_transparent_1() {
 16527 var canvas = document.getElementById('c516');
 16528 var ctx = canvas.getContext('2d');
 16530 var canvas2 = document.createElement('canvas');
 16531 canvas2.width = 100;
 16532 canvas2.height = 50;
 16533 var ctx2 = canvas2.getContext('2d');
 16535 ctx.fillStyle = '#0f0';
 16536 ctx.fillRect(0, 0, 100, 50);
 16537 ctx.shadowColor = '#f00';
 16538 ctx.shadowOffsetY = 50;
 16539 ctx.drawImage(canvas2, 0, -50);
 16541 isPixel(ctx, 50,25, 0,255,0,255, 0);
 16545 </script>
 16547 <!-- [[[ test_2d.shadow.canvas.transparent.2.html ]]] -->
 16549 <p>Canvas test: 2d.shadow.canvas.transparent.2</p>
 16550 <canvas id="c517" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16551 <script>
 16555 function test_2d_shadow_canvas_transparent_2() {
 16557 var canvas = document.getElementById('c517');
 16558 var ctx = canvas.getContext('2d');
 16560 var canvas2 = document.createElement('canvas');
 16561 canvas2.width = 100;
 16562 canvas2.height = 50;
 16563 var ctx2 = canvas2.getContext('2d');
 16564 ctx2.fillStyle = '#f00';
 16565 ctx2.fillRect(0, 0, 50, 50);
 16567 ctx.fillStyle = '#0f0';
 16568 ctx.fillRect(0, 0, 50, 50);
 16569 ctx.fillStyle = '#f00';
 16570 ctx.fillRect(50, 0, 50, 50);
 16571 ctx.shadowOffsetY = 50;
 16572 ctx.shadowColor = '#0f0';
 16573 ctx.drawImage(canvas2, 50, -50);
 16574 ctx.shadowColor = '#f00';
 16575 ctx.drawImage(canvas2, -50, -50);
 16577 isPixel(ctx, 25,25, 0,255,0,255, 0);
 16578 isPixel(ctx, 50,25, 0,255,0,255, 0);
 16579 isPixel(ctx, 75,25, 0,255,0,255, 0);
 16583 </script>
 16585 <!-- [[[ test_2d.shadow.clip.1.html ]]] -->
 16587 <p>Canvas test: 2d.shadow.clip.1</p>
 16588 <canvas id="c518" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16589 <script>
 16593 function test_2d_shadow_clip_1() {
 16595 var canvas = document.getElementById('c518');
 16596 var ctx = canvas.getContext('2d');
 16598 ctx.fillStyle = '#0f0';
 16599 ctx.fillRect(0, 0, 50, 50);
 16600 ctx.fillStyle = '#f00';
 16601 ctx.fillRect(50, 0, 50, 50);
 16603 ctx.save();
 16604 ctx.beginPath();
 16605 ctx.rect(50, 0, 50, 50);
 16606 ctx.clip();
 16607 ctx.shadowColor = '#0f0';
 16608 ctx.shadowOffsetX = 50;
 16609 ctx.fillRect(0, 0, 50, 50);
 16610 ctx.restore();
 16612 isPixel(ctx, 25,25, 0,255,0,255, 0);
 16613 isPixel(ctx, 75,25, 0,255,0,255, 0);
 16617 </script>
 16619 <!-- [[[ test_2d.shadow.clip.2.html ]]] -->
 16621 <p>Canvas test: 2d.shadow.clip.2</p>
 16622 <canvas id="c519" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16623 <script>
 16626 function test_2d_shadow_clip_2() {
 16628 var canvas = document.getElementById('c519');
 16629 var ctx = canvas.getContext('2d');
 16631 ctx.fillStyle = '#f00';
 16632 ctx.fillRect(0, 0, 50, 50);
 16633 ctx.fillStyle = '#0f0';
 16634 ctx.fillRect(50, 0, 50, 50);
 16636 ctx.save();
 16637 ctx.beginPath();
 16638 ctx.rect(0, 0, 50, 50);
 16639 ctx.clip();
 16640 ctx.shadowColor = '#f00';
 16641 ctx.shadowOffsetX = 50;
 16642 ctx.fillRect(0, 0, 50, 50);
 16643 ctx.restore();
 16645 isPixel(ctx, 25,25, 0,255,0,255, 0);
 16646 isPixel(ctx, 75,25, 0,255,0,255, 0);
 16650 </script>
 16652 <!-- [[[ test_2d.shadow.clip.3.html ]]] -->
 16654 <p>Canvas test: 2d.shadow.clip.3</p>
 16655 <canvas id="c520" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16656 <script>
 16660 function test_2d_shadow_clip_3() {
 16662 var canvas = document.getElementById('c520');
 16663 var ctx = canvas.getContext('2d');
 16665 ctx.fillStyle = '#f00';
 16666 ctx.fillRect(0, 0, 50, 50);
 16667 ctx.fillStyle = '#0f0';
 16668 ctx.fillRect(50, 0, 50, 50);
 16670 ctx.save();
 16671 ctx.beginPath();
 16672 ctx.rect(0, 0, 50, 50);
 16673 ctx.clip();
 16674 ctx.fillStyle = '#f00';
 16675 ctx.shadowColor = '#0f0';
 16676 ctx.shadowOffsetX = 50;
 16677 ctx.fillRect(-50, 0, 50, 50);
 16678 ctx.restore();
 16680 isPixel(ctx, 25,25, 0,255,0,255, 0);
 16681 isPixel(ctx, 75,25, 0,255,0,255, 0);
 16685 </script>
 16687 <!-- [[[ test_2d.shadow.composite.1.html ]]] -->
 16689 <p>Canvas test: 2d.shadow.composite.1</p>
 16690 <canvas id="c521" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16691 <script>
 16695 function test_2d_shadow_composite_1() {
 16697 var canvas = document.getElementById('c521');
 16698 var ctx = canvas.getContext('2d');
 16700 ctx.fillStyle = '#f00';
 16701 ctx.fillRect(0, 0, 100, 50);
 16702 ctx.globalCompositeOperation = 'xor';
 16703 ctx.shadowColor = '#f00';
 16704 ctx.shadowOffsetX = 100;
 16705 ctx.fillStyle = '#0f0';
 16706 ctx.fillRect(-100, 0, 200, 50);
 16708 isPixel(ctx, 50, 25, 0, 255, 0, 255, 2);
 16711 </script>
 16713 <!-- [[[ test_2d.shadow.composite.2.html ]]] -->
 16715 <p>Canvas test: 2d.shadow.composite.2</p>
 16716 <canvas id="c522" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16717 <script>
 16721 function test_2d_shadow_composite_2() {
 16723 var canvas = document.getElementById('c522');
 16724 var ctx = canvas.getContext('2d');
 16726 ctx.fillStyle = '#f00';
 16727 ctx.fillRect(0, 0, 100, 50);
 16728 ctx.globalCompositeOperation = 'xor';
 16729 ctx.shadowColor = '#f00';
 16730 ctx.shadowBlur = 1;
 16731 ctx.fillStyle = '#0f0';
 16732 ctx.fillRect(-10, -10, 120, 70);
 16734 isPixel(ctx, 50, 25, 0, 255, 0, 255, 2);
 16737 </script>
 16739 <!-- [[[ test_2d.shadow.composite.3.html ]]] -->
 16741 <p>Canvas test: 2d.shadow.composite.3</p>
 16742 <canvas id="c523" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16743 <script>
 16747 function test_2d_shadow_composite_3() {
 16749 var canvas = document.getElementById('c523');
 16750 var ctx = canvas.getContext('2d');
 16752 ctx.fillStyle = '#f00';
 16753 ctx.fillRect(0, 0, 100, 50);
 16754 ctx.globalCompositeOperation = 'xor';
 16755 ctx.shadowColor = '#f00';
 16756 ctx.fillStyle = '#0f0';
 16757 ctx.fillRect(0, 0, 100, 50);
 16759 isPixel(ctx, 50,25, 0,255,0,255, 2);
 16763 </script>
 16765 <!-- [[[ test_2d.shadow.composite.4.html ]]] -->
 16767 <p>Canvas test: 2d.shadow.composite.4</p>
 16768 <canvas id="c524" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16769 <script>
 16773 function test_2d_shadow_composite_4() {
 16775 var canvas = document.getElementById('c524');
 16776 var ctx = canvas.getContext('2d');
 16778 ctx.globalCompositeOperation = 'destination-over';
 16779 ctx.shadowColor = '#0f0';
 16780 ctx.fillStyle = '#f00';
 16781 ctx.fillRect(0, 0, 100, 50);
 16783 isPixel(ctx, 50,25, 0,255,0,255, 2);
 16787 </script>
 16789 <!-- [[[ test_2d.shadow.gradient.alpha.html ]]] -->
 16791 <p>Canvas test: 2d.shadow.gradient.alpha</p>
 16792 <canvas id="c525" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16793 <script>
 16797 function test_2d_shadow_gradient_alpha() {
 16799 var canvas = document.getElementById('c525');
 16800 var ctx = canvas.getContext('2d');
 16802 var gradient = ctx.createLinearGradient(0, 0, 100, 0);
 16803 gradient.addColorStop(0, 'rgba(255,0,0,0.5)');
 16804 gradient.addColorStop(1, 'rgba(255,0,0,0.5)');
 16805 ctx.fillStyle = '#f00';
 16806 ctx.fillRect(0, 0, 100, 50);
 16807 ctx.shadowOffsetY = 50;
 16808 ctx.shadowColor = '#00f';
 16809 ctx.fillStyle = gradient;
 16810 ctx.fillRect(0, -50, 100, 50);
 16812 isPixel(ctx, 50,25, 127,0,127,255, 2);
 16816 </script>
 16818 <!-- [[[ test_2d.shadow.gradient.basic.html ]]] -->
 16820 <p>Canvas test: 2d.shadow.gradient.basic</p>
 16821 <canvas id="c526" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16822 <script>
 16826 function test_2d_shadow_gradient_basic() {
 16828 var canvas = document.getElementById('c526');
 16829 var ctx = canvas.getContext('2d');
 16831 var gradient = ctx.createLinearGradient(0, 0, 100, 0);
 16832 gradient.addColorStop(0, '#f00');
 16833 gradient.addColorStop(1, '#f00');
 16834 ctx.fillStyle = '#f00';
 16835 ctx.fillRect(0, 0, 100, 50);
 16836 ctx.shadowColor = '#0f0';
 16837 ctx.shadowOffsetY = 50;
 16838 ctx.fillStyle = gradient;
 16839 ctx.fillRect(0, -50, 100, 50);
 16841 isPixel(ctx, 50,25, 0,255,0,255, 0);
 16845 </script>
 16847 <!-- [[[ test_2d.shadow.gradient.transparent.1.html ]]] -->
 16849 <p>Canvas test: 2d.shadow.gradient.transparent.1</p>
 16850 <canvas id="c527" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16851 <script>
 16854 function test_2d_shadow_gradient_transparent_1() {
 16856 var canvas = document.getElementById('c527');
 16857 var ctx = canvas.getContext('2d');
 16859 var gradient = ctx.createLinearGradient(0, 0, 100, 0);
 16860 gradient.addColorStop(0, 'rgba(0,0,0,0)');
 16861 gradient.addColorStop(1, 'rgba(0,0,0,0)');
 16862 ctx.fillStyle = '#0f0';
 16863 ctx.fillRect(0, 0, 100, 50);
 16864 ctx.shadowColor = '#f00';
 16865 ctx.shadowOffsetY = 50;
 16866 ctx.fillStyle = gradient;
 16867 ctx.fillRect(0, -50, 100, 50);
 16869 isPixel(ctx, 50,25, 0,255,0,255, 0);
 16873 </script>
 16875 <!-- [[[ test_2d.shadow.gradient.transparent.2.html ]]] -->
 16877 <p>Canvas test: 2d.shadow.gradient.transparent.2</p>
 16878 <canvas id="c528" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16879 <script>
 16883 function test_2d_shadow_gradient_transparent_2() {
 16885 var canvas = document.getElementById('c528');
 16886 var ctx = canvas.getContext('2d');
 16888 var gradient = ctx.createLinearGradient(0, 0, 100, 0);
 16889 gradient.addColorStop(0, '#f00');
 16890 gradient.addColorStop(0.499, '#f00');
 16891 gradient.addColorStop(0.5, 'rgba(0,0,0,0)');
 16892 gradient.addColorStop(1, 'rgba(0,0,0,0)');
 16893 ctx.fillStyle = '#f00';
 16894 ctx.fillRect(0, 0, 50, 50);
 16895 ctx.fillStyle = '#0f0';
 16896 ctx.fillRect(50, 0, 50, 50);
 16897 ctx.shadowOffsetY = 50;
 16898 ctx.shadowColor = '#0f0';
 16899 ctx.fillStyle = gradient;
 16900 ctx.fillRect(0, -50, 100, 50);
 16902 isPixel(ctx, 25,25, 0,255,0,255, 0);
 16903 isPixel(ctx, 50,25, 0,255,0,255, 0);
 16904 isPixel(ctx, 75,25, 0,255,0,255, 0);
 16908 </script>
 16910 <!-- [[[ test_2d.shadow.image.alpha.html ]]] -->
 16912 <p>Canvas test: 2d.shadow.image.alpha</p>
 16913 <canvas id="c529" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16914 <script>
 16918 function test_2d_shadow_image_alpha() {
 16920 var canvas = document.getElementById('c529');
 16921 var ctx = canvas.getContext('2d');
 16923 ctx.fillStyle = '#f00';
 16924 ctx.fillRect(0, 0, 100, 50);
 16925 ctx.shadowOffsetY = 50;
 16926 ctx.shadowColor = '#00f';
 16927 ctx.drawImage(document.getElementById('transparent50_2.png'), 0, -50);
 16929 isPixel(ctx, 50,25, 127,0,127,255, 2);
 16933 </script>
 16934 <img src="image_transparent50.png" id="transparent50_2.png" class="resource">
 16936 <!-- [[[ test_2d.shadow.image.basic.html ]]] -->
 16938 <p>Canvas test: 2d.shadow.image.basic</p>
 16939 <canvas id="c530" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16940 <script>
 16944 function test_2d_shadow_image_basic() {
 16946 var canvas = document.getElementById('c530');
 16947 var ctx = canvas.getContext('2d');
 16949 ctx.fillStyle = '#f00';
 16950 ctx.fillRect(0, 0, 100, 50);
 16951 ctx.shadowColor = '#0f0';
 16952 ctx.shadowOffsetY = 50;
 16953 ctx.drawImage(document.getElementById('red_17.png'), 0, -50);
 16955 isPixel(ctx, 50,25, 0,255,0,255, 0);
 16959 </script>
 16960 <img src="image_red.png" id="red_17.png" class="resource">
 16962 <!-- [[[ test_2d.shadow.image.scale.html ]]] -->
 16964 <p>Canvas test: 2d.shadow.image.scale</p>
 16965 <canvas id="c531" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16966 <script>
 16970 function test_2d_shadow_image_scale() {
 16972 var canvas = document.getElementById('c531');
 16973 var ctx = canvas.getContext('2d');
 16975 ctx.fillStyle = '#f00';
 16976 ctx.fillRect(0, 0, 100, 50);
 16977 ctx.shadowOffsetY = 50;
 16978 ctx.shadowColor = '#0f0';
 16979 ctx.drawImage(document.getElementById('redtransparent_2.png'), 0, 0, 100, 50, -10, -50, 240, 50);
 16981 isPixel(ctx, 25,25, 0,255,0,255, 2);
 16982 isPixel(ctx, 50,25, 0,255,0,255, 2);
 16983 isPixel(ctx, 75,25, 0,255,0,255, 2);
 16987 </script>
 16988 <img src="image_redtransparent.png" id="redtransparent_2.png" class="resource">
 16990 <!-- [[[ test_2d.shadow.image.section.html ]]] -->
 16992 <p>Canvas test: 2d.shadow.image.section</p>
 16993 <canvas id="c532" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 16994 <script>
 16997 function test_2d_shadow_image_section() {
 16999 var canvas = document.getElementById('c532');
 17000 var ctx = canvas.getContext('2d');
 17002 ctx.fillStyle = '#0f0';
 17003 ctx.fillRect(0, 0, 100, 50);
 17004 ctx.shadowOffsetY = 50;
 17005 ctx.shadowColor = '#f00';
 17006 ctx.drawImage(document.getElementById('redtransparent_3.png'), 50, 0, 50, 50, 0, -50, 50, 50);
 17008 isPixel(ctx, 25,25, 0,255,0,255, 2);
 17009 isPixel(ctx, 50,25, 0,255,0,255, 2);
 17010 isPixel(ctx, 75,25, 0,255,0,255, 2);
 17014 </script>
 17015 <img src="image_redtransparent.png" id="redtransparent_3.png" class="resource">
 17017 <!-- [[[ test_2d.shadow.image.transparent.1.html ]]] -->
 17019 <p>Canvas test: 2d.shadow.image.transparent.1</p>
 17020 <canvas id="c533" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17021 <script>
 17024 function test_2d_shadow_image_transparent_1() {
 17026 var canvas = document.getElementById('c533');
 17027 var ctx = canvas.getContext('2d');
 17029 ctx.fillStyle = '#0f0';
 17030 ctx.fillRect(0, 0, 100, 50);
 17031 ctx.shadowColor = '#f00';
 17032 ctx.shadowOffsetY = 50;
 17033 ctx.drawImage(document.getElementById('transparent_1.png'), 0, -50);
 17035 isPixel(ctx, 50,25, 0,255,0,255, 0);
 17039 </script>
 17040 <img src="image_transparent.png" id="transparent_1.png" class="resource">
 17042 <!-- [[[ test_2d.shadow.image.transparent.2.html ]]] -->
 17044 <p>Canvas test: 2d.shadow.image.transparent.2</p>
 17045 <canvas id="c534" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17046 <script>
 17050 function test_2d_shadow_image_transparent_2() {
 17052 var canvas = document.getElementById('c534');
 17053 var ctx = canvas.getContext('2d');
 17055 ctx.fillStyle = '#0f0';
 17056 ctx.fillRect(0, 0, 50, 50);
 17057 ctx.fillStyle = '#f00';
 17058 ctx.fillRect(50, 0, 50, 50);
 17059 ctx.shadowOffsetY = 50;
 17060 ctx.shadowColor = '#0f0';
 17061 ctx.drawImage(document.getElementById('redtransparent_4.png'), 50, -50);
 17062 ctx.shadowColor = '#f00';
 17063 ctx.drawImage(document.getElementById('redtransparent_4.png'), -50, -50);
 17065 isPixel(ctx, 25,25, 0,255,0,255, 0);
 17066 isPixel(ctx, 50,25, 0,255,0,255, 0);
 17067 isPixel(ctx, 75,25, 0,255,0,255, 0);
 17071 </script>
 17072 <img src="image_redtransparent.png" id="redtransparent_4.png" class="resource">
 17074 <!-- [[[ test_2d.shadow.offset.negativeX.html ]]] -->
 17076 <p>Canvas test: 2d.shadow.offset.negativeX</p>
 17077 <canvas id="c535" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17078 <script>
 17082 function test_2d_shadow_offset_negativeX() {
 17084 var canvas = document.getElementById('c535');
 17085 var ctx = canvas.getContext('2d');
 17087 ctx.fillStyle = '#f00';
 17088 ctx.fillRect(0, 0, 100, 50);
 17089 ctx.fillStyle = '#0f0';
 17090 ctx.shadowColor = '#0f0';
 17091 ctx.shadowOffsetX = -50;
 17092 ctx.fillRect(50, 0, 50, 50);
 17093 isPixel(ctx, 25,25, 0,255,0,255, 0);
 17094 isPixel(ctx, 75,25, 0,255,0,255, 0);
 17098 </script>
 17100 <!-- [[[ test_2d.shadow.offset.negativeY.html ]]] -->
 17102 <p>Canvas test: 2d.shadow.offset.negativeY</p>
 17103 <canvas id="c536" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17104 <script>
 17108 function test_2d_shadow_offset_negativeY() {
 17110 var canvas = document.getElementById('c536');
 17111 var ctx = canvas.getContext('2d');
 17113 ctx.fillStyle = '#f00';
 17114 ctx.fillRect(0, 0, 100, 50);
 17115 ctx.fillStyle = '#0f0';
 17116 ctx.shadowColor = '#0f0';
 17117 ctx.shadowOffsetY = -25;
 17118 ctx.fillRect(0, 25, 100, 25);
 17119 isPixel(ctx, 50,12, 0,255,0,255, 0);
 17120 isPixel(ctx, 50,37, 0,255,0,255, 0);
 17124 </script>
 17126 <!-- [[[ test_2d.shadow.offset.positiveX.html ]]] -->
 17128 <p>Canvas test: 2d.shadow.offset.positiveX</p>
 17129 <canvas id="c537" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17130 <script>
 17134 function test_2d_shadow_offset_positiveX() {
 17136 var canvas = document.getElementById('c537');
 17137 var ctx = canvas.getContext('2d');
 17139 ctx.fillStyle = '#f00';
 17140 ctx.fillRect(0, 0, 100, 50);
 17141 ctx.fillStyle = '#0f0';
 17142 ctx.shadowColor = '#0f0';
 17143 ctx.shadowOffsetX = 50;
 17144 ctx.fillRect(0, 0, 50, 50);
 17145 isPixel(ctx, 25,25, 0,255,0,255, 0);
 17146 isPixel(ctx, 75,25, 0,255,0,255, 0);
 17150 </script>
 17152 <!-- [[[ test_2d.shadow.offset.positiveY.html ]]] -->
 17154 <p>Canvas test: 2d.shadow.offset.positiveY</p>
 17155 <canvas id="c538" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17156 <script>
 17160 function test_2d_shadow_offset_positiveY() {
 17162 var canvas = document.getElementById('c538');
 17163 var ctx = canvas.getContext('2d');
 17165 ctx.fillStyle = '#f00';
 17166 ctx.fillRect(0, 0, 100, 50);
 17167 ctx.fillStyle = '#0f0';
 17168 ctx.shadowColor = '#0f0';
 17169 ctx.shadowOffsetY = 25;
 17170 ctx.fillRect(0, 0, 100, 25);
 17171 isPixel(ctx, 50,12, 0,255,0,255, 0);
 17172 isPixel(ctx, 50,37, 0,255,0,255, 0);
 17176 </script>
 17178 <!-- [[[ test_2d.shadow.outside.html ]]] -->
 17180 <p>Canvas test: 2d.shadow.outside</p>
 17181 <canvas id="c539" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17182 <script>
 17186 function test_2d_shadow_outside() {
 17188 var canvas = document.getElementById('c539');
 17189 var ctx = canvas.getContext('2d');
 17191 ctx.fillStyle = '#f00';
 17192 ctx.fillRect(0, 0, 100, 50);
 17193 ctx.shadowColor = '#0f0';
 17194 ctx.shadowOffsetX = 100;
 17195 ctx.fillRect(-100, 0, 25, 50);
 17196 ctx.shadowOffsetX = -100;
 17197 ctx.fillRect(175, 0, 25, 50);
 17198 ctx.shadowOffsetX = 0;
 17199 ctx.shadowOffsetY = 100;
 17200 ctx.fillRect(25, -100, 50, 25);
 17201 ctx.shadowOffsetY = -100;
 17202 ctx.fillRect(25, 125, 50, 25);
 17203 isPixel(ctx, 12,25, 0,255,0,255, 0);
 17204 isPixel(ctx, 87,25, 0,255,0,255, 0);
 17205 isPixel(ctx, 50,12, 0,255,0,255, 0);
 17206 isPixel(ctx, 50,37, 0,255,0,255, 0);
 17210 </script>
 17212 <!-- [[[ test_2d.shadow.pattern.alpha.html ]]] -->
 17214 <p>Canvas test: 2d.shadow.pattern.alpha</p>
 17215 <canvas id="c540" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17216 <script>
 17220 function test_2d_shadow_pattern_alpha() {
 17222 var canvas = document.getElementById('c540');
 17223 var ctx = canvas.getContext('2d');
 17225 var pattern = ctx.createPattern(document.getElementById('transparent50_3.png'), 'repeat');
 17226 ctx.fillStyle = '#f00';
 17227 ctx.fillRect(0, 0, 100, 50);
 17228 ctx.shadowOffsetY = 50;
 17229 ctx.shadowColor = '#00f';
 17230 ctx.fillStyle = pattern;
 17231 ctx.fillRect(0, -50, 100, 50);
 17233 isPixel(ctx, 50,25, 127,0,127,255, 2);
 17237 </script>
 17238 <img src="image_transparent50.png" id="transparent50_3.png" class="resource">
 17240 <!-- [[[ test_2d.shadow.pattern.basic.html ]]] -->
 17242 <p>Canvas test: 2d.shadow.pattern.basic</p>
 17243 <canvas id="c541" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17244 <script>
 17248 function test_2d_shadow_pattern_basic() {
 17250 var canvas = document.getElementById('c541');
 17251 var ctx = canvas.getContext('2d');
 17253 var pattern = ctx.createPattern(document.getElementById('red_18.png'), 'repeat');
 17254 ctx.fillStyle = '#f00';
 17255 ctx.fillRect(0, 0, 100, 50);
 17256 ctx.shadowColor = '#0f0';
 17257 ctx.shadowOffsetY = 50;
 17258 ctx.fillStyle = pattern;
 17259 ctx.fillRect(0, -50, 100, 50);
 17261 isPixel(ctx, 50,25, 0,255,0,255, 0);
 17265 </script>
 17266 <img src="image_red.png" id="red_18.png" class="resource">
 17268 <!-- [[[ test_2d.shadow.pattern.transparent.1.html ]]] -->
 17270 <p>Canvas test: 2d.shadow.pattern.transparent.1</p>
 17271 <canvas id="c542" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17272 <script>
 17275 function test_2d_shadow_pattern_transparent_1() {
 17277 var canvas = document.getElementById('c542');
 17278 var ctx = canvas.getContext('2d');
 17280 var pattern = ctx.createPattern(document.getElementById('transparent_2.png'), 'repeat');
 17281 ctx.fillStyle = '#0f0';
 17282 ctx.fillRect(0, 0, 100, 50);
 17283 ctx.shadowColor = '#f00';
 17284 ctx.shadowOffsetY = 50;
 17285 ctx.fillStyle = pattern;
 17286 ctx.fillRect(0, -50, 100, 50);
 17288 isPixel(ctx, 50,25, 0,255,0,255, 0);
 17292 </script>
 17293 <img src="image_transparent.png" id="transparent_2.png" class="resource">
 17295 <!-- [[[ test_2d.shadow.pattern.transparent.2.html ]]] -->
 17297 <p>Canvas test: 2d.shadow.pattern.transparent.2</p>
 17298 <canvas id="c543" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17299 <script>
 17303 function test_2d_shadow_pattern_transparent_2() {
 17305 var canvas = document.getElementById('c543');
 17306 var ctx = canvas.getContext('2d');
 17308 var pattern = ctx.createPattern(document.getElementById('redtransparent_5.png'), 'repeat');
 17309 ctx.fillStyle = '#f00';
 17310 ctx.fillRect(0, 0, 50, 50);
 17311 ctx.fillStyle = '#0f0';
 17312 ctx.fillRect(50, 0, 50, 50);
 17313 ctx.shadowOffsetY = 50;
 17314 ctx.shadowColor = '#0f0';
 17315 ctx.fillStyle = pattern;
 17316 ctx.fillRect(0, -50, 100, 50);
 17318 isPixel(ctx, 25,25, 0,255,0,255, 0);
 17319 isPixel(ctx, 50,25, 0,255,0,255, 0);
 17320 isPixel(ctx, 75,25, 0,255,0,255, 0);
 17324 </script>
 17325 <img src="image_redtransparent.png" id="redtransparent_5.png" class="resource">
 17327 <!-- [[[ test_2d.shadow.stroke.basic.html ]]] -->
 17329 <p>Canvas test: 2d.shadow.stroke.basic</p>
 17330 <canvas id="c544" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17331 <script>
 17335 function test_2d_shadow_stroke_basic() {
 17337 var canvas = document.getElementById('c544');
 17338 var ctx = canvas.getContext('2d');
 17340 ctx.fillStyle = '#f00';
 17341 ctx.fillRect(0, 0, 100, 50);
 17342 ctx.strokeStyle = '#f00';
 17343 ctx.shadowColor = '#0f0';
 17344 ctx.shadowOffsetY = 50;
 17345 ctx.beginPath();
 17346 ctx.lineWidth = 50;
 17347 ctx.moveTo(0, -25);
 17348 ctx.lineTo(100, -25);
 17349 ctx.stroke();
 17351 isPixel(ctx, 1,25, 0,255,0,255, 0);
 17352 isPixel(ctx, 50,25, 0,255,0,255, 0);
 17353 isPixel(ctx, 98,25, 0,255,0,255, 0);
 17357 </script>
 17359 <!-- [[[ test_2d.shadow.stroke.cap.1.html ]]] -->
 17361 <p>Canvas test: 2d.shadow.stroke.cap.1</p>
 17362 <canvas id="c545" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17363 <script>
 17366 function test_2d_shadow_stroke_cap_1() {
 17368 var canvas = document.getElementById('c545');
 17369 var ctx = canvas.getContext('2d');
 17371 ctx.fillStyle = '#0f0';
 17372 ctx.fillRect(0, 0, 100, 50);
 17373 ctx.strokeStyle = '#f00';
 17374 ctx.shadowColor = '#f00';
 17375 ctx.shadowOffsetY = 50;
 17376 ctx.beginPath();
 17377 ctx.lineWidth = 50;
 17378 ctx.lineCap = 'butt';
 17379 ctx.moveTo(-50, -25);
 17380 ctx.lineTo(0, -25);
 17381 ctx.moveTo(100, -25);
 17382 ctx.lineTo(150, -25);
 17383 ctx.stroke();
 17385 isPixel(ctx, 1,25, 0,255,0,255, 0);
 17386 isPixel(ctx, 50,25, 0,255,0,255, 0);
 17387 isPixel(ctx, 98,25, 0,255,0,255, 0);
 17391 </script>
 17393 <!-- [[[ test_2d.shadow.stroke.cap.2.html ]]] -->
 17395 <p>Canvas test: 2d.shadow.stroke.cap.2</p>
 17396 <canvas id="c546" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17397 <script>
 17401 function test_2d_shadow_stroke_cap_2() {
 17403 var canvas = document.getElementById('c546');
 17404 var ctx = canvas.getContext('2d');
 17406 ctx.fillStyle = '#f00';
 17407 ctx.fillRect(0, 0, 100, 50);
 17408 ctx.strokeStyle = '#f00';
 17409 ctx.shadowColor = '#0f0';
 17410 ctx.shadowOffsetY = 50;
 17411 ctx.beginPath();
 17412 ctx.lineWidth = 50;
 17413 ctx.lineCap = 'square';
 17414 ctx.moveTo(25, -25);
 17415 ctx.lineTo(75, -25);
 17416 ctx.stroke();
 17418 isPixel(ctx, 1,25, 0,255,0,255, 0);
 17419 isPixel(ctx, 50,25, 0,255,0,255, 0);
 17420 isPixel(ctx, 98,25, 0,255,0,255, 0);
 17424 </script>
 17426 <!-- [[[ test_2d.shadow.stroke.join.1.html ]]] -->
 17428 <p>Canvas test: 2d.shadow.stroke.join.1</p>
 17429 <canvas id="c547" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17430 <script>
 17433 function test_2d_shadow_stroke_join_1() {
 17435 var canvas = document.getElementById('c547');
 17436 var ctx = canvas.getContext('2d');
 17438 ctx.fillStyle = '#0f0';
 17439 ctx.fillRect(0, 0, 100, 50);
 17440 ctx.strokeStyle = '#f00';
 17441 ctx.shadowColor = '#f00';
 17442 ctx.shadowOffsetX = 100;
 17443 ctx.lineWidth = 200;
 17444 ctx.lineJoin = 'bevel';
 17445 ctx.beginPath();
 17446 ctx.moveTo(-200, -50);
 17447 ctx.lineTo(-150, -50);
 17448 ctx.lineTo(-151, -100);
 17449 ctx.stroke();
 17451 isPixel(ctx, 1,1, 0,255,0,255, 0);
 17452 isPixel(ctx, 48,48, 0,255,0,255, 0);
 17453 isPixel(ctx, 50,25, 0,255,0,255, 0);
 17454 isPixel(ctx, 98,48, 0,255,0,255, 0);
 17458 </script>
 17460 <!-- [[[ test_2d.shadow.stroke.join.2.html ]]] -->
 17462 <p>Canvas test: 2d.shadow.stroke.join.2</p>
 17463 <canvas id="c548" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17464 <script>
 17468 function test_2d_shadow_stroke_join_2() {
 17470 var canvas = document.getElementById('c548');
 17471 var ctx = canvas.getContext('2d');
 17473 ctx.fillStyle = '#f00';
 17474 ctx.fillRect(0, 0, 50, 50);
 17475 ctx.fillStyle = '#0f0';
 17476 ctx.fillRect(50, 0, 50, 50);
 17477 ctx.strokeStyle = '#f00';
 17478 ctx.shadowColor = '#0f0';
 17479 ctx.shadowOffsetX = 100;
 17480 ctx.lineWidth = 200;
 17481 ctx.lineJoin = 'miter';
 17482 ctx.beginPath();
 17483 ctx.moveTo(-200, -50);
 17484 ctx.lineTo(-150, -50);
 17485 ctx.lineTo(-151, -100);
 17486 ctx.stroke();
 17488 isPixel(ctx, 1,1, 0,255,0,255, 0);
 17489 isPixel(ctx, 48,48, 0,255,0,255, 0);
 17490 isPixel(ctx, 50,25, 0,255,0,255, 0);
 17491 isPixel(ctx, 98,48, 0,255,0,255, 0);
 17495 </script>
 17497 <!-- [[[ test_2d.shadow.stroke.join.3.html ]]] -->
 17499 <p>Canvas test: 2d.shadow.stroke.join.3</p>
 17500 <canvas id="c549" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17501 <script>
 17504 function test_2d_shadow_stroke_join_3() {
 17506 var canvas = document.getElementById('c549');
 17507 var ctx = canvas.getContext('2d');
 17509 ctx.fillStyle = '#0f0';
 17510 ctx.fillRect(0, 0, 100, 50);
 17511 ctx.strokeStyle = '#f00';
 17512 ctx.shadowColor = '#f00';
 17513 ctx.shadowOffsetX = 100;
 17514 ctx.lineWidth = 200;
 17515 ctx.lineJoin = 'miter';
 17516 ctx.miterLimit = 0.1;
 17517 ctx.beginPath();
 17518 ctx.moveTo(-200, -50);
 17519 ctx.lineTo(-150, -50);
 17520 ctx.lineTo(-151, -100); // (not an exact right angle, to avoid some other bug in Firefox 3)
 17521 ctx.stroke();
 17523 isPixel(ctx, 1,1, 0,255,0,255, 0);
 17524 isPixel(ctx, 48,48, 0,255,0,255, 0);
 17525 isPixel(ctx, 50,25, 0,255,0,255, 0);
 17526 isPixel(ctx, 98,48, 0,255,0,255, 0);
 17530 </script>
 17532 <!-- [[[ test_2d.shadow.transform.1.html ]]] -->
 17534 <p>Canvas test: 2d.shadow.transform.1</p>
 17535 <canvas id="c550" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17536 <script>
 17540 function test_2d_shadow_transform_1() {
 17542 var canvas = document.getElementById('c550');
 17543 var ctx = canvas.getContext('2d');
 17545 ctx.fillStyle = '#f00';
 17546 ctx.fillRect(0, 0, 100, 50);
 17547 ctx.shadowOffsetY = 50;
 17548 ctx.shadowColor = '#0f0';
 17549 ctx.translate(100, 100);
 17550 ctx.fillRect(-100, -150, 100, 50);
 17552 isPixel(ctx, 50,25, 0,255,0,255, 0);
 17556 </script>
 17558 <!-- [[[ test_2d.shadow.transform.2.html ]]] -->
 17560 <p>Canvas test: 2d.shadow.transform.2</p>
 17561 <canvas id="c551" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17562 <script>
 17566 function test_2d_shadow_transform_2() {
 17568 var canvas = document.getElementById('c551');
 17569 var ctx = canvas.getContext('2d');
 17571 ctx.fillStyle = '#f00';
 17572 ctx.fillRect(0, 0, 100, 50);
 17573 ctx.shadowOffsetY = 50;
 17574 ctx.shadowColor = '#0f0';
 17575 ctx.rotate(Math.PI)
 17576 ctx.fillRect(-100, 0, 100, 50);
 17578 isPixel(ctx, 50,25, 0,255,0,255, 0);
 17582 </script>
 17584 <!-- [[[ test_2d.state.saverestore.bitmap.html ]]] -->
 17586 <p>Canvas test: 2d.state.saverestore.bitmap</p>
 17587 <!-- Testing: save()/restore() does not affect the current bitmap -->
 17588 <canvas id="c552" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17589 <script>
 17592 function test_2d_state_saverestore_bitmap() {
 17594 var canvas = document.getElementById('c552');
 17595 var ctx = canvas.getContext('2d');
 17597 ctx.fillStyle = '#f00';
 17598 ctx.fillRect(0, 0, 100, 50);
 17599 ctx.save();
 17600 ctx.fillStyle = '#0f0';
 17601 ctx.fillRect(0, 0, 100, 50);
 17602 ctx.restore();
 17603 isPixel(ctx, 50,25, 0,255,0,255, 0);
 17607 </script>
 17609 <!-- [[[ test_2d.state.saverestore.clip.html ]]] -->
 17611 <p>Canvas test: 2d.state.saverestore.clip</p>
 17612 <!-- Testing: save()/restore() affects the clipping path -->
 17613 <canvas id="c553" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17614 <script>
 17617 function test_2d_state_saverestore_clip() {
 17619 var canvas = document.getElementById('c553');
 17620 var ctx = canvas.getContext('2d');
 17622 ctx.fillStyle = '#f00';
 17623 ctx.fillRect(0, 0, 100, 50);
 17624 ctx.save();
 17625 ctx.rect(0, 0, 1, 1);
 17626 ctx.clip();
 17627 ctx.restore();
 17628 ctx.fillStyle = '#0f0';
 17629 ctx.fillRect(0, 0, 100, 50);
 17630 isPixel(ctx, 50,25, 0,255,0,255, 0);
 17634 </script>
 17636 <!-- [[[ test_2d.state.saverestore.fillStyle.html ]]] -->
 17638 <p>Canvas test: 2d.state.saverestore.fillStyle</p>
 17639 <!-- Testing: save()/restore() works for fillStyle -->
 17640 <canvas id="c554" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17641 <script>
 17643 function test_2d_state_saverestore_fillStyle() {
 17645 var canvas = document.getElementById('c554');
 17646 var ctx = canvas.getContext('2d');
 17648 // Test that restore() undoes any modifications
 17649 var old = ctx.fillStyle;
 17650 ctx.save();
 17651 ctx.fillStyle = "#ff0000";
 17652 ctx.restore();
 17653 ok(ctx.fillStyle === old, "ctx.fillStyle === old");
 17655 // Also test that save() doesn't modify the values
 17656 ctx.fillStyle = "#ff0000";
 17657 old = ctx.fillStyle;
 17658     // we're not interested in failures caused by get(set(x)) != x (e.g.
 17659     // from rounding), so compare against d instead of against "#ff0000"
 17660 ctx.save();
 17661 ok(ctx.fillStyle === old, "ctx.fillStyle === old");
 17662 ctx.restore();
 17666 </script>
 17668 <!-- [[[ test_2d.state.saverestore.globalAlpha.html ]]] -->
 17670 <p>Canvas test: 2d.state.saverestore.globalAlpha</p>
 17671 <!-- Testing: save()/restore() works for globalAlpha -->
 17672 <canvas id="c555" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17673 <script>
 17675 function test_2d_state_saverestore_globalAlpha() {
 17677 var canvas = document.getElementById('c555');
 17678 var ctx = canvas.getContext('2d');
 17680 // Test that restore() undoes any modifications
 17681 var old = ctx.globalAlpha;
 17682 ctx.save();
 17683 ctx.globalAlpha = 0.5;
 17684 ctx.restore();
 17685 ok(ctx.globalAlpha === old, "ctx.globalAlpha === old");
 17687 // Also test that save() doesn't modify the values
 17688 ctx.globalAlpha = 0.5;
 17689 old = ctx.globalAlpha;
 17690     // we're not interested in failures caused by get(set(x)) != x (e.g.
 17691     // from rounding), so compare against d instead of against 0.5
 17692 ctx.save();
 17693 ok(ctx.globalAlpha === old, "ctx.globalAlpha === old");
 17694 ctx.restore();
 17698 </script>
 17700 <!-- [[[ test_2d.state.saverestore.globalCompositeOperation.html ]]] -->
 17702 <p>Canvas test: 2d.state.saverestore.globalCompositeOperation</p>
 17703 <!-- Testing: save()/restore() works for globalCompositeOperation -->
 17704 <canvas id="c556" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17705 <script>
 17707 function test_2d_state_saverestore_globalCompositeOperation() {
 17709 var canvas = document.getElementById('c556');
 17710 var ctx = canvas.getContext('2d');
 17712 // Test that restore() undoes any modifications
 17713 var old = ctx.globalCompositeOperation;
 17714 ctx.save();
 17715 ctx.globalCompositeOperation = "copy";
 17716 ctx.restore();
 17717 ok(ctx.globalCompositeOperation === old, "ctx.globalCompositeOperation === old");
 17719 // Also test that save() doesn't modify the values
 17720 ctx.globalCompositeOperation = "copy";
 17721 old = ctx.globalCompositeOperation;
 17722     // we're not interested in failures caused by get(set(x)) != x (e.g.
 17723     // from rounding), so compare against d instead of against "copy"
 17724 ctx.save();
 17725 ok(ctx.globalCompositeOperation === old, "ctx.globalCompositeOperation === old");
 17726 ctx.restore();
 17730 </script>
 17732 <!-- [[[ test_2d.state.saverestore.lineCap.html ]]] -->
 17734 <p>Canvas test: 2d.state.saverestore.lineCap</p>
 17735 <!-- Testing: save()/restore() works for lineCap -->
 17736 <canvas id="c557" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17737 <script>
 17739 function test_2d_state_saverestore_lineCap() {
 17741 var canvas = document.getElementById('c557');
 17742 var ctx = canvas.getContext('2d');
 17744 // Test that restore() undoes any modifications
 17745 var old = ctx.lineCap;
 17746 ctx.save();
 17747 ctx.lineCap = "round";
 17748 ctx.restore();
 17749 ok(ctx.lineCap === old, "ctx.lineCap === old");
 17751 // Also test that save() doesn't modify the values
 17752 ctx.lineCap = "round";
 17753 old = ctx.lineCap;
 17754     // we're not interested in failures caused by get(set(x)) != x (e.g.
 17755     // from rounding), so compare against d instead of against "round"
 17756 ctx.save();
 17757 ok(ctx.lineCap === old, "ctx.lineCap === old");
 17758 ctx.restore();
 17762 </script>
 17764 <!-- [[[ test_2d.state.saverestore.lineJoin.html ]]] -->
 17766 <p>Canvas test: 2d.state.saverestore.lineJoin</p>
 17767 <!-- Testing: save()/restore() works for lineJoin -->
 17768 <canvas id="c558" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17769 <script>
 17771 function test_2d_state_saverestore_lineJoin() {
 17773 var canvas = document.getElementById('c558');
 17774 var ctx = canvas.getContext('2d');
 17776 // Test that restore() undoes any modifications
 17777 var old = ctx.lineJoin;
 17778 ctx.save();
 17779 ctx.lineJoin = "round";
 17780 ctx.restore();
 17781 ok(ctx.lineJoin === old, "ctx.lineJoin === old");
 17783 // Also test that save() doesn't modify the values
 17784 ctx.lineJoin = "round";
 17785 old = ctx.lineJoin;
 17786     // we're not interested in failures caused by get(set(x)) != x (e.g.
 17787     // from rounding), so compare against d instead of against "round"
 17788 ctx.save();
 17789 ok(ctx.lineJoin === old, "ctx.lineJoin === old");
 17790 ctx.restore();
 17794 </script>
 17796 <!-- [[[ test_2d.state.saverestore.lineWidth.html ]]] -->
 17798 <p>Canvas test: 2d.state.saverestore.lineWidth</p>
 17799 <!-- Testing: save()/restore() works for lineWidth -->
 17800 <canvas id="c559" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17801 <script>
 17803 function test_2d_state_saverestore_lineWidth() {
 17805 var canvas = document.getElementById('c559');
 17806 var ctx = canvas.getContext('2d');
 17808 // Test that restore() undoes any modifications
 17809 var old = ctx.lineWidth;
 17810 ctx.save();
 17811 ctx.lineWidth = 0.5;
 17812 ctx.restore();
 17813 ok(ctx.lineWidth === old, "ctx.lineWidth === old");
 17815 // Also test that save() doesn't modify the values
 17816 ctx.lineWidth = 0.5;
 17817 old = ctx.lineWidth;
 17818     // we're not interested in failures caused by get(set(x)) != x (e.g.
 17819     // from rounding), so compare against d instead of against 0.5
 17820 ctx.save();
 17821 ok(ctx.lineWidth === old, "ctx.lineWidth === old");
 17822 ctx.restore();
 17826 </script>
 17828 <!-- [[[ test_2d.state.saverestore.miterLimit.html ]]] -->
 17830 <p>Canvas test: 2d.state.saverestore.miterLimit</p>
 17831 <!-- Testing: save()/restore() works for miterLimit -->
 17832 <canvas id="c560" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17833 <script>
 17835 function test_2d_state_saverestore_miterLimit() {
 17837 var canvas = document.getElementById('c560');
 17838 var ctx = canvas.getContext('2d');
 17840 // Test that restore() undoes any modifications
 17841 var old = ctx.miterLimit;
 17842 ctx.save();
 17843 ctx.miterLimit = 0.5;
 17844 ctx.restore();
 17845 ok(ctx.miterLimit === old, "ctx.miterLimit === old");
 17847 // Also test that save() doesn't modify the values
 17848 ctx.miterLimit = 0.5;
 17849 old = ctx.miterLimit;
 17850     // we're not interested in failures caused by get(set(x)) != x (e.g.
 17851     // from rounding), so compare against d instead of against 0.5
 17852 ctx.save();
 17853 ok(ctx.miterLimit === old, "ctx.miterLimit === old");
 17854 ctx.restore();
 17858 </script>
 17860 <!-- [[[ test_2d.state.saverestore.path.html ]]] -->
 17862 <p>Canvas test: 2d.state.saverestore.path</p>
 17863 <!-- Testing: save()/restore() does not affect the current path -->
 17864 <canvas id="c561" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17865 <script>
 17868 function test_2d_state_saverestore_path() {
 17870 var canvas = document.getElementById('c561');
 17871 var ctx = canvas.getContext('2d');
 17873 ctx.fillStyle = '#f00';
 17874 ctx.fillRect(0, 0, 100, 50);
 17875 ctx.save();
 17876 ctx.rect(0, 0, 100, 50);
 17877 ctx.restore();
 17878 ctx.fillStyle = '#0f0';
 17879 ctx.fill();
 17880 isPixel(ctx, 50,25, 0,255,0,255, 0);
 17884 </script>
 17886 <!-- [[[ test_2d.state.saverestore.shadowBlur.html ]]] -->
 17888 <p>Canvas test: 2d.state.saverestore.shadowBlur</p>
 17889 <!-- Testing: save()/restore() works for shadowBlur -->
 17890 <canvas id="c562" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17891 <script>
 17893 function test_2d_state_saverestore_shadowBlur() {
 17895 var canvas = document.getElementById('c562');
 17896 var ctx = canvas.getContext('2d');
 17898 // Test that restore() undoes any modifications
 17899 var old = ctx.shadowBlur;
 17900 ctx.save();
 17901 ctx.shadowBlur = 5;
 17902 ctx.restore();
 17903 ok(ctx.shadowBlur === old, "ctx.shadowBlur === old");
 17905 // Also test that save() doesn't modify the values
 17906 ctx.shadowBlur = 5;
 17907 old = ctx.shadowBlur;
 17908     // we're not interested in failures caused by get(set(x)) != x (e.g.
 17909     // from rounding), so compare against d instead of against 5
 17910 ctx.save();
 17911 ok(ctx.shadowBlur === old, "ctx.shadowBlur === old");
 17912 ctx.restore();
 17916 </script>
 17918 <!-- [[[ test_2d.state.saverestore.shadowColor.html ]]] -->
 17920 <p>Canvas test: 2d.state.saverestore.shadowColor</p>
 17921 <!-- Testing: save()/restore() works for shadowColor -->
 17922 <canvas id="c563" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17923 <script>
 17925 function test_2d_state_saverestore_shadowColor() {
 17927 var canvas = document.getElementById('c563');
 17928 var ctx = canvas.getContext('2d');
 17930 // Test that restore() undoes any modifications
 17931 var old = ctx.shadowColor;
 17932 ctx.save();
 17933 ctx.shadowColor = "#ff0000";
 17934 ctx.restore();
 17935 ok(ctx.shadowColor === old, "ctx.shadowColor === old");
 17937 // Also test that save() doesn't modify the values
 17938 ctx.shadowColor = "#ff0000";
 17939 old = ctx.shadowColor;
 17940     // we're not interested in failures caused by get(set(x)) != x (e.g.
 17941     // from rounding), so compare against d instead of against "#ff0000"
 17942 ctx.save();
 17943 ok(ctx.shadowColor === old, "ctx.shadowColor === old");
 17944 ctx.restore();
 17948 </script>
 17950 <!-- [[[ test_2d.state.saverestore.shadowOffsetX.html ]]] -->
 17952 <p>Canvas test: 2d.state.saverestore.shadowOffsetX</p>
 17953 <!-- Testing: save()/restore() works for shadowOffsetX -->
 17954 <canvas id="c564" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17955 <script>
 17957 function test_2d_state_saverestore_shadowOffsetX() {
 17959 var canvas = document.getElementById('c564');
 17960 var ctx = canvas.getContext('2d');
 17962 // Test that restore() undoes any modifications
 17963 var old = ctx.shadowOffsetX;
 17964 ctx.save();
 17965 ctx.shadowOffsetX = 5;
 17966 ctx.restore();
 17967 ok(ctx.shadowOffsetX === old, "ctx.shadowOffsetX === old");
 17969 // Also test that save() doesn't modify the values
 17970 ctx.shadowOffsetX = 5;
 17971 old = ctx.shadowOffsetX;
 17972     // we're not interested in failures caused by get(set(x)) != x (e.g.
 17973     // from rounding), so compare against d instead of against 5
 17974 ctx.save();
 17975 ok(ctx.shadowOffsetX === old, "ctx.shadowOffsetX === old");
 17976 ctx.restore();
 17980 </script>
 17982 <!-- [[[ test_2d.state.saverestore.shadowOffsetY.html ]]] -->
 17984 <p>Canvas test: 2d.state.saverestore.shadowOffsetY</p>
 17985 <!-- Testing: save()/restore() works for shadowOffsetY -->
 17986 <canvas id="c565" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 17987 <script>
 17989 function test_2d_state_saverestore_shadowOffsetY() {
 17991 var canvas = document.getElementById('c565');
 17992 var ctx = canvas.getContext('2d');
 17994 // Test that restore() undoes any modifications
 17995 var old = ctx.shadowOffsetY;
 17996 ctx.save();
 17997 ctx.shadowOffsetY = 5;
 17998 ctx.restore();
 17999 ok(ctx.shadowOffsetY === old, "ctx.shadowOffsetY === old");
 18001 // Also test that save() doesn't modify the values
 18002 ctx.shadowOffsetY = 5;
 18003 old = ctx.shadowOffsetY;
 18004     // we're not interested in failures caused by get(set(x)) != x (e.g.
 18005     // from rounding), so compare against d instead of against 5
 18006 ctx.save();
 18007 ok(ctx.shadowOffsetY === old, "ctx.shadowOffsetY === old");
 18008 ctx.restore();
 18012 </script>
 18014 <!-- [[[ test_2d.state.saverestore.stack.html ]]] -->
 18016 <p>Canvas test: 2d.state.saverestore.stack</p>
 18017 <!-- Testing: save()/restore() can be nested as a stack -->
 18018 <canvas id="c566" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 18019 <script>
 18021 function test_2d_state_saverestore_stack() {
 18023 var canvas = document.getElementById('c566');
 18024 var ctx = canvas.getContext('2d');
 18026 ctx.lineWidth = 1;
 18027 ctx.save();
 18028 ctx.lineWidth = 2;
 18029 ctx.save();
 18030 ctx.lineWidth = 3;
 18031 ok(ctx.lineWidth == 3, "ctx.lineWidth == 3");
 18032 ctx.restore();
 18033 ok(ctx.lineWidth == 2, "ctx.lineWidth == 2");
 18034 ctx.restore();
 18035 ok(ctx.lineWidth == 1, "ctx.lineWidth == 1");
 18039 </script>
 18041 <!-- [[[ test_2d.state.saverestore.stackdepth.html ]]] -->
 18043 <p>Canvas test: 2d.state.saverestore.stackdepth</p>
 18044 <!-- Testing: save()/restore() stack depth is not unreasonably limited -->
 18045 <canvas id="c567" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 18046 <script>
 18048 function test_2d_state_saverestore_stackdepth() {
 18050 var canvas = document.getElementById('c567');
 18051 var ctx = canvas.getContext('2d');
 18053 var limit = 512;
 18054 for (var i = 1; i < limit; ++i)
 18056     ctx.save();
 18057     ctx.lineWidth = i;
 18059 for (var i = limit-1; i > 0; --i)
 18061     ok(ctx.lineWidth == i, "ctx.lineWidth == i");
 18062     ctx.restore();
 18067 </script>
 18069 <!-- [[[ test_2d.state.saverestore.strokeStyle.html ]]] -->
 18071 <p>Canvas test: 2d.state.saverestore.strokeStyle</p>
 18072 <!-- Testing: save()/restore() works for strokeStyle -->
 18073 <canvas id="c568" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 18074 <script>
 18076 function test_2d_state_saverestore_strokeStyle() {
 18078 var canvas = document.getElementById('c568');
 18079 var ctx = canvas.getContext('2d');
 18081 // Test that restore() undoes any modifications
 18082 var old = ctx.strokeStyle;
 18083 ctx.save();
 18084 ctx.strokeStyle = "#ff0000";
 18085 ctx.restore();
 18086 ok(ctx.strokeStyle === old, "ctx.strokeStyle === old");
 18088 // Also test that save() doesn't modify the values
 18089 ctx.strokeStyle = "#ff0000";
 18090 old = ctx.strokeStyle;
 18091     // we're not interested in failures caused by get(set(x)) != x (e.g.
 18092     // from rounding), so compare against d instead of against "#ff0000"
 18093 ctx.save();
 18094 ok(ctx.strokeStyle === old, "ctx.strokeStyle === old");
 18095 ctx.restore();
 18099 </script>
 18101 <!-- [[[ test_2d.state.saverestore.transformation.html ]]] -->
 18103 <p>Canvas test: 2d.state.saverestore.transformation</p>
 18104 <!-- Testing: save()/restore() affects the current transformation matrix -->
 18105 <canvas id="c569" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 18106 <script>
 18109 function test_2d_state_saverestore_transformation() {
 18111 var canvas = document.getElementById('c569');
 18112 var ctx = canvas.getContext('2d');
 18114 ctx.fillStyle = '#0f0';
 18115 ctx.fillRect(0, 0, 100, 50);
 18116 ctx.save();
 18117 ctx.translate(200, 0);
 18118 ctx.restore();
 18119 ctx.fillStyle = '#f00';
 18120 ctx.fillRect(-200, 0, 100, 50);
 18121 isPixel(ctx, 50,25, 0,255,0,255, 0);
 18125 </script>
 18127 <!-- [[[ test_2d.state.saverestore.underflow.html ]]] -->
 18129 <p>Canvas test: 2d.state.saverestore.underflow - bug 296821</p>
 18130 <!-- Testing: restore() with an empty stack has no effect -->
 18131 <canvas id="c570" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 18132 <script>
 18134 function test_2d_state_saverestore_underflow() {
 18136 var canvas = document.getElementById('c570');
 18137 var ctx = canvas.getContext('2d');
 18139 for (var i = 0; i < 16; ++i)
 18140     ctx.restore();
 18141 ctx.lineWidth = 0.5;
 18142 ctx.restore();
 18143 ok(ctx.lineWidth == 0.5, "ctx.lineWidth == 0.5");
 18147 </script>
 18149 <!-- [[[ test_2d.strokeRect.basic.html ]]] -->
 18151 <p>Canvas test: 2d.strokeRect.basic</p>
 18152 <canvas id="c571" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
 18153 <script>
 18156 function test_2d_strokeRect_basic() {
 18158 var canvas = document.getElementById('c571');
 18159 var ctx = canvas.getContext('2d');
 18161 ctx.strokeStyle = '#0f0';
 18162 ctx.lineWidth = 50;
 18163 ctx.strokeRect(25, 24, 50, 2);
 18164 isPixel(ctx, 50,25, 0,255,0,255, 0);
 18168 </script>
 18170 <!-- [[[ test_2d.strokeRect.clip.html ]]] -->
 18172 <p>Canvas test: 2d.strokeRect.clip</p>
 18173 <canvas id="c572" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 18174 <script>
 18177 function test_2d_strokeRect_clip() {
 18179 var canvas = document.getElementById('c572');
 18180 var ctx = canvas.getContext('2d');
 18182 ctx.fillStyle = '#0f0';
 18183 ctx.fillRect(0, 0, 100, 50);
 18185 ctx.beginPath();
 18186 ctx.rect(0, 0, 16, 16);
 18187 ctx.clip();
 18189 ctx.strokeStyle = '#f00';
 18190 ctx.lineWidth = 50;
 18191 ctx.strokeRect(0, 0, 100, 50);
 18193 ctx.fillStyle = '#0f0';
 18194 ctx.fillRect(0, 0, 16, 16);
 18196 isPixel(ctx, 50,25, 0,255,0,255, 0);
 18200 </script>
 18202 <!-- [[[ test_2d.strokeRect.globalalpha.html ]]] -->
 18204 <p>Canvas test: 2d.strokeRect.globalalpha</p>
 18205 <canvas id="c573" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
 18206 <script>
 18209 function test_2d_strokeRect_globalalpha() {
 18211 var canvas = document.getElementById('c573');
 18212 var ctx = canvas.getContext('2d');
 18214 ctx.globalAlpha = 0;
 18215 ctx.strokeStyle = '#f00';
 18216 ctx.lineWidth = 50;
 18217 ctx.strokeRect(25, 24, 50, 2);
 18218 isPixel(ctx, 50,25, 0,0,0,0, 0);
 18222 </script>
 18224 <!-- [[[ test_2d.strokeRect.globalcomposite.html ]]] -->
 18226 <p>Canvas test: 2d.strokeRect.globalcomposite</p>
 18227 <canvas id="c574" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
 18228 <script>
 18231 function test_2d_strokeRect_globalcomposite() {
 18233 var canvas = document.getElementById('c574');
 18234 var ctx = canvas.getContext('2d');
 18236 ctx.globalCompositeOperation = 'source-in';
 18237 ctx.strokeStyle = '#f00';
 18238 ctx.lineWidth = 50;
 18239 ctx.strokeRect(25, 24, 50, 2);
 18240 isPixel(ctx, 50,25, 0,0,0,0, 0);
 18244 </script>
 18246 <!-- [[[ test_2d.strokeRect.negative.html ]]] -->
 18248 <p>Canvas test: 2d.strokeRect.negative</p>
 18249 <canvas id="c575" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 18250 <script>
 18253 function test_2d_strokeRect_negative() {
 18255 var canvas = document.getElementById('c575');
 18256 var ctx = canvas.getContext('2d');
 18258 ctx.fillStyle = '#f00';
 18259 ctx.fillRect(0, 0, 100, 50);
 18260 ctx.strokeStyle = '#0f0';
 18261 ctx.lineWidth = 25;
 18262 ctx.strokeRect(12, 12, 26, 1);
 18263 ctx.strokeRect(88, 12, -26, 1);
 18264 ctx.strokeRect(12, 38, 26, -1);
 18265 ctx.strokeRect(88, 38, -26, -1);
 18266 isPixel(ctx, 25,12, 0,255,0,255, 0);
 18267 isPixel(ctx, 75,12, 0,255,0,255, 0);
 18268 isPixel(ctx, 25,37, 0,255,0,255, 0);
 18269 isPixel(ctx, 75,37, 0,255,0,255, 0);
 18273 </script>
 18275 <!-- [[[ test_2d.strokeRect.nonfinite.html ]]] -->
 18277 <p>Canvas test: 2d.strokeRect.nonfinite</p>
 18278 <!-- Testing: strokeRect() with Infinity/NaN is ignored -->
 18279 <canvas id="c576" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 18280 <script>
 18283 function test_2d_strokeRect_nonfinite() {
 18285 var canvas = document.getElementById('c576');
 18286 var ctx = canvas.getContext('2d');
 18288 var _thrown_outer = false;
 18289 try {
 18291 ctx.fillStyle = '#0f0';
 18292 ctx.fillRect(0, 0, 100, 50);
 18294 ctx.strokeStyle = '#f00';
 18295 ctx.lineWidth = 150;
 18296 ctx.strokeRect(Infinity, 0, 100, 50);
 18297 ctx.strokeRect(-Infinity, 0, 100, 50);
 18298 ctx.strokeRect(NaN, 0, 100, 50);
 18299 ctx.strokeRect(0, Infinity, 100, 50);
 18300 ctx.strokeRect(0, -Infinity, 100, 50);
 18301 ctx.strokeRect(0, NaN, 100, 50);
 18302 ctx.strokeRect(0, 0, Infinity, 50);
 18303 ctx.strokeRect(0, 0, -Infinity, 50);
 18304 ctx.strokeRect(0, 0, NaN, 50);
 18305 ctx.strokeRect(0, 0, 100, Infinity);
 18306 ctx.strokeRect(0, 0, 100, -Infinity);
 18307 ctx.strokeRect(0, 0, 100, NaN);
 18308 ctx.strokeRect(Infinity, Infinity, 100, 50);
 18309 ctx.strokeRect(Infinity, Infinity, Infinity, 50);
 18310 ctx.strokeRect(Infinity, Infinity, Infinity, Infinity);
 18311 ctx.strokeRect(Infinity, Infinity, 100, Infinity);
 18312 ctx.strokeRect(Infinity, 0, Infinity, 50);
 18313 ctx.strokeRect(Infinity, 0, Infinity, Infinity);
 18314 ctx.strokeRect(Infinity, 0, 100, Infinity);
 18315 ctx.strokeRect(0, Infinity, Infinity, 50);
 18316 ctx.strokeRect(0, Infinity, Infinity, Infinity);
 18317 ctx.strokeRect(0, Infinity, 100, Infinity);
 18318 ctx.strokeRect(0, 0, Infinity, Infinity);
 18320 isPixel(ctx, 50,25, 0,255,0,255, 0);
 18322 } catch (e) {
 18323     _thrown_outer = true;
 18325 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 18329 </script>
 18331 <!-- [[[ test_2d.strokeRect.path.html ]]] -->
 18333 <p>Canvas test: 2d.strokeRect.path</p>
 18334 <canvas id="c577" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
 18335 <script>
 18338 function test_2d_strokeRect_path() {
 18340 var canvas = document.getElementById('c577');
 18341 var ctx = canvas.getContext('2d');
 18343 ctx.beginPath();
 18344 ctx.rect(0, 0, 100, 50);
 18345 ctx.strokeStyle = '#f00';
 18346 ctx.lineWidth = 5;
 18347 ctx.strokeRect(0, 0, 16, 16);
 18348 ctx.fillStyle = '#0f0';
 18349 ctx.fill();
 18350 isPixel(ctx, 50,25, 0,255,0,255, 0);
 18354 </script>
 18356 <!-- [[[ test_2d.strokeRect.shadow.html ]]] -->
 18358 <p>Canvas test: 2d.strokeRect.shadow</p>
 18359 <canvas id="c578" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 18360 <script>
 18363 function test_2d_strokeRect_shadow() {
 18365 var canvas = document.getElementById('c578');
 18366 var ctx = canvas.getContext('2d');
 18368 ctx.fillStyle = '#0f0';
 18369 ctx.fillRect(0, 0, 100, 50);
 18371 ctx.fillStyle = '#f00';
 18372 ctx.shadowBlur = 0;
 18373 ctx.shadowOffsetX = 0;
 18374 ctx.shadowOffsetY = 50;
 18376 // Shadows are optional, so just test that if they apply to fill() then they apply to strokeRect() too
 18377 ctx.beginPath();
 18378 ctx.rect(0, -50, 100, 50);
 18379 ctx.shadowColor = '#f00';
 18380 ctx.fill();
 18382 ctx.shadowColor = '#0f0';
 18383 ctx.strokeStyle = '#f00';
 18384 ctx.lineWidth = 50;
 18385 ctx.strokeRect(0, -75, 100, 50);
 18387 isPixel(ctx, 50,25, 0,255,0,255, 0);
 18391 </script>
 18393 <!-- [[[ test_2d.strokeRect.transform.html ]]] -->
 18395 <p>Canvas test: 2d.strokeRect.transform</p>
 18396 <canvas id="c579" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
 18397 <script>
 18400 function test_2d_strokeRect_transform() {
 18402 var canvas = document.getElementById('c579');
 18403 var ctx = canvas.getContext('2d');
 18405 ctx.scale(10, 10);
 18406 ctx.translate(0, 5);
 18407 ctx.strokeStyle = '#0f0';
 18408 ctx.lineWidth = 5;
 18409 ctx.strokeRect(2.5, -2.6, 5, 0.2);
 18410 isPixel(ctx, 50,25, 0,255,0,255, 0);
 18414 </script>
 18416 <!-- [[[ test_2d.strokeRect.zero.1.html ]]] -->
 18418 <p>Canvas test: 2d.strokeRect.zero.1</p>
 18419 <canvas id="c580" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
 18420 <script>
 18423 function test_2d_strokeRect_zero_1() {
 18425 var canvas = document.getElementById('c580');
 18426 var ctx = canvas.getContext('2d');
 18428 if (!IsD2DEnabled()) {
 18429     // Disabled for D2D until we can figure out Bug 587554.
 18430     ctx.strokeStyle = '#f00';
 18431     ctx.lineWidth = 250;
 18432     ctx.strokeRect(50, 25, 0, 0);
 18433     isPixel(ctx, 50,25, 0,0,0,0, 0);
 18437 </script>
 18439 <!-- [[[ test_2d.strokeRect.zero.2.html ]]] -->
 18441 <p>Canvas test: 2d.strokeRect.zero.2</p>
 18442 <canvas id="c581" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
 18443 <script>
 18447 function test_2d_strokeRect_zero_2() {
 18449 var canvas = document.getElementById('c581');
 18450 var ctx = canvas.getContext('2d');
 18452 ctx.strokeStyle = '#f00';
 18453 ctx.lineWidth = 250;
 18454 ctx.lineCap = 'round';
 18455 ctx.lineJoin = 'round';
 18456 ctx.strokeRect(50, 25, 0, 0);
 18457 isPixel(ctx, 50,25, 0,0,0,0, 0);
 18461 </script>
 18463 <!-- [[[ test_2d.strokeRect.zero.3.html ]]] -->
 18465 <p>Canvas test: 2d.strokeRect.zero.3</p>
 18466 <canvas id="c582" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
 18467 <script>
 18470 function test_2d_strokeRect_zero_3() {
 18472 var canvas = document.getElementById('c582');
 18473 var ctx = canvas.getContext('2d');
 18475 ctx.strokeStyle = '#0f0';
 18476 ctx.lineWidth = 50;
 18477 ctx.strokeRect(0, 25, 100, 0);
 18478 isPixel(ctx, 50,25, 0,255,0,255, 0);
 18482 </script>
 18484 <!-- [[[ test_2d.strokeRect.zero.4.html ]]] -->
 18486 <p>Canvas test: 2d.strokeRect.zero.4</p>
 18487 <canvas id="c583" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
 18488 <script>
 18491 function test_2d_strokeRect_zero_4() {
 18493 var canvas = document.getElementById('c583');
 18494 var ctx = canvas.getContext('2d');
 18496 ctx.strokeStyle = '#f00';
 18497 ctx.lineWidth = 250;
 18498 ctx.lineCap = 'round';
 18499 ctx.strokeRect(100, 25, 100, 0);
 18500 isPixel(ctx, 50,25, 0,0,0,0, 0);
 18504 </script>
 18506 <!-- [[[ test_2d.strokeRect.zero.5.html ]]] -->
 18508 <p>Canvas test: 2d.strokeRect.zero.5</p>
 18509 <canvas id="c584" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
 18510 <script>
 18513 function test_2d_strokeRect_zero_5() {
 18515 var canvas = document.getElementById('c584');
 18516 var ctx = canvas.getContext('2d');
 18518 ctx.strokeStyle = '#0f0';
 18519 ctx.lineWidth = 250;
 18520 ctx.lineJoin = 'round';
 18521 ctx.strokeRect(100, 25, 100, 0);
 18522 isPixel(ctx, 50,25, 0,255,0,255, 0);
 18526 </script>
 18528 <!-- [[[ test_2d.strokeStyle.default.html ]]] -->
 18530 <p>Canvas test: 2d.strokeStyle.default</p>
 18531 <canvas id="c585" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 18532 <script>
 18534 function test_2d_strokeStyle_default() {
 18536 var canvas = document.getElementById('c585');
 18537 var ctx = canvas.getContext('2d');
 18539 ok(ctx.strokeStyle == '#000000', "ctx.strokeStyle == '#000000'");
 18543 </script>
 18545 <!-- [[[ test_2d.text.align.default.html ]]] -->
 18547 <p>Canvas test: 2d.text.align.default</p>
 18548 <canvas height="50" id="c569a" width="100"><p class="fallback">FAIL (fallback content)</p></canvas>
 18549 <script>
 18551 function test_2d_text_align_default() {
 18553 var canvas = document.getElementById('c569a');
 18554 var ctx = canvas.getContext('2d');
 18556 ok(ctx.textAlign === 'start', "ctx.textAlign === 'start'");
 18560 </script>
 18562 <!-- [[[ test_2d.text.align.invalid.html ]]] -->
 18564 <p>Canvas test: 2d.text.align.invalid</p>
 18565 <canvas height="50" id="c570a" width="100"><p class="fallback">FAIL (fallback content)</p></canvas>
 18566 <script>
 18568 function test_2d_text_align_invalid() {
 18570 var canvas = document.getElementById('c570a');
 18571 var ctx = canvas.getContext('2d');
 18573 ctx.textAlign = 'start';
 18574 ctx.textAlign = 'bogus';
 18575 ok(ctx.textAlign === 'start', "ctx.textAlign === 'start'");
 18577 ctx.textAlign = 'start';
 18578 ctx.textAlign = 'END';
 18579 ok(ctx.textAlign === 'start', "ctx.textAlign === 'start'");
 18581 ctx.textAlign = 'start';
 18582 ctx.textAlign = 'end ';
 18583 ok(ctx.textAlign === 'start', "ctx.textAlign === 'start'");
 18585 ctx.textAlign = 'start';
 18586 ctx.textAlign = 'end\0';
 18587 ok(ctx.textAlign === 'start', "ctx.textAlign === 'start'");
 18591 </script>
 18593 <!-- [[[ test_2d.text.baseline.default.html ]]] -->
 18595 <p>Canvas test: 2d.text.baseline.default</p>
 18596 <canvas height="50" id="c572a" width="100"><p class="fallback">FAIL (fallback content)</p></canvas>
 18597 <script>
 18599 function test_2d_text_baseline_default() {
 18601 var canvas = document.getElementById('c572a');
 18602 var ctx = canvas.getContext('2d');
 18604 ok(ctx.textBaseline === 'alphabetic', "ctx.textBaseline === 'alphabetic'");
 18608 </script>
 18610 <!-- [[[ test_2d.text.baseline.invalid.html ]]] -->
 18612 <p>Canvas test: 2d.text.baseline.invalid</p>
 18613 <canvas height="50" id="c573a" width="100"><p class="fallback">FAIL (fallback content)</p></canvas>
 18614 <script>
 18616 function test_2d_text_baseline_invalid() {
 18618 var canvas = document.getElementById('c573a');
 18619 var ctx = canvas.getContext('2d');
 18621 ctx.textBaseline = 'top';
 18622 ctx.textBaseline = 'bogus';
 18623 ok(ctx.textBaseline === 'top', "ctx.textBaseline === 'top'");
 18625 ctx.textBaseline = 'top';
 18626 ctx.textBaseline = 'MIDDLE';
 18627 ok(ctx.textBaseline === 'top', "ctx.textBaseline === 'top'");
 18629 ctx.textBaseline = 'top';
 18630 ctx.textBaseline = 'middle ';
 18631 ok(ctx.textBaseline === 'top', "ctx.textBaseline === 'top'");
 18633 ctx.textBaseline = 'top';
 18634 ctx.textBaseline = 'middle\0';
 18635 ok(ctx.textBaseline === 'top', "ctx.textBaseline === 'top'");
 18639 </script>
 18641 <!-- [[[ test_2d.transformation.order.html ]]] -->
 18643 <p>Canvas test: 2d.transformation.order</p>
 18644 <!-- Testing: Transformations are applied in the right order -->
 18645 <canvas id="c586" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 18646 <script>
 18649 function test_2d_transformation_order() {
 18651 var canvas = document.getElementById('c586');
 18652 var ctx = canvas.getContext('2d');
 18654 ctx.fillStyle = '#f00';
 18655 ctx.fillRect(0, 0, 100, 50);
 18657 ctx.scale(2, 1);
 18658 ctx.rotate(Math.PI / 2);
 18659 ctx.fillStyle = '#0f0';
 18660 ctx.fillRect(0, -50, 50, 50);
 18661 isPixel(ctx, 75,25, 0,255,0,255, 0);
 18665 </script>
 18667 <!-- [[[ test_2d.transformation.rotate.direction.html ]]] -->
 18669 <p>Canvas test: 2d.transformation.rotate.direction</p>
 18670 <!-- Testing: rotate() is clockwise -->
 18671 <canvas id="c587" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 18672 <script>
 18675 function test_2d_transformation_rotate_direction() {
 18677 var canvas = document.getElementById('c587');
 18678 var ctx = canvas.getContext('2d');
 18680 ctx.fillStyle = '#f00';
 18681 ctx.fillRect(0, 0, 100, 50);
 18683 ctx.rotate(Math.PI / 2);
 18684 ctx.fillStyle = '#0f0';
 18685 ctx.fillRect(0, -100, 50, 100);
 18686 isPixel(ctx, 50,25, 0,255,0,255, 0);
 18690 </script>
 18692 <!-- [[[ test_2d.transformation.rotate.nonfinite.html ]]] -->
 18694 <p>Canvas test: 2d.transformation.rotate.nonfinite</p>
 18695 <!-- Testing: rotate() with Infinity/NaN is ignored -->
 18696 <canvas id="c588" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 18697 <script>
 18700 function test_2d_transformation_rotate_nonfinite() {
 18702 var canvas = document.getElementById('c588');
 18703 var ctx = canvas.getContext('2d');
 18705 var _thrown_outer = false;
 18706 try {
 18708 ctx.fillStyle = '#f00';
 18709 ctx.fillRect(0, 0, 100, 50);
 18711 ctx.translate(100, 10);
 18712 ctx.rotate(Infinity);
 18713 ctx.rotate(-Infinity);
 18714 ctx.rotate(NaN);
 18716 ctx.fillStyle = '#0f0';
 18717 ctx.fillRect(-100, -10, 100, 50);
 18719 isPixel(ctx, 50,25, 0,255,0,255, 0);
 18721 } catch (e) {
 18722     _thrown_outer = true;
 18724 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 18728 </script>
 18730 <!-- [[[ test_2d.transformation.rotate.radians.html ]]] -->
 18732 <p>Canvas test: 2d.transformation.rotate.radians</p>
 18733 <!-- Testing: rotate() uses radians -->
 18734 <canvas id="c589" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 18735 <script>
 18738 function test_2d_transformation_rotate_radians() {
 18740 var canvas = document.getElementById('c589');
 18741 var ctx = canvas.getContext('2d');
 18743 ctx.fillStyle = '#f00';
 18744 ctx.fillRect(0, 0, 100, 50);
 18746 ctx.rotate(Math.PI); // should fail obviously if this is 3.1 degrees
 18747 ctx.fillStyle = '#0f0';
 18748 ctx.fillRect(-100, -50, 100, 50);
 18749 isPixel(ctx, 50,25, 0,255,0,255, 0);
 18753 </script>
 18755 <!-- [[[ test_2d.transformation.rotate.wrap.html ]]] -->
 18757 <p>Canvas test: 2d.transformation.rotate.wrap</p>
 18758 <!-- Testing: rotate() wraps large positive values correctly -->
 18759 <canvas id="c590" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 18760 <script>
 18763 function test_2d_transformation_rotate_wrap() {
 18765 var canvas = document.getElementById('c590');
 18766 var ctx = canvas.getContext('2d');
 18768 ctx.fillStyle = '#f00';
 18769 ctx.fillRect(0, 0, 100, 50);
 18771 ctx.rotate(Math.PI * (1 + 4096)); // == pi (mod 2*pi)
 18772 // We need about pi +/- 0.001 in order to get correct-looking results
 18773 // 32-bit floats can store pi*4097 with precision 2^-10, so that should
 18774 // be safe enough on reasonable implementations
 18775 ctx.fillStyle = '#0f0';
 18776 ctx.fillRect(-100, -50, 100, 50);
 18777 isPixel(ctx, 50,25, 0,255,0,255, 0);
 18778 isPixel(ctx, 98,2, 0,255,0,255, 0);
 18779 isPixel(ctx, 98,47, 0,255,0,255, 0);
 18783 </script>
 18785 <!-- [[[ test_2d.transformation.rotate.wrapnegative.html ]]] -->
 18787 <p>Canvas test: 2d.transformation.rotate.wrapnegative</p>
 18788 <!-- Testing: rotate() wraps large negative values correctly -->
 18789 <canvas id="c591" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 18790 <script>
 18793 function test_2d_transformation_rotate_wrapnegative() {
 18795 var canvas = document.getElementById('c591');
 18796 var ctx = canvas.getContext('2d');
 18798 ctx.fillStyle = '#f00';
 18799 ctx.fillRect(0, 0, 100, 50);
 18801 ctx.rotate(-Math.PI * (1 + 4096));
 18802 ctx.fillStyle = '#0f0';
 18803 ctx.fillRect(-100, -50, 100, 50);
 18804 isPixel(ctx, 50,25, 0,255,0,255, 0);
 18805 isPixel(ctx, 98,2, 0,255,0,255, 0);
 18806 isPixel(ctx, 98,47, 0,255,0,255, 0);
 18810 </script>
 18812 <!-- [[[ test_2d.transformation.rotate.zero.html ]]] -->
 18814 <p>Canvas test: 2d.transformation.rotate.zero</p>
 18815 <!-- Testing: rotate() by 0 does nothing -->
 18816 <canvas id="c592" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 18817 <script>
 18820 function test_2d_transformation_rotate_zero() {
 18822 var canvas = document.getElementById('c592');
 18823 var ctx = canvas.getContext('2d');
 18825 ctx.fillStyle = '#f00';
 18826 ctx.fillRect(0, 0, 100, 50);
 18828 ctx.rotate(0);
 18829 ctx.fillStyle = '#0f0';
 18830 ctx.fillRect(0, 0, 100, 50);
 18831 isPixel(ctx, 50,25, 0,255,0,255, 0);
 18835 </script>
 18837 <!-- [[[ test_2d.transformation.scale.basic.html ]]] -->
 18839 <p>Canvas test: 2d.transformation.scale.basic</p>
 18840 <!-- Testing: scale() works -->
 18841 <canvas id="c593" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 18842 <script>
 18845 function test_2d_transformation_scale_basic() {
 18847 var canvas = document.getElementById('c593');
 18848 var ctx = canvas.getContext('2d');
 18850 ctx.fillStyle = '#f00';
 18851 ctx.fillRect(0, 0, 100, 50);
 18853 ctx.scale(2, 4);
 18854 ctx.fillStyle = '#0f0';
 18855 ctx.fillRect(0, 0, 50, 12.5);
 18856 isPixel(ctx, 90,40, 0,255,0,255, 0);
 18860 </script>
 18862 <!-- [[[ test_2d.transformation.scale.large.html ]]] -->
 18864 <p>Canvas test: 2d.transformation.scale.large</p>
 18865 <!-- Testing: scale() with large scale factors works -->
 18866 <canvas id="c594" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 18867 <script>
 18870 function test_2d_transformation_scale_large() {
 18872 var canvas = document.getElementById('c594');
 18873 var ctx = canvas.getContext('2d');
 18875 ctx.fillStyle = '#f00';
 18876 ctx.fillRect(0, 0, 100, 50);
 18878 ctx.scale(1e5, 1e5);
 18879 ctx.fillStyle = '#0f0';
 18880 ctx.fillRect(0, 0, 1, 1);
 18881 isPixel(ctx, 50,25, 0,255,0,255, 0);
 18885 </script>
 18887 <!-- [[[ test_2d.transformation.scale.multiple.html ]]] -->
 18889 <p>Canvas test: 2d.transformation.scale.multiple</p>
 18890 <!-- Testing: Multiple scale()s combine -->
 18891 <canvas id="c595" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 18892 <script>
 18895 function test_2d_transformation_scale_multiple() {
 18897 var canvas = document.getElementById('c595');
 18898 var ctx = canvas.getContext('2d');
 18900 ctx.fillStyle = '#f00';
 18901 ctx.fillRect(0, 0, 100, 50);
 18903 ctx.scale(Math.sqrt(2), Math.sqrt(2));
 18904 ctx.scale(Math.sqrt(2), Math.sqrt(2));
 18905 ctx.fillStyle = '#0f0';
 18906 ctx.fillRect(0, 0, 50, 25);
 18907 isPixel(ctx, 90,40, 0,255,0,255, 0);
 18911 </script>
 18913 <!-- [[[ test_2d.transformation.scale.negative.html ]]] -->
 18915 <p>Canvas test: 2d.transformation.scale.negative</p>
 18916 <!-- Testing: scale() with negative scale factors works -->
 18917 <canvas id="c596" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 18918 <script>
 18921 function test_2d_transformation_scale_negative() {
 18923 var canvas = document.getElementById('c596');
 18924 var ctx = canvas.getContext('2d');
 18926 ctx.fillStyle = '#f00';
 18927 ctx.fillRect(0, 0, 100, 50);
 18929 ctx.save();
 18930 ctx.scale(-1, 1);
 18931 ctx.fillStyle = '#0f0';
 18932 ctx.fillRect(-50, 0, 50, 50);
 18933 ctx.restore();
 18935 ctx.save();
 18936 ctx.scale(1, -1);
 18937 ctx.fillStyle = '#0f0';
 18938 ctx.fillRect(50, -50, 50, 50);
 18939 ctx.restore();
 18940 isPixel(ctx, 25,25, 0,255,0,255, 0);
 18941 isPixel(ctx, 75,25, 0,255,0,255, 0);
 18945 </script>
 18947 <!-- [[[ test_2d.transformation.scale.nonfinite.html ]]] -->
 18949 <p>Canvas test: 2d.transformation.scale.nonfinite</p>
 18950 <!-- Testing: scale() with Infinity/NaN is ignored -->
 18951 <canvas id="c597" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 18952 <script>
 18955 function test_2d_transformation_scale_nonfinite() {
 18957 var canvas = document.getElementById('c597');
 18958 var ctx = canvas.getContext('2d');
 18960 var _thrown_outer = false;
 18961 try {
 18963 ctx.fillStyle = '#f00';
 18964 ctx.fillRect(0, 0, 100, 50);
 18966 ctx.translate(100, 10);
 18967 ctx.scale(Infinity, 0.1);
 18968 ctx.scale(-Infinity, 0.1);
 18969 ctx.scale(NaN, 0.1);
 18970 ctx.scale(0.1, Infinity);
 18971 ctx.scale(0.1, -Infinity);
 18972 ctx.scale(0.1, NaN);
 18973 ctx.scale(Infinity, Infinity);
 18975 ctx.fillStyle = '#0f0';
 18976 ctx.fillRect(-100, -10, 100, 50);
 18978 isPixel(ctx, 50,25, 0,255,0,255, 0);
 18980 } catch (e) {
 18981     _thrown_outer = true;
 18983 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 18987 </script>
 18989 <!-- [[[ test_2d.transformation.scale.zero.html ]]] -->
 18991 <p>Canvas test: 2d.transformation.scale.zero</p>
 18992 <!-- Testing: scale() with a scale factor of zero works -->
 18993 <canvas id="c598" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 18994 <script>
 18997 function test_2d_transformation_scale_zero() {
 18999 var canvas = document.getElementById('c598');
 19000 var ctx = canvas.getContext('2d');
 19002 ctx.fillStyle = '#0f0';
 19003 ctx.fillRect(0, 0, 100, 50);
 19005 ctx.save();
 19006 ctx.translate(50, 0);
 19007 ctx.scale(0, 1);
 19008 ctx.fillStyle = '#f00';
 19009 ctx.fillRect(0, 0, 100, 50);
 19010 ctx.restore();
 19012 ctx.save();
 19013 ctx.translate(0, 25);
 19014 ctx.scale(1, 0);
 19015 ctx.fillStyle = '#f00';
 19016 ctx.fillRect(0, 0, 100, 50);
 19017 ctx.restore();
 19018 isPixel(ctx, 50,25, 0,255,0,255, 0);
 19022 </script>
 19024 <!-- [[[ test_2d.transformation.setTransform.multiple.html ]]] -->
 19026 <p>Canvas test: 2d.transformation.setTransform.multiple</p>
 19027 <canvas id="c599" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 19028 <script>
 19031 function test_2d_transformation_setTransform_multiple() {
 19033 var canvas = document.getElementById('c599');
 19034 var ctx = canvas.getContext('2d');
 19036 ctx.fillStyle = '#f00';
 19037 ctx.fillRect(0, 0, 100, 50);
 19039 ctx.setTransform(1/2,0, 0,1/2, 0,0);
 19040 ctx.setTransform(2,0, 0,2, 0,0);
 19041 ctx.fillStyle = '#0f0';
 19042 ctx.fillRect(0, 0, 50, 25);
 19043 isPixel(ctx, 75,35, 0,255,0,255, 0);
 19047 </script>
 19049 <!-- [[[ test_2d.transformation.setTransform.nonfinite.html ]]] -->
 19051 <p>Canvas test: 2d.transformation.setTransform.nonfinite</p>
 19052 <!-- Testing: setTransform() with Infinity/NaN is ignored -->
 19053 <canvas id="c600" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 19054 <script>
 19057 function test_2d_transformation_setTransform_nonfinite() {
 19059 var canvas = document.getElementById('c600');
 19060 var ctx = canvas.getContext('2d');
 19062 var _thrown_outer = false;
 19063 try {
 19065 ctx.fillStyle = '#f00';
 19066 ctx.fillRect(0, 0, 100, 50);
 19068 ctx.translate(100, 10);
 19069 ctx.setTransform(Infinity, 0, 0, 0, 0, 0);
 19070 ctx.setTransform(-Infinity, 0, 0, 0, 0, 0);
 19071 ctx.setTransform(NaN, 0, 0, 0, 0, 0);
 19072 ctx.setTransform(0, Infinity, 0, 0, 0, 0);
 19073 ctx.setTransform(0, -Infinity, 0, 0, 0, 0);
 19074 ctx.setTransform(0, NaN, 0, 0, 0, 0);
 19075 ctx.setTransform(0, 0, Infinity, 0, 0, 0);
 19076 ctx.setTransform(0, 0, -Infinity, 0, 0, 0);
 19077 ctx.setTransform(0, 0, NaN, 0, 0, 0);
 19078 ctx.setTransform(0, 0, 0, Infinity, 0, 0);
 19079 ctx.setTransform(0, 0, 0, -Infinity, 0, 0);
 19080 ctx.setTransform(0, 0, 0, NaN, 0, 0);
 19081 ctx.setTransform(0, 0, 0, 0, Infinity, 0);
 19082 ctx.setTransform(0, 0, 0, 0, -Infinity, 0);
 19083 ctx.setTransform(0, 0, 0, 0, NaN, 0);
 19084 ctx.setTransform(0, 0, 0, 0, 0, Infinity);
 19085 ctx.setTransform(0, 0, 0, 0, 0, -Infinity);
 19086 ctx.setTransform(0, 0, 0, 0, 0, NaN);
 19087 ctx.setTransform(Infinity, Infinity, 0, 0, 0, 0);
 19088 ctx.setTransform(Infinity, Infinity, Infinity, 0, 0, 0);
 19089 ctx.setTransform(Infinity, Infinity, Infinity, Infinity, 0, 0);
 19090 ctx.setTransform(Infinity, Infinity, Infinity, Infinity, Infinity, 0);
 19091 ctx.setTransform(Infinity, Infinity, Infinity, Infinity, Infinity, Infinity);
 19092 ctx.setTransform(Infinity, Infinity, Infinity, Infinity, 0, Infinity);
 19093 ctx.setTransform(Infinity, Infinity, Infinity, 0, Infinity, 0);
 19094 ctx.setTransform(Infinity, Infinity, Infinity, 0, Infinity, Infinity);
 19095 ctx.setTransform(Infinity, Infinity, Infinity, 0, 0, Infinity);
 19096 ctx.setTransform(Infinity, Infinity, 0, Infinity, 0, 0);
 19097 ctx.setTransform(Infinity, Infinity, 0, Infinity, Infinity, 0);
 19098 ctx.setTransform(Infinity, Infinity, 0, Infinity, Infinity, Infinity);
 19099 ctx.setTransform(Infinity, Infinity, 0, Infinity, 0, Infinity);
 19100 ctx.setTransform(Infinity, Infinity, 0, 0, Infinity, 0);
 19101 ctx.setTransform(Infinity, Infinity, 0, 0, Infinity, Infinity);
 19102 ctx.setTransform(Infinity, Infinity, 0, 0, 0, Infinity);
 19103 ctx.setTransform(Infinity, 0, Infinity, 0, 0, 0);
 19104 ctx.setTransform(Infinity, 0, Infinity, Infinity, 0, 0);
 19105 ctx.setTransform(Infinity, 0, Infinity, Infinity, Infinity, 0);
 19106 ctx.setTransform(Infinity, 0, Infinity, Infinity, Infinity, Infinity);
 19107 ctx.setTransform(Infinity, 0, Infinity, Infinity, 0, Infinity);
 19108 ctx.setTransform(Infinity, 0, Infinity, 0, Infinity, 0);
 19109 ctx.setTransform(Infinity, 0, Infinity, 0, Infinity, Infinity);
 19110 ctx.setTransform(Infinity, 0, Infinity, 0, 0, Infinity);
 19111 ctx.setTransform(Infinity, 0, 0, Infinity, 0, 0);
 19112 ctx.setTransform(Infinity, 0, 0, Infinity, Infinity, 0);
 19113 ctx.setTransform(Infinity, 0, 0, Infinity, Infinity, Infinity);
 19114 ctx.setTransform(Infinity, 0, 0, Infinity, 0, Infinity);
 19115 ctx.setTransform(Infinity, 0, 0, 0, Infinity, 0);
 19116 ctx.setTransform(Infinity, 0, 0, 0, Infinity, Infinity);
 19117 ctx.setTransform(Infinity, 0, 0, 0, 0, Infinity);
 19118 ctx.setTransform(0, Infinity, Infinity, 0, 0, 0);
 19119 ctx.setTransform(0, Infinity, Infinity, Infinity, 0, 0);
 19120 ctx.setTransform(0, Infinity, Infinity, Infinity, Infinity, 0);
 19121 ctx.setTransform(0, Infinity, Infinity, Infinity, Infinity, Infinity);
 19122 ctx.setTransform(0, Infinity, Infinity, Infinity, 0, Infinity);
 19123 ctx.setTransform(0, Infinity, Infinity, 0, Infinity, 0);
 19124 ctx.setTransform(0, Infinity, Infinity, 0, Infinity, Infinity);
 19125 ctx.setTransform(0, Infinity, Infinity, 0, 0, Infinity);
 19126 ctx.setTransform(0, Infinity, 0, Infinity, 0, 0);
 19127 ctx.setTransform(0, Infinity, 0, Infinity, Infinity, 0);
 19128 ctx.setTransform(0, Infinity, 0, Infinity, Infinity, Infinity);
 19129 ctx.setTransform(0, Infinity, 0, Infinity, 0, Infinity);
 19130 ctx.setTransform(0, Infinity, 0, 0, Infinity, 0);
 19131 ctx.setTransform(0, Infinity, 0, 0, Infinity, Infinity);
 19132 ctx.setTransform(0, Infinity, 0, 0, 0, Infinity);
 19133 ctx.setTransform(0, 0, Infinity, Infinity, 0, 0);
 19134 ctx.setTransform(0, 0, Infinity, Infinity, Infinity, 0);
 19135 ctx.setTransform(0, 0, Infinity, Infinity, Infinity, Infinity);
 19136 ctx.setTransform(0, 0, Infinity, Infinity, 0, Infinity);
 19137 ctx.setTransform(0, 0, Infinity, 0, Infinity, 0);
 19138 ctx.setTransform(0, 0, Infinity, 0, Infinity, Infinity);
 19139 ctx.setTransform(0, 0, Infinity, 0, 0, Infinity);
 19140 ctx.setTransform(0, 0, 0, Infinity, Infinity, 0);
 19141 ctx.setTransform(0, 0, 0, Infinity, Infinity, Infinity);
 19142 ctx.setTransform(0, 0, 0, Infinity, 0, Infinity);
 19143 ctx.setTransform(0, 0, 0, 0, Infinity, Infinity);
 19145 ctx.fillStyle = '#0f0';
 19146 ctx.fillRect(-100, -10, 100, 50);
 19148 isPixel(ctx, 50,25, 0,255,0,255, 0);
 19150 } catch (e) {
 19151     _thrown_outer = true;
 19153 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 19157 </script>
 19159 <!-- [[[ test_2d.transformation.setTransform.skewed.html ]]] -->
 19161 <p>Canvas test: 2d.transformation.setTransform.skewed</p>
 19162 <canvas id="c601" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 19163 <script>
 19166 function test_2d_transformation_setTransform_skewed() {
 19168 var canvas = document.getElementById('c601');
 19169 var ctx = canvas.getContext('2d');
 19171 // Create green with a red square ring inside it
 19172 ctx.fillStyle = '#0f0';
 19173 ctx.fillRect(0, 0, 100, 50);
 19174 ctx.fillStyle = '#f00';
 19175 ctx.fillRect(20, 10, 60, 30);
 19176 ctx.fillStyle = '#0f0';
 19177 ctx.fillRect(40, 20, 20, 10);
 19179 // Draw a skewed shape to fill that gap, to make sure it is aligned correctly
 19180 ctx.setTransform(1,4, 2,3, 5,6);
 19181 // Post-transform coordinates:
 19182 //   [[20,10],[80,10],[80,40],[20,40],[20,10],[40,20],[40,30],[60,30],[60,20],[40,20],[20,10]];
 19183 // Hence pre-transform coordinates:
 19184 var pts=[[-7.4,11.2],[-43.4,59.2],[-31.4,53.2],[4.6,5.2],[-7.4,11.2],
 19185          [-15.4,25.2],[-11.4,23.2],[-23.4,39.2],[-27.4,41.2],[-15.4,25.2],
 19186          [-7.4,11.2]];
 19187 ctx.beginPath();
 19188 ctx.moveTo(pts[0][0], pts[0][1]);
 19189 for (var i = 0; i < pts.length; ++i)
 19190     ctx.lineTo(pts[i][0], pts[i][1]);
 19191 ctx.fill();
 19192 isPixel(ctx, 21,11, 0,255,0,255, 0);
 19193 isPixel(ctx, 79,11, 0,255,0,255, 0);
 19194 isPixel(ctx, 21,39, 0,255,0,255, 0);
 19195 isPixel(ctx, 79,39, 0,255,0,255, 0);
 19196 isPixel(ctx, 39,19, 0,255,0,255, IsAzureSkia() ? 1 : 0);
 19197 isPixel(ctx, 61,19, 0,255,0,255, 0);
 19198 isPixel(ctx, 39,31, 0,255,0,255, 0);
 19199 isPixel(ctx, 61,31, 0,255,0,255, 0);
 19203 </script>
 19205 <!-- [[[ test_2d.transformation.transform.identity.html ]]] -->
 19207 <p>Canvas test: 2d.transformation.transform.identity</p>
 19208 <!-- Testing: transform() with the identity matrix does nothing -->
 19209 <canvas id="c602" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 19210 <script>
 19213 function test_2d_transformation_transform_identity() {
 19215 var canvas = document.getElementById('c602');
 19216 var ctx = canvas.getContext('2d');
 19218 ctx.fillStyle = '#f00';
 19219 ctx.fillRect(0, 0, 100, 50);
 19221 ctx.transform(1,0, 0,1, 0,0);
 19222 ctx.fillStyle = '#0f0';
 19223 ctx.fillRect(0, 0, 100, 50);
 19224 isPixel(ctx, 50,25, 0,255,0,255, 0);
 19228 </script>
 19230 <!-- [[[ test_2d.transformation.transform.multiply.html ]]] -->
 19232 <p>Canvas test: 2d.transformation.transform.multiply</p>
 19233 <!-- Testing: transform() multiplies the CTM -->
 19234 <canvas id="c603" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 19235 <script>
 19238 function test_2d_transformation_transform_multiply() {
 19240 var canvas = document.getElementById('c603');
 19241 var ctx = canvas.getContext('2d');
 19243 ctx.fillStyle = '#f00';
 19244 ctx.fillRect(0, 0, 100, 50);
 19246 ctx.transform(1,2, 3,4, 5,6);
 19247 ctx.transform(-2,1, 3/2,-1/2, 1,-2);
 19248 ctx.fillStyle = '#0f0';
 19249 ctx.fillRect(0, 0, 100, 50);
 19250 isPixel(ctx, 50,25, 0,255,0,255, 0);
 19254 </script>
 19256 <!-- [[[ test_2d.transformation.transform.nonfinite.html ]]] -->
 19258 <p>Canvas test: 2d.transformation.transform.nonfinite</p>
 19259 <!-- Testing: transform() with Infinity/NaN is ignored -->
 19260 <canvas id="c604" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 19261 <script>
 19264 function test_2d_transformation_transform_nonfinite() {
 19266 var canvas = document.getElementById('c604');
 19267 var ctx = canvas.getContext('2d');
 19269 var _thrown_outer = false;
 19270 try {
 19272 ctx.fillStyle = '#f00';
 19273 ctx.fillRect(0, 0, 100, 50);
 19275 ctx.translate(100, 10);
 19276 ctx.transform(Infinity, 0, 0, 0, 0, 0);
 19277 ctx.transform(-Infinity, 0, 0, 0, 0, 0);
 19278 ctx.transform(NaN, 0, 0, 0, 0, 0);
 19279 ctx.transform(0, Infinity, 0, 0, 0, 0);
 19280 ctx.transform(0, -Infinity, 0, 0, 0, 0);
 19281 ctx.transform(0, NaN, 0, 0, 0, 0);
 19282 ctx.transform(0, 0, Infinity, 0, 0, 0);
 19283 ctx.transform(0, 0, -Infinity, 0, 0, 0);
 19284 ctx.transform(0, 0, NaN, 0, 0, 0);
 19285 ctx.transform(0, 0, 0, Infinity, 0, 0);
 19286 ctx.transform(0, 0, 0, -Infinity, 0, 0);
 19287 ctx.transform(0, 0, 0, NaN, 0, 0);
 19288 ctx.transform(0, 0, 0, 0, Infinity, 0);
 19289 ctx.transform(0, 0, 0, 0, -Infinity, 0);
 19290 ctx.transform(0, 0, 0, 0, NaN, 0);
 19291 ctx.transform(0, 0, 0, 0, 0, Infinity);
 19292 ctx.transform(0, 0, 0, 0, 0, -Infinity);
 19293 ctx.transform(0, 0, 0, 0, 0, NaN);
 19294 ctx.transform(Infinity, Infinity, 0, 0, 0, 0);
 19295 ctx.transform(Infinity, Infinity, Infinity, 0, 0, 0);
 19296 ctx.transform(Infinity, Infinity, Infinity, Infinity, 0, 0);
 19297 ctx.transform(Infinity, Infinity, Infinity, Infinity, Infinity, 0);
 19298 ctx.transform(Infinity, Infinity, Infinity, Infinity, Infinity, Infinity);
 19299 ctx.transform(Infinity, Infinity, Infinity, Infinity, 0, Infinity);
 19300 ctx.transform(Infinity, Infinity, Infinity, 0, Infinity, 0);
 19301 ctx.transform(Infinity, Infinity, Infinity, 0, Infinity, Infinity);
 19302 ctx.transform(Infinity, Infinity, Infinity, 0, 0, Infinity);
 19303 ctx.transform(Infinity, Infinity, 0, Infinity, 0, 0);
 19304 ctx.transform(Infinity, Infinity, 0, Infinity, Infinity, 0);
 19305 ctx.transform(Infinity, Infinity, 0, Infinity, Infinity, Infinity);
 19306 ctx.transform(Infinity, Infinity, 0, Infinity, 0, Infinity);
 19307 ctx.transform(Infinity, Infinity, 0, 0, Infinity, 0);
 19308 ctx.transform(Infinity, Infinity, 0, 0, Infinity, Infinity);
 19309 ctx.transform(Infinity, Infinity, 0, 0, 0, Infinity);
 19310 ctx.transform(Infinity, 0, Infinity, 0, 0, 0);
 19311 ctx.transform(Infinity, 0, Infinity, Infinity, 0, 0);
 19312 ctx.transform(Infinity, 0, Infinity, Infinity, Infinity, 0);
 19313 ctx.transform(Infinity, 0, Infinity, Infinity, Infinity, Infinity);
 19314 ctx.transform(Infinity, 0, Infinity, Infinity, 0, Infinity);
 19315 ctx.transform(Infinity, 0, Infinity, 0, Infinity, 0);
 19316 ctx.transform(Infinity, 0, Infinity, 0, Infinity, Infinity);
 19317 ctx.transform(Infinity, 0, Infinity, 0, 0, Infinity);
 19318 ctx.transform(Infinity, 0, 0, Infinity, 0, 0);
 19319 ctx.transform(Infinity, 0, 0, Infinity, Infinity, 0);
 19320 ctx.transform(Infinity, 0, 0, Infinity, Infinity, Infinity);
 19321 ctx.transform(Infinity, 0, 0, Infinity, 0, Infinity);
 19322 ctx.transform(Infinity, 0, 0, 0, Infinity, 0);
 19323 ctx.transform(Infinity, 0, 0, 0, Infinity, Infinity);
 19324 ctx.transform(Infinity, 0, 0, 0, 0, Infinity);
 19325 ctx.transform(0, Infinity, Infinity, 0, 0, 0);
 19326 ctx.transform(0, Infinity, Infinity, Infinity, 0, 0);
 19327 ctx.transform(0, Infinity, Infinity, Infinity, Infinity, 0);
 19328 ctx.transform(0, Infinity, Infinity, Infinity, Infinity, Infinity);
 19329 ctx.transform(0, Infinity, Infinity, Infinity, 0, Infinity);
 19330 ctx.transform(0, Infinity, Infinity, 0, Infinity, 0);
 19331 ctx.transform(0, Infinity, Infinity, 0, Infinity, Infinity);
 19332 ctx.transform(0, Infinity, Infinity, 0, 0, Infinity);
 19333 ctx.transform(0, Infinity, 0, Infinity, 0, 0);
 19334 ctx.transform(0, Infinity, 0, Infinity, Infinity, 0);
 19335 ctx.transform(0, Infinity, 0, Infinity, Infinity, Infinity);
 19336 ctx.transform(0, Infinity, 0, Infinity, 0, Infinity);
 19337 ctx.transform(0, Infinity, 0, 0, Infinity, 0);
 19338 ctx.transform(0, Infinity, 0, 0, Infinity, Infinity);
 19339 ctx.transform(0, Infinity, 0, 0, 0, Infinity);
 19340 ctx.transform(0, 0, Infinity, Infinity, 0, 0);
 19341 ctx.transform(0, 0, Infinity, Infinity, Infinity, 0);
 19342 ctx.transform(0, 0, Infinity, Infinity, Infinity, Infinity);
 19343 ctx.transform(0, 0, Infinity, Infinity, 0, Infinity);
 19344 ctx.transform(0, 0, Infinity, 0, Infinity, 0);
 19345 ctx.transform(0, 0, Infinity, 0, Infinity, Infinity);
 19346 ctx.transform(0, 0, Infinity, 0, 0, Infinity);
 19347 ctx.transform(0, 0, 0, Infinity, Infinity, 0);
 19348 ctx.transform(0, 0, 0, Infinity, Infinity, Infinity);
 19349 ctx.transform(0, 0, 0, Infinity, 0, Infinity);
 19350 ctx.transform(0, 0, 0, 0, Infinity, Infinity);
 19352 ctx.fillStyle = '#0f0';
 19353 ctx.fillRect(-100, -10, 100, 50);
 19355 isPixel(ctx, 50,25, 0,255,0,255, 0);
 19357 } catch (e) {
 19358     _thrown_outer = true;
 19360 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 19364 </script>
 19366 <!-- [[[ test_2d.transformation.transform.skewed.html ]]] -->
 19368 <p>Canvas test: 2d.transformation.transform.skewed</p>
 19369 <!-- Testing: transform() with skewy matrix transforms correctly -->
 19370 <canvas id="c605" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 19371 <script>
 19374 function test_2d_transformation_transform_skewed() {
 19376 var canvas = document.getElementById('c605');
 19377 var ctx = canvas.getContext('2d');
 19379 // Create green with a red square ring inside it
 19380 ctx.fillStyle = '#0f0';
 19381 ctx.fillRect(0, 0, 100, 50);
 19382 ctx.fillStyle = '#f00';
 19383 ctx.fillRect(20, 10, 60, 30);
 19384 ctx.fillStyle = '#0f0';
 19385 ctx.fillRect(40, 20, 20, 10);
 19387 // Draw a skewed shape to fill that gap, to make sure it is aligned correctly
 19388 ctx.transform(1,4, 2,3, 5,6);
 19389 // Post-transform coordinates:
 19390 //   [[20,10],[80,10],[80,40],[20,40],[20,10],[40,20],[40,30],[60,30],[60,20],[40,20],[20,10]];
 19391 // Hence pre-transform coordinates:
 19392 var pts=[[-7.4,11.2],[-43.4,59.2],[-31.4,53.2],[4.6,5.2],[-7.4,11.2],
 19393          [-15.4,25.2],[-11.4,23.2],[-23.4,39.2],[-27.4,41.2],[-15.4,25.2],
 19394          [-7.4,11.2]];
 19395 ctx.beginPath();
 19396 ctx.moveTo(pts[0][0], pts[0][1]);
 19397 for (var i = 0; i < pts.length; ++i)
 19398     ctx.lineTo(pts[i][0], pts[i][1]);
 19399 ctx.fill();
 19400 isPixel(ctx, 21,11, 0,255,0,255, 0);
 19401 isPixel(ctx, 79,11, 0,255,0,255, 0);
 19402 isPixel(ctx, 21,39, 0,255,0,255, 0);
 19403 isPixel(ctx, 79,39, 0,255,0,255, 0);
 19404 isPixel(ctx, 39,19, 0,255,0,255, IsAzureSkia() ? 1 : 0);
 19405 isPixel(ctx, 61,19, 0,255,0,255, 0);
 19406 isPixel(ctx, 39,31, 0,255,0,255, 0);
 19407 isPixel(ctx, 61,31, 0,255,0,255, 0);
 19411 </script>
 19413 <!-- [[[ test_2d.transformation.translate.basic.html ]]] -->
 19415 <p>Canvas test: 2d.transformation.translate.basic</p>
 19416 <!-- Testing: translate() works -->
 19417 <canvas id="c606" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 19418 <script>
 19421 function test_2d_transformation_translate_basic() {
 19423 var canvas = document.getElementById('c606');
 19424 var ctx = canvas.getContext('2d');
 19426 ctx.fillStyle = '#f00';
 19427 ctx.fillRect(0, 0, 100, 50);
 19429 ctx.translate(100, 50);
 19430 ctx.fillStyle = '#0f0';
 19431 ctx.fillRect(-100, -50, 100, 50);
 19432 isPixel(ctx, 90,40, 0,255,0,255, 0);
 19436 </script>
 19438 <!-- [[[ test_2d.transformation.translate.nonfinite.html ]]] -->
 19440 <p>Canvas test: 2d.transformation.translate.nonfinite</p>
 19441 <!-- Testing: translate() with Infinity/NaN is ignored -->
 19442 <canvas id="c607" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 19443 <script>
 19446 function test_2d_transformation_translate_nonfinite() {
 19448 var canvas = document.getElementById('c607');
 19449 var ctx = canvas.getContext('2d');
 19451 var _thrown_outer = false;
 19452 try {
 19454 ctx.fillStyle = '#f00';
 19455 ctx.fillRect(0, 0, 100, 50);
 19457 ctx.translate(100, 10);
 19458 ctx.translate(Infinity, 0.1);
 19459 ctx.translate(-Infinity, 0.1);
 19460 ctx.translate(NaN, 0.1);
 19461 ctx.translate(0.1, Infinity);
 19462 ctx.translate(0.1, -Infinity);
 19463 ctx.translate(0.1, NaN);
 19464 ctx.translate(Infinity, Infinity);
 19466 ctx.fillStyle = '#0f0';
 19467 ctx.fillRect(-100, -10, 100, 50);
 19469 isPixel(ctx, 50,25, 0,255,0,255, 0);
 19471 } catch (e) {
 19472     _thrown_outer = true;
 19474 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 19478 </script>
 19480 <!-- [[[ test_2d.type.exists.html ]]] -->
 19482 <p>Canvas test: 2d.type.exists</p>
 19483 <!-- Testing: The 2D context interface is a property of 'window' -->
 19484 <canvas id="c609" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 19485 <script>
 19487 function test_2d_type_exists() {
 19489 var canvas = document.getElementById('c609');
 19490 var ctx = canvas.getContext('2d');
 19492 ok(window.CanvasRenderingContext2D, "window.CanvasRenderingContext2D");
 19496 </script>
 19498 <!-- [[[ test_2d.type.extend.html ]]] -->
 19500 <p>Canvas test: 2d.type.extend</p>
 19501 <!-- Testing: Interface methods can be added -->
 19502 <canvas id="c610" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 19503 <script>
 19506 function test_2d_type_extend() {
 19508 var canvas = document.getElementById('c610');
 19509 var ctx = canvas.getContext('2d');
 19511 window.CanvasRenderingContext2D.prototype.fillRectGreen = function (x, y, w, h)
 19513     this.fillStyle = '#0f0';
 19514     this.fillRect(x, y, w, h);
 19515 };
 19516 ctx.fillStyle = '#f00';
 19517 ctx.fillRectGreen(0, 0, 100, 50);
 19518 isPixel(ctx, 50,25, 0,255,0,255, 0);
 19522 </script>
 19524 <!-- [[[ test_2d.type.prototype.html ]]] -->
 19526 <p>Canvas test: 2d.type.prototype</p>
 19527 <!-- Testing: window.CanvasRenderingContext2D.prototype is { DontDelete, ReadOnly }, and its methods are not -->
 19528 <canvas id="c611" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 19529 <script>
 19531 function test_2d_type_prototype() {
 19533 var canvas = document.getElementById('c611');
 19534 var ctx = canvas.getContext('2d');
 19536 var fill = window.CanvasRenderingContext2D.prototype.fill;
 19537 ok(window.CanvasRenderingContext2D.prototype, "window.CanvasRenderingContext2D.prototype");
 19538 ok(window.CanvasRenderingContext2D.prototype.fill, "window.CanvasRenderingContext2D.prototype.fill");
 19539 window.CanvasRenderingContext2D.prototype = null;
 19540 ok(window.CanvasRenderingContext2D.prototype, "window.CanvasRenderingContext2D.prototype");
 19541 delete window.CanvasRenderingContext2D.prototype;
 19542 ok(window.CanvasRenderingContext2D.prototype, "window.CanvasRenderingContext2D.prototype");
 19543 window.CanvasRenderingContext2D.prototype.fill = 1;
 19544 ok(window.CanvasRenderingContext2D.prototype.fill === 1, "window.CanvasRenderingContext2D.prototype.fill === 1");
 19545 delete window.CanvasRenderingContext2D.prototype.fill;
 19546 ok(window.CanvasRenderingContext2D.prototype.fill === undefined, "window.CanvasRenderingContext2D.prototype.fill === undefined");
 19548 //restore the original method to ensure that other tests can run successfully
 19549 window.CanvasRenderingContext2D.prototype.fill = fill;
 19551 </script>
 19553 <!-- [[[ test_2d.type.replace.html ]]] -->
 19555 <p>Canvas test: 2d.type.replace</p>
 19556 <!-- Testing: Interface methods can be overridden -->
 19557 <canvas id="c612" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 19558 <script>
 19561 function test_2d_type_replace() {
 19563 var canvas = document.getElementById('c612');
 19564 var ctx = canvas.getContext('2d');
 19566 var fillRect = window.CanvasRenderingContext2D.prototype.fillRect;
 19567 window.CanvasRenderingContext2D.prototype.fillRect = function (x, y, w, h)
 19569     this.fillStyle = '#0f0';
 19570     fillRect.call(this, x, y, w, h);
 19571 };
 19572 ctx.fillStyle = '#f00';
 19573 ctx.fillRect(0, 0, 100, 50);
 19574 isPixel(ctx, 50,25, 0,255,0,255, 0);
 19576 //restore the original method to ensure that other tests can run successfully
 19577 window.CanvasRenderingContext2D.prototype.fillRect = fillRect;
 19579 </script>
 19581 <!-- [[[ test_2d.voidreturn.html ]]] -->
 19583 <p>Canvas test: 2d.voidreturn</p>
 19584 <!-- Testing: void methods return undefined -->
 19585 <canvas id="c613" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 19586 <script>
 19588 function test_2d_voidreturn() {
 19590 var canvas = document.getElementById('c613');
 19591 var ctx = canvas.getContext('2d');
 19593 ok(ctx.save() === undefined, "ctx.save() === undefined");
 19594 ok(ctx.restore() === undefined, "ctx.restore() === undefined");
 19595 ok(ctx.scale(1, 1) === undefined, "ctx.scale(1, 1) === undefined");
 19596 ok(ctx.rotate(0) === undefined, "ctx.rotate(0) === undefined");
 19597 ok(ctx.translate(0, 0) === undefined, "ctx.translate(0, 0) === undefined");
 19598 if (ctx.transform) { // (avoid spurious failures, since the aim here is not to test that all features are supported)
 19599     ok(ctx.transform(1, 0, 0, 1, 0, 0) === undefined, "ctx.transform(1, 0, 0, 1, 0, 0) === undefined");
 19601 if (ctx.setTransform) {
 19602     ok(ctx.setTransform(1, 0, 0, 1, 0, 0) === undefined, "ctx.setTransform(1, 0, 0, 1, 0, 0) === undefined");
 19604 ok(ctx.clearRect(0, 0, 0, 0) === undefined, "ctx.clearRect(0, 0, 0, 0) === undefined");
 19605 ok(ctx.fillRect(0, 0, 0, 0) === undefined, "ctx.fillRect(0, 0, 0, 0) === undefined");
 19606 ok(ctx.strokeRect(0, 0, 0, 0) === undefined, "ctx.strokeRect(0, 0, 0, 0) === undefined");
 19607 ok(ctx.beginPath() === undefined, "ctx.beginPath() === undefined");
 19608 ok(ctx.closePath() === undefined, "ctx.closePath() === undefined");
 19609 ok(ctx.moveTo(0, 0) === undefined, "ctx.moveTo(0, 0) === undefined");
 19610 ok(ctx.lineTo(0, 0) === undefined, "ctx.lineTo(0, 0) === undefined");
 19611 ok(ctx.quadraticCurveTo(0, 0, 0, 0) === undefined, "ctx.quadraticCurveTo(0, 0, 0, 0) === undefined");
 19612 ok(ctx.bezierCurveTo(0, 0, 0, 0, 0, 0) === undefined, "ctx.bezierCurveTo(0, 0, 0, 0, 0, 0) === undefined");
 19613 ok(ctx.arcTo(0, 0, 0, 0, 1) === undefined, "ctx.arcTo(0, 0, 0, 0, 1) === undefined");
 19614 ok(ctx.rect(0, 0, 0, 0) === undefined, "ctx.rect(0, 0, 0, 0) === undefined");
 19615 ok(ctx.arc(0, 0, 1, 0, 0, true) === undefined, "ctx.arc(0, 0, 1, 0, 0, true) === undefined");
 19616 ok(ctx.fill() === undefined, "ctx.fill() === undefined");
 19617 ok(ctx.stroke() === undefined, "ctx.stroke() === undefined");
 19618 ok(ctx.clip() === undefined, "ctx.clip() === undefined");
 19619 if (ctx.putImageData) {
 19620     ok(ctx.putImageData(ctx.getImageData(0, 0, 1, 1), 0, 0) === undefined, "ctx.putImageData(ctx.getImageData(0, 0, 1, 1), 0, 0) === undefined");
 19622 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");
 19623 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");
 19624 ok(ctx.createLinearGradient(0, 0, 0, 0).addColorStop(0, 'white') === undefined, "ctx.createLinearGradient(0, 0, 0, 0).addColorStop(0, 'white') === undefined");
 19628 </script>
 19629 <img src="image_yellow.png" id="yellow_11.png" class="resource">
 19631 <!-- [[[ test_bug397524.html ]]] -->
 19633 <p>Test for Bug 397524</p>
 19634 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=397524">Mozilla Bug 397524</a>
 19635 <p id="display">
 19636   <canvas id="canvas1" width="1" height="1"></canvas>
 19637   <canvas id="canvas2" width="1" height="1"></canvas>
 19638   <canvas id="canvas3" width="1" height="1"></canvas>
 19639   <img id="i1", src="image_green-1x1.png">
 19640   <img id="i2" src="http://example.com/tests/content/canvas/test/image_green-1x1.png">
 19641   <img id="i3" src="image_green-redirect">
 19642 </p>
 19643 <div id="content" style="display: none">
 19645 </div>
 19646 <pre id="test">
 19647 <script class="testbody" type="text/javascript">
 19649 /** Test for Bug 397524 **/
 19651 function draw(n) {
 19652   $("canvas" + n).getContext('2d').drawImage($("i" + n), 0, 0);
 19655 function test_bug397524() {
 19656   draw(1);
 19657   draw(2);
 19658   draw(3);
 19660   // Should be able to get the data out of the first canvas
 19661   $("canvas1").toDataURL("image/png");
 19663   // Should not be able to get the data out of a cross-site load
 19664   var gotData = false;  
 19665   try {
 19666     $("canvas2").toDataURL("image/png");
 19667     gotData = true;
 19668   } catch (ex if (ex.code == 18 && ex.name == "SecurityError")) {
 19670   is(gotData, false, "Shouldn't be able to read images cross-site!");
 19672   // Should not be able to get the data out of a redirected cross-site load
 19673   var gotData = false;  
 19674   try {
 19675     $("canvas3").toDataURL("image/png");
 19676     gotData = true;
 19677   } catch (ex if (ex.code == 18 && ex.name == "SecurityError")) {
 19679   is(gotData, false, "Shouldn't be able to read images redirected cross-site!");
 19683 </script>
 19684 </pre>
 19686 <!-- [[[ test_bug405982.html ]]] -->
 19688 <p>Canvas test: toDataURL.png</p>
 19689 <canvas id="c614" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 19690 <script>
 19691 function test_bug405982() {
 19693 var canvas = SpecialPowers.wrap(document.getElementById('c614'));
 19694 var ctx = canvas.getContext('2d');
 19696 var _threw = false;
 19697 try {
 19698   var data = canvas.toDataURL('image/png', 'quality=100');
 19700 catch (e) {
 19701   _threw = true;
 19703 ok(!_threw, "Should not throw an exception for invalid args to png encoder");
 19705 _threw = false;
 19706 try {
 19707   var data = canvas.toDataURL('image/jpeg', 'foobar=true');
 19709 catch (e) {
 19710   _threw = true;
 19712 ok(!_threw, "Should not throw an exception for invalid args to jpeg encoder");
 19715 </script>
 19716 <!-- [[[ test_context.arguments.extra.html ]]] -->
 19718 <p>Canvas test: context.arguments.extra</p>
 19719 <canvas id="c615" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 19720 <script>
 19722 function test_context_arguments_extra() {
 19724 var canvas = document.getElementById('c615');
 19725 var ctx = canvas.getContext('2d');
 19727 ok(canvas.getContext('2d', 'foo') !== null, "canvas.getContext('2d', 'foo') !== null");
 19731 </script>
 19733 <!-- [[[ test_context.arguments.missing.html ]]] -->
 19735 <p>Canvas test: context.arguments.missing</p>
 19736 <canvas id="c616" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 19737 <script>
 19739 function test_context_arguments_missing() {
 19741 var canvas = document.getElementById('c616');
 19742 var ctx = canvas.getContext('2d');
 19744 var _thrown = undefined; try {
 19745   canvas.getContext();
 19746 } catch (e) { _thrown = e }; todo(_thrown && _thrown.name == "NotSupportedError" && _thrown.code == DOMException.NOT_SUPPORTED_ERR, "should throw NotSupportedError");
 19750 </script>
 19752 <!-- [[[ test_context.casesensitive.html ]]] -->
 19754 <p>Canvas test: context.casesensitive - bug 401788</p>
 19755 <!-- Testing: Context name "2D" is unrecognised; matching is case sensitive -->
 19756 <canvas id="c617" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 19757 <script>
 19759 function test_context_casesensitive() {
 19761 var canvas = document.getElementById('c617');
 19762 var ctx = canvas.getContext('2d');
 19764 var _thrown_outer = false;
 19765 try {
 19767 ok(canvas.getContext('2D') === null, "canvas.getContext('2D') === null");
 19769 } catch (e) {
 19770     _thrown_outer = true;
 19772 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 19776 </script>
 19778 <!-- [[[ test_context.emptystring.html ]]] -->
 19780 <p>Canvas test: context.emptystring - bug 401788</p>
 19781 <!-- Testing: getContext with empty string returns null -->
 19782 <canvas id="c618" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 19783 <script>
 19785 function test_context_emptystring() {
 19787 var canvas = document.getElementById('c618');
 19788 var ctx = canvas.getContext('2d');
 19790 var _thrown_outer = false;
 19791 try {
 19793 ok(canvas.getContext("") === null, "canvas.getContext(\"\") === null");
 19795 } catch (e) {
 19796     _thrown_outer = true;
 19798 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 19802 </script>
 19804 <!-- [[[ test_context.unrecognised.badname.html ]]] -->
 19806 <p>Canvas test: context.unrecognised.badname - bug 401788</p>
 19807 <!-- Testing: getContext with unrecognised context name returns null -->
 19808 <canvas id="c619" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 19809 <script>
 19811 function test_context_unrecognised_badname() {
 19813 var canvas = document.getElementById('c619');
 19814 var ctx = canvas.getContext('2d');
 19816 var _thrown_outer = false;
 19817 try {
 19819 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");
 19821 } catch (e) {
 19822     _thrown_outer = true;
 19824 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 19828 </script>
 19830 <!-- [[[ test_context.unrecognised.badsuffix.html ]]] -->
 19832 <p>Canvas test: context.unrecognised.badsuffix - bug 401788</p>
 19833 <!-- Testing: Context name "2d" plus a suffix is unrecognised -->
 19834 <canvas id="c620" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 19835 <script>
 19837 function test_context_unrecognised_badsuffix() {
 19839 var canvas = document.getElementById('c620');
 19840 var ctx = canvas.getContext('2d');
 19842 var _thrown_outer = false;
 19843 try {
 19845 ok(canvas.getContext("2d#") === null, "canvas.getContext(\"2d#\") === null");
 19847 } catch (e) {
 19848     _thrown_outer = true;
 19850 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 19854 </script>
 19856 <!-- [[[ test_context.unrecognised.nullsuffix.html ]]] -->
 19858 <p>Canvas test: context.unrecognised.nullsuffix - bug 401788</p>
 19859 <!-- Testing: Context name "2d" plus a "\0" suffix is unrecognised -->
 19860 <canvas id="c621" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 19861 <script>
 19863 function test_context_unrecognised_nullsuffix() {
 19865 var canvas = document.getElementById('c621');
 19866 var ctx = canvas.getContext('2d');
 19868 var _thrown_outer = false;
 19869 try {
 19871 ok(canvas.getContext("2d\0") === null, "canvas.getContext(\"2d\\0\") === null");
 19873 } catch (e) {
 19874     _thrown_outer = true;
 19876 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 19880 </script>
 19882 <!-- [[[ test_context.unrecognised.unicode.html ]]] -->
 19884 <p>Canvas test: context.unrecognised.unicode - bug 401788</p>
 19885 <!-- Testing: Context name which kind of looks like "2d" is unrecognised -->
 19886 <canvas id="c622" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 19887 <script>
 19889 function test_context_unrecognised_unicode() {
 19891 var canvas = document.getElementById('c622');
 19892 var ctx = canvas.getContext('2d');
 19894 var _thrown_outer = false;
 19895 try {
 19897 ok(canvas.getContext("2\uFF44") === null, "canvas.getContext(\"2\\uFF44\") === null"); // Fullwidth Latin Small Letter D
 19899 } catch (e) {
 19900     _thrown_outer = true;
 19902 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 19906 </script>
 19908 <!-- [[[ test_fallback.basic.html ]]] -->
 19910 <p>Canvas test: fallback.basic</p>
 19911 <!-- Testing: Fallback content is inserted into the DOM -->
 19912 <canvas id="c623" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 19913 <script>
 19915 function test_fallback_basic() {
 19917 var canvas = document.getElementById('c623');
 19918 var ctx = canvas.getContext('2d');
 19920 ok(canvas.childNodes.length == 1, "canvas.childNodes.length == 1");
 19924 </script>
 19926 <!-- [[[ test_fallback.multiple.html ]]] -->
 19928 <p>Canvas test: fallback.multiple</p>
 19929 <!-- Testing: Fallback content with multiple elements -->
 19930 <canvas id="c624" width="100" height="50"><p class="fallback">FAIL</p><p class="fallback">FAIL</p></canvas>
 19931 <script>
 19933 function test_fallback_multiple() {
 19935 var canvas = document.getElementById('c624');
 19936 var ctx = canvas.getContext('2d');
 19938 ok(canvas.childNodes.length == 2, "canvas.childNodes.length == 2");
 19942 </script>
 19944 <!-- [[[ test_fallback.nested.html ]]] -->
 19946 <p>Canvas test: fallback.nested</p>
 19947 <!-- Testing: Fallback content containing another canvas (mostly testing parsers) -->
 19948 <canvas id="c625" width="100" height="50"><canvas><p class="fallback">FAIL (fallback content)</p></canvas><p class="fallback">FAIL (fallback content)</p></canvas>
 19949 <script>
 19951 function test_fallback_nested() {
 19953 var canvas = document.getElementById('c625');
 19954 var ctx = canvas.getContext('2d');
 19956 ok(canvas.childNodes.length == 2, "canvas.childNodes.length == 2");
 19960 </script>
 19962 <!-- [[[ test_initial.colour.html ]]] -->
 19964 <p>Canvas test: initial.colour</p>
 19965 <!-- Testing: Initial state is transparent black -->
 19966 <canvas id="c626" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 19967 <script>
 19970 function test_initial_colour() {
 19972 var canvas = document.getElementById('c626');
 19973 var ctx = canvas.getContext('2d');
 19975 isPixel(ctx, 20,20, 0,0,0,0, 0);
 19979 </script>
 19981 <!-- [[[ test_initial.reset.2dstate.html ]]] -->
 19983 <p>Canvas test: initial.reset.2dstate</p>
 19984 <!-- Testing: Resetting the canvas state resets 2D state variables -->
 19985 <canvas id="c627" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 19986 <script>
 19988 function test_initial_reset_2dstate() {
 19990 var canvas = document.getElementById('c627');
 19991 var ctx = canvas.getContext('2d');
 19993 canvas.width = 100;
 19994 var default_val;
 19996 default_val = ctx.strokeStyle;
 19997 ctx.strokeStyle = "#ff0000";
 19998 canvas.width = 100;
 19999 ok(ctx.strokeStyle === default_val, "ctx.strokeStyle === default_val");
 20001 default_val = ctx.fillStyle;
 20002 ctx.fillStyle = "#ff0000";
 20003 canvas.width = 100;
 20004 ok(ctx.fillStyle === default_val, "ctx.fillStyle === default_val");
 20006 default_val = ctx.globalAlpha;
 20007 ctx.globalAlpha = 0.5;
 20008 canvas.width = 100;
 20009 ok(ctx.globalAlpha === default_val, "ctx.globalAlpha === default_val");
 20011 default_val = ctx.lineWidth;
 20012 ctx.lineWidth = 0.5;
 20013 canvas.width = 100;
 20014 ok(ctx.lineWidth === default_val, "ctx.lineWidth === default_val");
 20016 default_val = ctx.lineCap;
 20017 ctx.lineCap = "round";
 20018 canvas.width = 100;
 20019 ok(ctx.lineCap === default_val, "ctx.lineCap === default_val");
 20021 default_val = ctx.lineJoin;
 20022 ctx.lineJoin = "round";
 20023 canvas.width = 100;
 20024 ok(ctx.lineJoin === default_val, "ctx.lineJoin === default_val");
 20026 default_val = ctx.miterLimit;
 20027 ctx.miterLimit = 0.5;
 20028 canvas.width = 100;
 20029 ok(ctx.miterLimit === default_val, "ctx.miterLimit === default_val");
 20031 default_val = ctx.shadowOffsetX;
 20032 ctx.shadowOffsetX = 5;
 20033 canvas.width = 100;
 20034 ok(ctx.shadowOffsetX === default_val, "ctx.shadowOffsetX === default_val");
 20036 default_val = ctx.shadowOffsetY;
 20037 ctx.shadowOffsetY = 5;
 20038 canvas.width = 100;
 20039 ok(ctx.shadowOffsetY === default_val, "ctx.shadowOffsetY === default_val");
 20041 default_val = ctx.shadowBlur;
 20042 ctx.shadowBlur = 5;
 20043 canvas.width = 100;
 20044 ok(ctx.shadowBlur === default_val, "ctx.shadowBlur === default_val");
 20046 default_val = ctx.shadowColor;
 20047 ctx.shadowColor = "#ff0000";
 20048 canvas.width = 100;
 20049 ok(ctx.shadowColor === default_val, "ctx.shadowColor === default_val");
 20051 default_val = ctx.globalCompositeOperation;
 20052 ctx.globalCompositeOperation = "copy";
 20053 canvas.width = 100;
 20054 ok(ctx.globalCompositeOperation === default_val, "ctx.globalCompositeOperation === default_val");
 20058 </script>
 20060 <!-- [[[ test_initial.reset.clip.html ]]] -->
 20062 <p>Canvas test: initial.reset.clip</p>
 20063 <!-- Testing: Resetting the canvas state resets the current clip region -->
 20064 <canvas id="c628" width="100" height="50" style="background: #f00"><p class="fallback">FAIL (fallback content)</p></canvas>
 20065 <script>
 20068 function test_initial_reset_clip() {
 20070 var canvas = document.getElementById('c628');
 20071 var ctx = canvas.getContext('2d');
 20073 canvas.width = 100;
 20074 ctx.rect(0, 0, 1, 1);
 20075 ctx.clip();
 20076 canvas.width = 100;
 20077 ctx.fillStyle = '#0f0';
 20078 ctx.fillRect(0, 0, 100, 50);
 20079 isPixel(ctx, 20,20, 0,255,0,255, 0);
 20083 </script>
 20085 <!-- [[[ test_initial.reset.different.html ]]] -->
 20087 <p>Canvas test: initial.reset.different</p>
 20088 <!-- Testing: Changing size resets canvas to transparent black -->
 20089 <canvas id="c629" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
 20090 <script>
 20093 function test_initial_reset_different() {
 20095 var canvas = document.getElementById('c629');
 20096 var ctx = canvas.getContext('2d');
 20098 ctx.fillStyle = '#f00';
 20099 ctx.fillRect(0, 0, 50, 50);
 20100 isPixel(ctx, 20,20, 255,0,0,255, 0);
 20101 canvas.width = 50;
 20102 isPixel(ctx, 20,20, 0,0,0,0, 0);
 20106 </script>
 20108 <!-- [[[ test_initial.reset.gradient.html ]]] -->
 20110 <p>Canvas test: initial.reset.gradient</p>
 20111 <!-- Testing: Resetting the canvas state does not invalidate any existing gradients -->
 20112 <canvas id="c630" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20113 <script>
 20116 function test_initial_reset_gradient() {
 20118 var canvas = document.getElementById('c630');
 20119 var ctx = canvas.getContext('2d');
 20121 canvas.width = 50;
 20122 var g = ctx.createLinearGradient(0, 0, 100, 0);
 20123 g.addColorStop(0, '#0f0');
 20124 g.addColorStop(1, '#0f0');
 20125 canvas.width = 100;
 20126 ctx.fillStyle = '#f00';
 20127 ctx.fillRect(0, 0, 100, 50);
 20128 ctx.fillStyle = g;
 20129 ctx.fillRect(0, 0, 100, 50);
 20130 isPixel(ctx, 50,25, 0,255,0,255, 0);
 20134 </script>
 20136 <!-- [[[ test_initial.reset.path.html ]]] -->
 20138 <p>Canvas test: initial.reset.path</p>
 20139 <!-- Testing: Resetting the canvas state resets the current path -->
 20140 <canvas id="c631" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
 20141 <script>
 20144 function test_initial_reset_path() {
 20146 var canvas = document.getElementById('c631');
 20147 var ctx = canvas.getContext('2d');
 20149 canvas.width = 100;
 20150 ctx.rect(0, 0, 100, 50);
 20151 canvas.width = 100;
 20152 ctx.fillStyle = '#f00';
 20153 ctx.fill();
 20154 isPixel(ctx, 20,20, 0,0,0,0, 0);
 20158 </script>
 20160 <!-- [[[ test_initial.reset.pattern.html ]]] -->
 20162 <p>Canvas test: initial.reset.pattern</p>
 20163 <!-- Testing: Resetting the canvas state does not invalidate any existing patterns -->
 20164 <canvas id="c632" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20165 <script>
 20168 function test_initial_reset_pattern() {
 20170 var canvas = document.getElementById('c632');
 20171 var ctx = canvas.getContext('2d');
 20173 canvas.width = 50;
 20174 ctx.fillStyle = '#0f0';
 20175 ctx.fillRect(0, 0, 50, 50);
 20176 var p = ctx.createPattern(canvas, 'repeat-x');
 20177 canvas.width = 100;
 20178 ctx.fillStyle = '#f00';
 20179 ctx.fillRect(0, 0, 100, 50);
 20180 ctx.fillStyle = p;
 20181 ctx.fillRect(0, 0, 100, 50);
 20182 isPixel(ctx, 50,25, 0,255,0,255, 0);
 20186 </script>
 20188 <!-- [[[ test_initial.reset.same.html ]]] -->
 20190 <p>Canvas test: initial.reset.same</p>
 20191 <!-- Testing: Setting size (not changing the value) resets canvas to transparent black -->
 20192 <canvas id="c633" width="100" height="50" style="background: #0f0"><p class="fallback">FAIL (fallback content)</p></canvas>
 20193 <script>
 20196 function test_initial_reset_same() {
 20198 var canvas = document.getElementById('c633');
 20199 var ctx = canvas.getContext('2d');
 20201 canvas.width = 100;
 20202 ctx.fillStyle = '#f00';
 20203 ctx.fillRect(0, 0, 50, 50);
 20204 isPixel(ctx, 20,20, 255,0,0,255, 0);
 20205 canvas.width = 100;
 20206 isPixel(ctx, 20,20, 0,0,0,0, 0);
 20210 </script>
 20212 <!-- [[[ test_initial.reset.transform.html ]]] -->
 20214 <p>Canvas test: initial.reset.transform</p>
 20215 <!-- Testing: Resetting the canvas state resets the current transformation matrix -->
 20216 <canvas id="c634" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20217 <script>
 20220 function test_initial_reset_transform() {
 20222 var canvas = document.getElementById('c634');
 20223 var ctx = canvas.getContext('2d');
 20225 canvas.width = 100;
 20226 ctx.scale(0, 0);
 20227 canvas.width = 100;
 20228 ctx.fillStyle = '#0f0';
 20229 ctx.fillRect(0, 0, 100, 50);
 20230 isPixel(ctx, 20,20, 0,255,0,255, 0);
 20234 </script>
 20236 <!-- [[[ test_size.attributes.default.html ]]] -->
 20238 <p>Canvas test: size.attributes.default</p>
 20239 <!-- Testing: Default width/height -->
 20240 <canvas id="c635" ><p class="fallback">FAIL (fallback content)</p></canvas>
 20241 <script>
 20243 function test_size_attributes_default() {
 20245 var canvas = document.getElementById('c635');
 20246 var ctx = canvas.getContext('2d');
 20248 ok(canvas.width == 300, "canvas.width == 300");
 20249 ok(canvas.height == 150, "canvas.height == 150");
 20250 ok(!canvas.hasAttribute('width'), "!canvas.hasAttribute('width')");
 20251 ok(!canvas.hasAttribute('height'), "!canvas.hasAttribute('height')");
 20255 </script>
 20257 <!-- [[[ test_size.attributes.html ]]] -->
 20259 <p>Canvas test: size.attributes</p>
 20260 <!-- Testing: width/height DOM attributes and content attributes -->
 20261 <canvas id="c636" width="120" height="60"><p class="fallback">FAIL (fallback content)</p></canvas>
 20262 <script>
 20264 function test_size_attributes() {
 20266 var canvas = document.getElementById('c636');
 20267 var ctx = canvas.getContext('2d');
 20269 ok(canvas.width == 120, "canvas.width == 120");
 20270 ok(canvas.height == 60, "canvas.height == 60");
 20271 ok(canvas.getAttribute('width') == 120, "canvas.getAttribute('width') == 120");
 20272 ok(canvas.getAttribute('height') == 60, "canvas.getAttribute('height') == 60");
 20276 </script>
 20278 <!-- [[[ test_size.attributes.parse.badsuffix.html ]]] -->
 20280 <p>Canvas test: size.attributes.parse.badsuffix</p>
 20281 <!-- Testing: Parsing of non-negative integers -->
 20282 <canvas id="c637" width="100foo" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20283 <script>
 20285 function test_size_attributes_parse_badsuffix() {
 20287 var canvas = document.getElementById('c637');
 20288 var ctx = canvas.getContext('2d');
 20290 is(canvas.width, 100, "canvas.width == 100");
 20294 </script>
 20296 <!-- [[[ test_size.attributes.parse.floatsuffix.html ]]] -->
 20298 <p>Canvas test: size.attributes.parse.floatsuffix</p>
 20299 <!-- Testing: Parsing of non-negative integers -->
 20300 <canvas id="c638" width="100.9" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20301 <script>
 20303 function test_size_attributes_parse_floatsuffix() {
 20305 var canvas = document.getElementById('c638');
 20306 var ctx = canvas.getContext('2d');
 20308 ok(canvas.width == 100, "canvas.width == 100");
 20312 </script>
 20314 <!-- [[[ test_size.attributes.parse.negative.html ]]] -->
 20316 <p>Canvas test: size.attributes.parse.negative</p>
 20317 <!-- Testing: Parsing of non-negative integers -->
 20318 <canvas id="c639" width="-100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20319 <script>
 20321 function test_size_attributes_parse_negative() {
 20323 var canvas = document.getElementById('c639');
 20324 var ctx = canvas.getContext('2d');
 20326 ok(canvas.width == 300, "canvas.width == 300");
 20330 </script>
 20332 <!-- [[[ test_size.attributes.parse.nonnumber.html ]]] -->
 20334 <p>Canvas test: size.attributes.parse.nonnumber</p>
 20335 <!-- Testing: Parsing of non-negative integers -->
 20336 <canvas id="c640" width="foo" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20337 <script>
 20339 function test_size_attributes_parse_nonnumber() {
 20341 var canvas = document.getElementById('c640');
 20342 var ctx = canvas.getContext('2d');
 20344 ok(canvas.width == 300, "canvas.width == 300");
 20348 </script>
 20350 <!-- [[[ test_size.attributes.parse.percentsuffix.html ]]] -->
 20352 <p>Canvas test: size.attributes.parse.percentsuffix</p>
 20353 <!-- Testing: Parsing of non-negative integers -->
 20354 <canvas id="c641" width="100%" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20355 <script>
 20357 function test_size_attributes_parse_percentsuffix() {
 20359 var canvas = document.getElementById('c641');
 20360 var ctx = canvas.getContext('2d');
 20362 ok(canvas.width == 100, "canvas.width == 100");
 20366 </script>
 20368 <!-- [[[ test_size.attributes.parse.whitespace.html ]]] -->
 20370 <p>Canvas test: size.attributes.parse.whitespace</p>
 20371 <!-- Testing: Parsing of non-negative integers -->
 20372 <canvas id="c642" width="   100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20373 <script>
 20375 function test_size_attributes_parse_whitespace() {
 20377 var canvas = document.getElementById('c642');
 20378 var ctx = canvas.getContext('2d');
 20380 ok(canvas.width == 100, "canvas.width == 100");
 20384 </script>
 20386 <!-- [[[ test_size.attributes.parse.zero.html ]]] -->
 20388 <p>Canvas test: size.attributes.parse.zero</p>
 20389 <!-- Testing: Parsing of non-negative integers -->
 20390 <canvas id="c643" width="0" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20391 <script>
 20393 function test_size_attributes_parse_zero() {
 20395 var canvas = document.getElementById('c643');
 20396 var ctx = canvas.getContext('2d');
 20398 ok(canvas.width == 0, "canvas.width == 0");
 20402 </script>
 20404 <!-- [[[ test_size.attributes.parse.zerosuffix.html ]]] -->
 20406 <p>Canvas test: size.attributes.parse.zerosuffix</p>
 20407 <!-- Testing: Parsing of non-negative integers -->
 20408 <canvas id="c644" width="100.0" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20409 <script>
 20411 function test_size_attributes_parse_zerosuffix() {
 20413 var canvas = document.getElementById('c644');
 20414 var ctx = canvas.getContext('2d');
 20416 ok(canvas.width == 100, "canvas.width == 100");
 20420 </script>
 20422 <!-- [[[ test_size.attributes.reflect.1.html ]]] -->
 20424 <p>Canvas test: size.attributes.reflect.1</p>
 20425 <!-- Testing: Setting DOM attributes updates DOM and content attributes -->
 20426 <canvas id="c645" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20427 <script>
 20429 function test_size_attributes_reflect_1() {
 20431 var canvas = document.getElementById('c645');
 20432 var ctx = canvas.getContext('2d');
 20434 canvas.width = 120;
 20435 canvas.height = 60;
 20436 ok(canvas.getAttribute('width') == '120', "canvas.getAttribute('width') == '120'");
 20437 ok(canvas.getAttribute('height') == '60', "canvas.getAttribute('height') == '60'");
 20438 ok(canvas.width == 120, "canvas.width == 120");
 20439 ok(canvas.height == 60, "canvas.height == 60");
 20443 </script>
 20445 <!-- [[[ test_size.attributes.reflect.2.html ]]] -->
 20447 <p>Canvas test: size.attributes.reflect.2</p>
 20448 <!-- Testing: Setting content attributes updates DOM and content attributes -->
 20449 <canvas id="c646" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20450 <script>
 20452 function test_size_attributes_reflect_2() {
 20454 var canvas = document.getElementById('c646');
 20455 var ctx = canvas.getContext('2d');
 20457 canvas.setAttribute('width', '120');
 20458 canvas.setAttribute('height', '60');
 20459 ok(canvas.getAttribute('width') == '120', "canvas.getAttribute('width') == '120'");
 20460 ok(canvas.getAttribute('height') == '60', "canvas.getAttribute('height') == '60'");
 20461 ok(canvas.width == 120, "canvas.width == 120");
 20462 ok(canvas.height == 60, "canvas.height == 60");
 20466 </script>
 20468 <!-- [[[ test_size.attributes.removed.html ]]] -->
 20470 <p>Canvas test: size.attributes.removed</p>
 20471 <!-- Testing: Removing content attributes reverts to default size -->
 20472 <canvas id="c647" width="120" height="60"><p class="fallback">FAIL (fallback content)</p></canvas>
 20473 <script>
 20475 function test_size_attributes_removed() {
 20477 var canvas = document.getElementById('c647');
 20478 var ctx = canvas.getContext('2d');
 20480 canvas.removeAttribute('width');
 20481 ok(canvas.width == 300, "canvas.width == 300");
 20485 </script>
 20487 <!-- [[[ test_size.attributes.setAttribute.badsuffix.html ]]] -->
 20489 <p>Canvas test: size.attributes.setAttribute.badsuffix</p>
 20490 <!-- Testing: Parsing of non-negative integers in setAttribute -->
 20491 <canvas id="c648" width="50" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20492 <script>
 20494 function test_size_attributes_setAttribute_badsuffix() {
 20496 var canvas = document.getElementById('c648');
 20497 var ctx = canvas.getContext('2d');
 20499 canvas.setAttribute('width', '100foo');
 20500 is(canvas.width, 100, "canvas.width == 100");
 20504 </script>
 20506 <!-- [[[ test_size.attributes.setAttribute.floatsuffix.html ]]] -->
 20508 <p>Canvas test: size.attributes.setAttribute.floatsuffix</p>
 20509 <!-- Testing: Parsing of non-negative integers in setAttribute -->
 20510 <canvas id="c649" width="50" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20511 <script>
 20513 function test_size_attributes_setAttribute_floatsuffix() {
 20515 var canvas = document.getElementById('c649');
 20516 var ctx = canvas.getContext('2d');
 20518 canvas.setAttribute('width', '1');
 20519 canvas.setAttribute('width', '100.9');
 20520 ok(canvas.width == 100, "canvas.width == 100");
 20524 </script>
 20526 <!-- [[[ test_size.attributes.setAttribute.negative.html ]]] -->
 20528 <p>Canvas test: size.attributes.setAttribute.negative</p>
 20529 <!-- Testing: Parsing of non-negative integers in setAttribute -->
 20530 <canvas id="c650" width="50" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20531 <script>
 20533 function test_size_attributes_setAttribute_negative() {
 20535 var canvas = document.getElementById('c650');
 20536 var ctx = canvas.getContext('2d');
 20538 canvas.setAttribute('width', '-100');
 20539 ok(canvas.width == 300, "canvas.width == 300");
 20543 </script>
 20545 <!-- [[[ test_size.attributes.setAttribute.nonnumber.html ]]] -->
 20547 <p>Canvas test: size.attributes.setAttribute.nonnumber</p>
 20548 <!-- Testing: Parsing of non-negative integers in setAttribute -->
 20549 <canvas id="c651" width="50" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20550 <script>
 20552 function test_size_attributes_setAttribute_nonnumber() {
 20554 var canvas = document.getElementById('c651');
 20555 var ctx = canvas.getContext('2d');
 20557 canvas.setAttribute('width', 'foo');
 20558 ok(canvas.width == 300, "canvas.width == 300");
 20562 </script>
 20564 <!-- [[[ test_size.attributes.setAttribute.percentsuffix.html ]]] -->
 20566 <p>Canvas test: size.attributes.setAttribute.percentsuffix</p>
 20567 <!-- Testing: Parsing of non-negative integers in setAttribute -->
 20568 <canvas id="c652" width="50" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20569 <script>
 20571 function test_size_attributes_setAttribute_percentsuffix() {
 20573 var canvas = document.getElementById('c652');
 20574 var ctx = canvas.getContext('2d');
 20576 canvas.setAttribute('width', '100%');
 20577 ok(canvas.width == 100, "canvas.width == 100");
 20581 </script>
 20583 <!-- [[[ test_size.attributes.setAttribute.whitespace.html ]]] -->
 20585 <p>Canvas test: size.attributes.setAttribute.whitespace</p>
 20586 <!-- Testing: Parsing of non-negative integers in setAttribute -->
 20587 <canvas id="c653" width="50" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20588 <script>
 20590 function test_size_attributes_setAttribute_whitespace() {
 20592 var canvas = document.getElementById('c653');
 20593 var ctx = canvas.getContext('2d');
 20595 canvas.setAttribute('width', '   100');
 20596 ok(canvas.width == 100, "canvas.width == 100");
 20600 </script>
 20602 <!-- [[[ test_size.attributes.setAttribute.zero.html ]]] -->
 20604 <p>Canvas test: size.attributes.setAttribute.zero</p>
 20605 <!-- Testing: Parsing of non-negative integers in setAttribute -->
 20606 <canvas id="c654" width="50" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20607 <script>
 20609 function test_size_attributes_setAttribute_zero() {
 20611 var canvas = document.getElementById('c654');
 20612 var ctx = canvas.getContext('2d');
 20614 canvas.setAttribute('width', '0');
 20615 ok(canvas.width == 0, "canvas.width == 0");
 20619 </script>
 20621 <!-- [[[ test_size.attributes.setAttribute.zerosuffix.html ]]] -->
 20623 <p>Canvas test: size.attributes.setAttribute.zerosuffix</p>
 20624 <!-- Testing: Parsing of non-negative integers in setAttribute -->
 20625 <canvas id="c655" width="50" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20626 <script>
 20628 function test_size_attributes_setAttribute_zerosuffix() {
 20630 var canvas = document.getElementById('c655');
 20631 var ctx = canvas.getContext('2d');
 20633 canvas.setAttribute('width', '1');
 20634 canvas.setAttribute('width', '100.0');
 20635 ok(canvas.width == 100, "canvas.width == 100");
 20639 </script>
 20641 <!-- [[[ test_size.attributes.style.html ]]] -->
 20643 <p>Canvas test: size.attributes.style</p>
 20644 <!-- Testing: Canvas size is independent of CSS resizing -->
 20645 <canvas id="c656" width="50" height="30" style="width: 100px; height: 50px"><p class="fallback">FAIL (fallback content)</p></canvas>
 20646 <script>
 20648 function test_size_attributes_style() {
 20650 var canvas = document.getElementById('c656');
 20651 var ctx = canvas.getContext('2d');
 20653 ok(canvas.width == 50, "canvas.width == 50");
 20654 ok(canvas.height == 30, "canvas.height == 30");
 20658 </script>
 20660 <!-- [[[ test_size.attributes.type.get.html ]]] -->
 20662 <p>Canvas test: size.attributes.type.get</p>
 20663 <!-- Testing: width/height DOM/content attributes - string vs number types -->
 20664 <canvas id="c657" width="120" height="60"><p class="fallback">FAIL (fallback content)</p></canvas>
 20665 <script>
 20667 function test_size_attributes_type_get() {
 20669 var canvas = document.getElementById('c657');
 20670 var ctx = canvas.getContext('2d');
 20672 ok(canvas.width === 120, "canvas.width === 120");
 20673 ok(canvas.height === 60, "canvas.height === 60");
 20674 ok(canvas.getAttribute('width') === '120', "canvas.getAttribute('width') === '120'");
 20675 ok(canvas.getAttribute('height') === '60', "canvas.getAttribute('height') === '60'");
 20679 </script>
 20681 <!-- [[[ test_size.attributes.type.set.html ]]] -->
 20683 <p>Canvas test: size.attributes.type.set</p>
 20684 <!-- Testing: Setting width/height DOM attributes -->
 20685 <canvas id="c658" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20686 <script>
 20688 function test_size_attributes_type_set() {
 20690 var canvas = document.getElementById('c658');
 20691 var ctx = canvas.getContext('2d');
 20693 canvas.width = 120;
 20694 canvas.height = 60;
 20695 ok(canvas.width === 120, "canvas.width === 120");
 20696 ok(canvas.height === 60, "canvas.height === 60");
 20700 </script>
 20702 <!-- [[[ test_text.font.html ]]] -->
 20704 <p>Canvas test: text.font</p>
 20705 <canvas id="c659" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20706 <script>
 20707 var _deferred = true;
 20709 function test_text_font() {
 20711 var canvas = document.getElementById('c659');
 20712 var ctx = canvas.getContext('2d');
 20714 is(ctx.font, '10px sans-serif', "default font is not '10px sans-serif'");
 20716 ctx.save();
 20717 ctx.font = '20pt serif';
 20718 is(ctx.font, '20pt serif', 'font getter returns incorrect value');
 20720 ctx.restore();
 20721 is(ctx.font, '10px sans-serif', 'font not being stored in the context state');
 20723 if (!_deferred) SimpleTest.finish();
 20725 </script>
 20727 <!-- [[[ test_text.measure.html ]]] -->
 20729 <p>Canvas test: text.measure</p>
 20730 <canvas id="c660" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20731 <script>
 20732 var _deferred = true;
 20734 function test_text_measure() {
 20736 var canvas = document.getElementById('c660');
 20737 var ctx = canvas.getContext('2d');
 20739 ctx.font = "10px sans-serif";
 20740 ctx.textAlign = "left";
 20741 ctx.textBaseline = "top";
 20743 var str = 'Test String';
 20744 var wid = ctx.measureText(str).width;
 20746 ok(wid > 0, "measureText returns nonpositive value for non-empty string");
 20748 ctx.font = "20px sans-serif";
 20749 isnot(wid, ctx.measureText(str).width, "measureText does not change with a different font size");
 20751 ctx.font = "10px sans-serif";
 20752 ctx.textAlign = "center";
 20753 ctx.textBaseline = "alphabetic";
 20755 is(wid, ctx.measureText(str).width, "measureText changes when alignement/baseline is changed");
 20758 if (!_deferred) SimpleTest.finish();
 20760 </script>
 20762 <!-- [[[ test_text.space.replace.html ]]] -->
 20764 <p>Canvas test: text.space.replace</p>
 20765 <canvas id="c661" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20766 <script>
 20767 var _deferred = true;
 20769 function test_text_space_replace() {
 20771 var canvas = document.getElementById('c661');
 20772 var ctx = canvas.getContext('2d');
 20774 var swid = ctx.measureText(' ').width;
 20775 ctx.font = "10px sans-serif";
 20777 isnot(swid, 0.0, "measureText reutuns zero for a non-empty string");
 20778 is(swid, ctx.measureText('\x09').width, "measureText does not replace whitespace char with a space");
 20779 is(swid, ctx.measureText('\x0A').width, "measureText does not replace whitespace char with a space");
 20780 is(swid, ctx.measureText('\x0B').width, "measureText does not replace whitespace char with a space");
 20781 is(swid, ctx.measureText('\x0C').width, "measureText does not replace whitespace char with a space");
 20782 is(swid, ctx.measureText('\x0D').width, "measureText does not replace whitespace char with a space");
 20784 if (!_deferred) SimpleTest.finish();
 20786 </script>
 20788 <!-- [[[ test_text.textAlign.html ]]] -->
 20790 <p>Canvas test: text.textAlign</p>
 20791 <canvas id="c662" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20792 <script>
 20793 var _deferred = true;
 20795 function test_text_textAlign() {
 20797 var canvas = document.getElementById('c662');
 20798 var ctx = canvas.getContext('2d');
 20800 is(ctx.textAlign, 'start', "default textAlign is not 'start'");
 20802 ctx.save();
 20803 ctx.textAlign = 'end';
 20804 is(ctx.textAlign, 'end', 'textAlign getter returns incorrect value');
 20806 ctx.save();
 20807 ctx.textAlign = 'left';
 20808 is(ctx.textAlign, 'left', 'textAlign getter returns incorrect value');
 20810 ctx.save();
 20811 ctx.textAlign = 'center';
 20812 is(ctx.textAlign, 'center', 'textAlign getter returns incorrect value');
 20814 ctx.save();
 20815 ctx.textAlign = 'right';
 20816 is(ctx.textAlign, 'right', 'textAlign getter returns incorrect value');
 20818 ctx.save();
 20819 ctx.textAlign = 'start';
 20820 is(ctx.textAlign, 'start', 'textAlign getter returns incorrect value');
 20822 ctx.restore();
 20823 is(ctx.textAlign, 'right', 'textAlign not being stored in the context state');
 20825 ctx.restore();
 20826 is(ctx.textAlign, 'center', 'textAlign not being stored in the context state');
 20828 ctx.restore();
 20829 is(ctx.textAlign, 'left', 'textAlign not being stored in the context state');
 20831 ctx.restore();
 20832 is(ctx.textAlign, 'end', 'textAlign not being stored in the context state');
 20834 ctx.restore();
 20835 is(ctx.textAlign, 'start', 'textAlign not being stored in the context state');
 20837 if (!_deferred) SimpleTest.finish();
 20839 </script>
 20841 <!-- [[[ test_text.textBaseline.html ]]] -->
 20843 <p>Canvas test: text.textBaseline</p>
 20844 <canvas id="c663" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20845 <script>
 20846 var _deferred = true;
 20848 function test_text_textBaseline() {
 20850 var canvas = document.getElementById('c663');
 20851 var ctx = canvas.getContext('2d');
 20853 is(ctx.textBaseline, 'alphabetic', "default textBaseline is not 'alphabetic'");
 20855 ctx.save();
 20856 ctx.textBaseline = 'ideographic';
 20857 is(ctx.textBaseline, 'ideographic', 'textBaseline getter returns incorrect value');
 20859 ctx.save();
 20860 ctx.textBaseline = 'top';
 20861 is(ctx.textBaseline, 'top', 'textBaseline getter returns incorrect value');
 20863 ctx.save();
 20864 ctx.textBaseline = 'middle';
 20865 is(ctx.textBaseline, 'middle', 'textBaseline getter returns incorrect value');
 20867 ctx.save();
 20868 ctx.textBaseline = 'bottom';
 20869 is(ctx.textBaseline, 'bottom', 'textBaseline getter returns incorrect value');
 20871 ctx.save();
 20872 ctx.textBaseline = 'hanging';
 20873 is(ctx.textBaseline, 'hanging', 'textBaseline getter returns incorrect value');
 20875 ctx.save();
 20876 ctx.textBaseline = 'alphabetic';
 20877 is(ctx.textBaseline, 'alphabetic', 'textBaseline getter returns incorrect value');
 20879 ctx.restore();
 20880 is(ctx.textBaseline, 'hanging', 'textBaseline not being stored in the context state');
 20882 ctx.restore();
 20883 is(ctx.textBaseline, 'bottom', 'textBaseline not being stored in the context state');
 20885 ctx.restore();
 20886 is(ctx.textBaseline, 'middle', 'textBaseline not being stored in the context state');
 20888 ctx.restore();
 20889 is(ctx.textBaseline, 'top', 'textBaseline not being stored in the context state');
 20891 ctx.restore();
 20892 is(ctx.textBaseline, 'ideographic', 'textBaseline not being stored in the context state');
 20894 ctx.restore();
 20895 is(ctx.textBaseline, 'alphabetic', 'textBaseline not being stored in the context state');
 20897 if (!_deferred) SimpleTest.finish();
 20899 </script>
 20901 <!-- [[[ test_toDataURL.arguments.1.html ]]] -->
 20903 <p>Canvas test: toDataURL.arguments.1 - bug 401795</p>
 20904 <!-- Testing: toDataURL ignores extra arguments -->
 20905 <canvas id="c664" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20906 <script>
 20908 function test_toDataURL_arguments_1() {
 20910 var canvas = document.getElementById('c664');
 20911 var ctx = canvas.getContext('2d');
 20913 var _thrown_outer = false;
 20914 try {
 20916 var data = canvas.toDataURL('image/png', 'another argument that should not raise an exception');
 20917 ok(/^data:image\/png[;,]/.test(data), "data =~ /^data:image\\/png[;,]/");
 20919 } catch (e) {
 20920     _thrown_outer = true;
 20922 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 20926 </script>
 20928 <!-- [[[ test_toDataURL.arguments.2.html ]]] -->
 20930 <p>Canvas test: toDataURL.arguments.2 - bug 401795</p>
 20931 <!-- Testing: toDataURL ignores extra arguments -->
 20932 <canvas id="c665" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20933 <script>
 20935 function test_toDataURL_arguments_2() {
 20937 var canvas = document.getElementById('c665');
 20938 var ctx = canvas.getContext('2d');
 20940 var _thrown_outer = false;
 20941 try {
 20943 var data = canvas.toDataURL('image/png', 'another argument that should not raise an exception', 'and another');
 20944 ok(/^data:image\/png[;,]/.test(data), "data =~ /^data:image\\/png[;,]/");
 20946 } catch (e) {
 20947     _thrown_outer = true;
 20949 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 20953 </script>
 20955 <!-- [[[ test_toDataURL.arguments.3.html ]]] -->
 20957 <p>Canvas test: toDataURL.arguments.3 - bug 401795</p>
 20958 <!-- Testing: toDataURL ignores extra arguments -->
 20959 <canvas id="c666" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20960 <script>
 20962 function test_toDataURL_arguments_3() {
 20964 var canvas = document.getElementById('c666');
 20965 var ctx = canvas.getContext('2d');
 20967 var _thrown_outer = false;
 20968 try {
 20970 // More arguments that should not raise exceptions
 20971 var data = canvas.toDataURL('image/png', null, null, null);
 20972 ok(/^data:image\/png[;,]/.test(data), "data =~ /^data:image\\/png[;,]/");
 20974 } catch (e) {
 20975     _thrown_outer = true;
 20977 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 20981 </script>
 20983 <!-- [[[ test_toDataURL.complexcolours.html ]]] -->
 20985 <p>Canvas test: toDataURL.complexcolours</p>
 20986 <!-- Testing: toDataURL handles non-primary and non-solid colours correctly -->
 20987 <canvas id="c667" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 20988 <script>
 20990 var canvas667 = document.getElementById('c667');
 20991 var ctx667 = canvas667.getContext('2d');
 20993 function test_toDataURL_complexcolours() {
 20995 // (These values are chosen to survive relatively alright through being premultiplied)
 20996 ctx667.fillStyle = 'rgba(1, 3, 254, 1)';
 20997 ctx667.fillRect(0, 0, 25, 25);
 20998 ctx667.fillStyle = 'rgba(8, 252, 248, 0.75)';
 20999 ctx667.fillRect(25, 0, 25, 25);
 21000 ctx667.fillStyle = 'rgba(6, 10, 250, 0.502)';
 21001 ctx667.fillRect(50, 0, 25, 25);
 21002 ctx667.fillStyle = 'rgba(12, 16, 244, 0.25)';
 21003 ctx667.fillRect(75, 0, 25, 25);
 21004 var img = new Image();
 21005 deferTest();
 21006 img.onload = wrapFunction(function ()
 21008     ctx667.drawImage(img, 0, 25);
 21009     // (The alpha values do not really survive float->int conversion, so just
 21010     // do approximate comparisons)
 21011     isPixel(ctx667, 12,40, 1,3,254,255, 0);
 21012     isPixel(ctx667, 37,40, 8,252,248,191, 2);
 21013     isPixel(ctx667, 62,40, 6,10,250,127, 4);
 21014     isPixel(ctx667, 87,40, 12,16,244,63, 8);
 21015 });
 21016 img.src = canvas667.toDataURL();
 21020 </script>
 21022 <!-- [[[ test_toDataURL.default.html ]]] -->
 21024 <p>Canvas test: toDataURL.default</p>
 21025 <!-- Testing: toDataURL with no arguments returns a PNG -->
 21026 <canvas id="c668" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 21027 <script>
 21029 function test_toDataURL_default() {
 21031 var canvas = document.getElementById('c668');
 21032 var ctx = canvas.getContext('2d');
 21034 var data = canvas.toDataURL();
 21035 ok(/^data:image\/png[;,]/.test(data), "data =~ /^data:image\\/png[;,]/");
 21039 </script>
 21041 <!-- [[[ test_toDataURL.lowercase.html ]]] -->
 21043 <p>Canvas test: toDataURL.lowercase - bug 401795</p>
 21044 <!-- Testing: toDataURL type is case-sensitive -->
 21045 <canvas id="c669" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 21046 <script>
 21048 function test_toDataURL_lowercase() {
 21050 var canvas = document.getElementById('c669');
 21051 var ctx = canvas.getContext('2d');
 21053 var _thrown_outer = false;
 21054 try {
 21056 var data = canvas.toDataURL('ImAgE/PnG');
 21057 ok(/^data:image\/png[;,]/.test(data), "data =~ /^data:image\\/png[;,]/");
 21059 } catch (e) {
 21060     _thrown_outer = true;
 21062 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 21066 </script>
 21068 <!-- [[[ test_toDataURL.nocontext.html ]]] -->
 21070 <p>Canvas test: toDataURL.nocontext</p>
 21071 <!-- Testing: toDataURL works before any context has been got -->
 21072 <canvas id="c670" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 21073 <script>
 21075 function test_toDataURL_nocontext() {
 21077 var canvas = document.getElementById('c670');
 21078 var ctx = canvas.getContext('2d');
 21080 var canvas2 = document.createElement('canvas');
 21082 var data = canvas2.toDataURL();
 21083 ok(/^data:image\/png[;,]/.test(data), "data =~ /^data:image\\/png[;,]/");
 21087 </script>
 21089 <!-- [[[ test_toDataURL.png.html ]]] -->
 21091 <p>Canvas test: toDataURL.png</p>
 21092 <!-- Testing: toDataURL with image/png returns a PNG -->
 21093 <canvas id="c671" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 21094 <script>
 21096 function test_toDataURL_png() {
 21098 var canvas = document.getElementById('c671');
 21099 var ctx = canvas.getContext('2d');
 21101 var data = canvas.toDataURL('image/png');
 21102 ok(/^data:image\/png[;,]/.test(data), "data =~ /^data:image\\/png[;,]/");
 21106 </script>
 21108 <!-- [[[ test_toDataURL.primarycolours.html ]]] -->
 21110 <p>Canvas test: toDataURL.primarycolours</p>
 21111 <!-- Testing: toDataURL handles simple colours correctly -->
 21112 <canvas id="c672" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 21113 <script>
 21116 var canvas672 = document.getElementById('c672');
 21117 var ctx672 = canvas672.getContext('2d');
 21119 function test_toDataURL_primarycolours() {
 21121 ctx672.fillStyle = '#ff0';
 21122 ctx672.fillRect(0, 0, 25, 40);
 21123 ctx672.fillStyle = '#0ff';
 21124 ctx672.fillRect(25, 0, 50, 40);
 21125 ctx672.fillStyle = '#00f';
 21126 ctx672.fillRect(75, 0, 25, 40);
 21127 ctx672.fillStyle = '#fff';
 21128 ctx672.fillRect(0, 40, 100, 10);
 21129 var data = canvas672.toDataURL();
 21130 ctx672.fillStyle = '#f00';
 21131 ctx672.fillRect(0, 0, 100, 50);
 21132 var img = new Image();
 21133 deferTest();
 21134 img.onload = wrapFunction(function ()
 21136     ctx672.drawImage(img, 0, 0);
 21137     isPixel(ctx672, 12,20, 255,255,0,255, 0);
 21138     isPixel(ctx672, 50,20, 0,255,255,255, 0);
 21139     isPixel(ctx672, 87,20, 0,0,255,255, 0);
 21140     isPixel(ctx672, 50,45, 255,255,255,255, 0);
 21141 });
 21142 img.src = data;
 21146 </script>
 21148 <!-- [[[ test_toDataURL.unrecognised.html ]]] -->
 21150 <p>Canvas test: toDataURL.unrecognised - bug 401795</p>
 21151 <!-- Testing: toDataURL with an unhandled type returns a PNG -->
 21152 <canvas id="c673" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 21153 <script>
 21155 function test_toDataURL_unrecognised() {
 21157 var canvas = document.getElementById('c673');
 21158 var ctx = canvas.getContext('2d');
 21160 var _thrown_outer = false;
 21161 try {
 21163 var data = canvas.toDataURL('image/example');
 21164 ok(/^data:image\/png[;,]/.test(data), "data =~ /^data:image\\/png[;,]/");
 21166 } catch (e) {
 21167     _thrown_outer = true;
 21169 ok(!_thrown_outer, ctx.canvas.id + ' should not throw exception');
 21173 </script>
 21175 <!-- [[[ test_toDataURL.zerosize.html ]]] -->
 21177 <p>Canvas test: toDataURL.zerosize</p>
 21178 <!-- Testing: toDataURL on zero-size canvas returns 'data:,' -->
 21179 <canvas id="c674" width="0" height="0"><p class="fallback">FAIL (fallback content)</p></canvas>
 21180 <script>
 21182 function test_toDataURL_zerosize() {
 21184 var canvas = document.getElementById('c674');
 21185 var ctx = canvas.getContext('2d');
 21187 var data = canvas.toDataURL();
 21188 ok(data === 'data:,', "data === 'data:,'");
 21192 </script>
 21194 <!-- [[[ test_type.exists.html ]]] -->
 21196 <p>Canvas test: type.exists</p>
 21197 <!-- Testing: HTMLCanvasElement is a property of window -->
 21198 <canvas id="c676" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 21199 <script>
 21201 function test_type_exists() {
 21203 var canvas = document.getElementById('c676');
 21204 var ctx = canvas.getContext('2d');
 21206 ok(window.HTMLCanvasElement, "window.HTMLCanvasElement");
 21210 </script>
 21212 <!-- [[[ test_type.extend.html ]]] -->
 21214 <p>Canvas test: type.extend</p>
 21215 <!-- Testing: HTMLCanvasElement methods can be added, and the new methods used by canvases -->
 21216 <canvas id="c677" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 21217 <script>
 21219 function test_type_extend() {
 21221 var canvas = document.getElementById('c677');
 21222 var ctx = canvas.getContext('2d');
 21224 window.HTMLCanvasElement.prototype.getZero = function () { return 0; };
 21225 ok(canvas.getZero() === 0, "canvas.getZero() === 0");
 21229 </script>
 21231 <!-- [[[ test_type.name.html ]]] -->
 21233 <p>Canvas test: type.name</p>
 21234 <!-- Testing: HTMLCanvasElement type and toString -->
 21235 <canvas id="c678" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 21236 <script>
 21238 function test_type_name() {
 21240 var canvas = document.getElementById('c678');
 21241 var ctx = canvas.getContext('2d');
 21243 ok(Object.prototype.toString.call(canvas) === '[object HTMLCanvasElement]', "Object.prototype.toString.call(canvas) === '[object HTMLCanvasElement]'");
 21247 </script>
 21249 <!-- [[[ test_type.prototype.html ]]] -->
 21251 <p>Canvas test: type.prototype</p>
 21252 <!-- Testing: window.HTMLCanvasElement has prototype, which is { ReadOnly, DontDelete }. prototype has getContext, which is not -->
 21253 <canvas id="c679" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 21254 <script>
 21256 function test_type_prototype() {
 21258 var canvas = document.getElementById('c679');
 21259 var ctx = canvas.getContext('2d');
 21261 ok(window.HTMLCanvasElement.prototype, "window.HTMLCanvasElement.prototype");
 21262 ok(window.HTMLCanvasElement.prototype.getContext, "window.HTMLCanvasElement.prototype.getContext");
 21263 window.HTMLCanvasElement.prototype = null;
 21264 ok(window.HTMLCanvasElement.prototype, "window.HTMLCanvasElement.prototype");
 21265 delete window.HTMLCanvasElement.prototype;
 21266 ok(window.HTMLCanvasElement.prototype, "window.HTMLCanvasElement.prototype");
 21267 var getContext = window.HTMLCanvasElement.prototype.getContext;
 21268 window.HTMLCanvasElement.prototype.getContext = 1;
 21269 ok(window.HTMLCanvasElement.prototype.getContext === 1, "window.HTMLCanvasElement.prototype.getContext === 1");
 21270 delete window.HTMLCanvasElement.prototype.getContext;
 21271 ok(window.HTMLCanvasElement.prototype.getContext === undefined, "window.HTMLCanvasElement.prototype.getContext === undefined");
 21272 window.HTMLCanvasElement.prototype.getContext = getContext;
 21276 </script>
 21278 <!-- [[[ test_type.replace.html ]]] -->
 21280 <p>Canvas test: type.replace</p>
 21281 <!-- Testing: HTMLCanvasElement methods can be replaced, and the replacement methods used by canvases -->
 21282 <canvas id="c680" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
 21283 <script>
 21285 function test_type_replace() {
 21287 var canvas = document.getElementById('c680');
 21288 var ctx = canvas.getContext('2d');
 21290 var getContext = window.HTMLCanvasElement.prototype.getContext;
 21291 window.HTMLCanvasElement.prototype.getContext = function (name) { return 0; };
 21292 ok(canvas.getContext('2d') === 0, "canvas.getContext('2d') === 0");
 21293 window.HTMLCanvasElement.prototype.getContext = getContext;
 21297 </script>
 21299 <!-- [[[ test_2d.imagedata_coercion.html ]]] -->
 21301 <p>Canvas test: 2d.imagedata_coercion</p>
 21302 <!-- Testing: imagedata coerced correctly on set -->
 21303 <canvas id="c681" width="100" height="1"><p class="fallback">FAIL (fallback content)</p></canvas>
 21304 <script>
 21306 /* NOTE: Due to round-tripping through premultiplied values and the rounding
 21307 that ensues, values of alpha < 255 will tend to do weird things.  In
 21308 particular, the premultiplied color values are computed by multiplying by a,
 21309 dividing by 255, then always rounding up.  The conversion the other way is done
 21310 by multiplying by 255/a and rounding down.  So if
 21312   255/a * (amount added when rounding) > 1
 21314 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
 21315 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. */
 21317 /* Our tests.  Each test has two arrays: the array of values to set and the
 21318    array of values that should read back as a result. */
 21319 var tests = [
 21321     [ 0, 1, 3, 250 ], [ 0, 1, 3, 250 ]
 21322   ],
 21324     [ 0, 1, 2, 250, 4, 5, 6, 250 ], [ 0, 1, 2, 250, 4, 5, 6, 250 ]
 21325   ],
 21327     [ 0, 1000, 2, 300, 400, 5, 600, 250 ], [ 0, 255, 2, 255, 255, 5, 255, 250 ]
 21328   ],
 21330     [ -10, -5, NaN, 250, 4, 5, 6, -250 ], [ 0, 0, 0, 250, 0, 0, 0, 0 ]
 21331   ],
 21333     [ 0.5, 12.2, 12.8, 251.5, 12.5, 13.5, 13.2, 250.5 ],
 21334     [ 0, 12, 13, 252, 12, 14, 13, 250 ]
 21336 ];
 21338 function doTest(type, idx) {
 21339   var testPair = tests[idx];
 21340   var test = testPair[0];
 21341   var ref = testPair[1];
 21342   var descSuffix = " for " + type + " test #" + (idx+1);
 21343   function myIs(a, b, str) {
 21344     is(a, b, str + descSuffix);
 21347   myIs(test.length, ref.length, "Length mismatch");
 21348   myIs(test.length % 4, 0, "Length not a multiple of 4");
 21349   var pixels = test.length / 4;
 21350   var imageData = ctx681.createImageData(pixels, 1);
 21351   myIs(imageData.width, pixels, "Incorrect created data width");
 21352   myIs(imageData.height, 1, "Incorrect created data height");
 21353   myIs(imageData.data.length, test.length,
 21354        "Incorrect length in created image data");
 21356   ctx681.putImageData(imageData, 0, 0);
 21357   var testImageData = ctx681.getImageData(0, 0, pixels, 1);
 21358   myIs(testImageData.data.length, test.length,
 21359        "Incorrect length in test image data after clearing pixels");
 21360   var j;
 21361   for (j = 0; j < testImageData.data.length; ++j) {
 21362     myIs(testImageData.data[j], 0,
 21363          "Nonzero value at position " + j + " in test image data " +
 21364          "after clearing pixels");
 21366   for (j = 0; j < imageData.data.length; ++j) {
 21367     imageData.data[j] = test[j];
 21369   if (type == "slow") {
 21370     // convert to a non-dense array so we can test that codepath
 21371     imageData.data.makeMeSlow = 1;
 21373   ctx681.putImageData(imageData, 0, 0);
 21374   testImageData = ctx681.getImageData(0, 0, pixels, 1);
 21375   myIs(testImageData.data.length, test.length,
 21376        "Incorrect length in test image data after putting our imagedata");
 21377   for (j = 0; j < testImageData.data.length; ++j) {
 21378     myIs(testImageData.data[j], ref[j],
 21379          "Incorrect value at position " + j + " in test image data " +
 21380          "after putting our imagedata");
 21384 function doTests(type) {
 21385   for (var i = 0; i < tests.length; ++i) {
 21386     doTest(type, i);
 21390 var canvas681;
 21391 var ctx681;
 21393 function test_2d_imagedata_coercion() {
 21395 canvas681 = document.getElementById('c681');
 21396 ctx681 = canvas681.getContext('2d');
 21398 doTests("fast");
 21399 doTests("slow");
 21402 </script>
 21404 <!-- [[[ test_2d.imageSmoothing.html ]]] -->
 21406 <p>Canvas test: 2d.imageRenderingQuality</p>
 21407 <canvas id="c682" width="10" height="10"></canvas><br>
 21408 <canvas style="visibility: hidden" id="c683" width="2" height="2"></canvas>
 21409 <script type="text/javascript">
 21411 function setup_test_2d_imageSmoothing() {
 21412   var c683 = document.getElementById("c683");
 21413   var cx683 = c683.getContext("2d");
 21415   cx683.fillStyle = "red";
 21416   cx683.fillRect(0, 0, 2, 2);
 21418   cx683.fillStyle = "rgb(0,255,0)";
 21419   cx683.fillRect(0, 0, 1, 1);
 21422 function test_2d_imageSmoothing() {
 21423   setup_test_2d_imageSmoothing();
 21425   var c682 = document.getElementById("c682");
 21426   var c683 = document.getElementById("c683");
 21428   var cx682 = c682.getContext("2d");
 21430   ok(cx682.mozImageSmoothingEnabled == true, "initial mozImageSmoothingEnabled is true");
 21432   // check that mozImageSmoothingEnabled is part of the context
 21433   cx682.save();
 21434   cx682.mozImageSmoothingEnabled = false;
 21435   ok(cx682.mozImageSmoothingEnabled == false, "mozImageSmoothingEnabled is false after setting");
 21436   cx682.restore();
 21437   ok(cx682.mozImageSmoothingEnabled == true, "mozImageSmoothingEnabled is true after restore");
 21439   // check that false works
 21440   cx682.mozImageSmoothingEnabled = false;
 21442   cx682.scale(10,10);
 21443   cx682.drawImage(c683, 0, 0);
 21445   // this should be all red
 21446   var data = cx682.getImageData(9, 9, 1, 1);
 21447   var pixels = data.data;
 21448   ok (pixels[0] == 0 &&
 21449       pixels[1] == 255 &&
 21450       pixels[2] == 0 &&
 21451       pixels[3] == 255,
 21452       "pixel is " + pixels.toSource() + " (expected [0,255,0,255])");
 21455 </script>
 21457 <p>Canvas test: zero_dimensions</p>
 21458 <canvas id="c684" width="0" height="0"></canvas>
 21459 <script type="text/javascript">
 21460 function test_zero_dimensions() {
 21461   var c = document.getElementById("c684");
 21462   ok(c.width == 0, "c.width not 0");
 21463   ok(c.height == 0, "c.height not 0");
 21465 </script>
 21467 <p>Canvas test: zero_dimensions_image_data</p>
 21468 <canvas id="c685" width="0" height="0"></canvas>
 21469 <script type="text/javascript">
 21470 function test_zero_dimensions_imagedata() {
 21471   var c = document.getElementById("c685");
 21472   var ctx = c.getContext("2d");
 21473   ctx.fillStyle = "blue";
 21474   ctx.fillRect(0, 0, 100, 100);
 21475   var imgdata = ctx.getImageData(0, 0, 100, 100);
 21476   var isTransparentBlack = true;
 21477   for (var i = 0; i < imgdata.data.length; ++i)
 21478       if (imgdata.data[i] !== 0)
 21479           isTransparentBlack = false;
 21480   ok(isTransparentBlack, "isTransparentBlack");
 21482 </script>
 21484 <p>Canvas test: getImageData_after_zero_canvas</p>
 21485 <canvas id="c686" width="100" height="100"></canvas>
 21486 <script type="text/javascript">
 21487 function test_getImageData_after_zero_canvas() {
 21488     var c = document.getElementById("c686");
 21489     var ctx = c.getContext("2d");
 21490     ctx.fillStyle = "rgba(0, 0, 0, 1.0)";
 21491     ctx.fillRect(0, 0, c.width, c.height);
 21492     var oldimgdata = ctx.getImageData(0, 0, c.width, c.height);
 21493     c.width = c.height = 0;
 21494     c.width = c.height = 100;
 21495     ctx.fillRect(0, 0, c.width, c.height);
 21496     var imgdata = ctx.getImageData(0, 0, c.width, c.height);
 21497     var same = false;
 21498     ok(imgdata.data.length === oldimgdata.data.length, "not the same length");
 21499     for (var i = 0; i < imgdata.data.length; ++i)
 21500         same = imgdata.data[i] === oldimgdata.data[i];
 21501     ok(same, "changing dimensions broke canvas");
 21503 </script>
 21505 <p>Canvas test: zero_dimensions_image_data</p>
 21506 <canvas id="c687" width="150" height="50"></canvas>
 21507 <script type="text/javascript">
 21509 function test_linedash() {
 21510   var c = document.getElementById("c687");
 21511   var ctx = c.getContext("2d");
 21512   ok(ctx.lineDashOffset==0, "initial dash offset is not 0");
 21514   ctx.setLineDash([15, 10]);
 21515   ctx.lineDashOffset = 5;
 21516   ctx.strokeRect (10,10,100,100);
 21518   var lineDash = ctx.getLineDash();
 21519   ok(lineDash[0]==15&&lineDash[1]==10, "dash pattern [15, 10] is wrong");
 21520   ok(ctx.lineDashOffset==5, "dash offset is wrong");
 21522   ctx.setLineDash([5, 10, 15]);
 21523   ctx.strokeRect(20, 20, 120, 120);
 21524   lineDash = ctx.getLineDash();
 21525   ok(lineDash[0]==5
 21526     && lineDash[1]==10
 21527     && lineDash[2]==15
 21528     && lineDash[3]==5
 21529     && lineDash[4]==10
 21530     && lineDash[5]==15, "dash pattern [5, 10, 15] is wrong");
 21532   ctx.setLineDash(["1", 2]);
 21533   lineDash = ctx.getLineDash();
 21534   ok(lineDash[0] == 1 && lineDash[1] == 2, "dash pattern ['1', 2] is wrong");
 21536   ctx.clearRect(0, 0, 700, 700);
 21537   ok(ctx.lineDashOffset==5, "dash offset is wrong");
 21539   ctx.setLineDash([20, 10]);
 21540   ctx.lineDashOffset = 0;
 21541   ctx.lineWidth = 4; // To make the test immune to plaform anti-aliasing discrepancies
 21542   ctx.strokeStyle = '#00FF00';
 21543   ctx.strokeRect(10.5, 10.5, 30, 30);
 21545   isPixel(ctx, 25, 10, 0, 255, 0, 255, 0);
 21546   isPixel(ctx, 35, 10, 0, 0, 0, 0, 0);
 21547   isPixel(ctx, 40, 25, 0, 255, 0, 255, 0);
 21548   isPixel(ctx, 40, 35, 0, 0, 0, 0, 0);
 21549   isPixel(ctx, 25, 40, 0, 255, 0, 255, 0);
 21550   isPixel(ctx, 15, 40, 0, 0, 0, 0, 0);
 21551   isPixel(ctx, 10, 25, 0, 255, 0, 255, 0);
 21552   isPixel(ctx, 10, 15, 0, 0, 0, 0, 0);
 21554   // Verify that lineDashOffset works as expected
 21555   ctx.lineDashOffset = 20;
 21556   ctx.strokeRect(50.5, 10.5, 30, 30);
 21557   isPixel(ctx, 55, 10, 0, 0, 0, 0, 0);
 21558   isPixel(ctx, 65, 10, 0, 255, 0, 255, 0);
 21559   isPixel(ctx, 80, 15, 0, 0, 0, 0, 0);
 21560   isPixel(ctx, 80, 25, 0, 255, 0, 255, 0);
 21561   isPixel(ctx, 75, 40, 0, 0, 0, 0, 0);
 21562   isPixel(ctx, 65, 40, 0, 255, 0, 255, 0);
 21563   isPixel(ctx, 50, 35, 0, 0, 0, 0, 0);
 21564   isPixel(ctx, 50, 25, 0, 255, 0, 255, 0);
 21566   // Verify negative lineDashOffset
 21567   ctx.lineDashOffset = -10;
 21568   ctx.strokeRect(90.5, 10.5, 30, 30);
 21569   isPixel(ctx, 95, 10, 0, 0, 0, 0, 0);
 21570   isPixel(ctx, 105, 10, 0, 255, 0, 255, 0);
 21571   isPixel(ctx, 120, 15, 0, 0, 0, 0, 0);
 21572   isPixel(ctx, 120, 25, 0, 255, 0, 255, 0);
 21573   isPixel(ctx, 115, 40, 0, 0, 0, 0, 0);
 21574   isPixel(ctx, 105, 40, 0, 255, 0, 255, 0);
 21575   isPixel(ctx, 90, 35, 0, 0, 0, 0, 0);
 21576   isPixel(ctx, 90, 25, 0, 255, 0, 255, 0);
 21578 </script>
 21580 <p>Canvas test: test_opaque</p>
 21581 <canvas id="c688" width="150" height="50"></canvas>
 21582 <script type="text/javascript">
 21584 function test_opaque() {
 21585   var c = document.getElementById("c688");
 21586   var ctx = c.getContext("2d", {alpha: false});
 21587   ctx.fillStyle = "green";
 21588   ctx.fillRect(0,0,10,10);
 21589   ctx.fillStyle = "rgba(255,0,0,.5)";
 21590   ctx.fillRect(10,0,10,10);
 21592   isPixel(ctx, 20, 20, 0, 0, 0, 255, 0);
 21593   isPixel(ctx, 5, 5, 0, 128, 0, 255, 0);
 21594   isPixel(ctx, 15, 5, 128, 0, 0, 255, 0);
 21596 </script>
 21598 <script>
 21600 function asyncTestsDone() {
 21601 	if (isDone_test_2d_drawImage_animated_apng &&
 21602 		isDone_test_2d_drawImage_animated_gif) {
 21603 		SimpleTest.finish();
 21604 	} else {
 21605 		setTimeout(asyncTestsDone, 500);
 21609 function runTests() {
 21610 /**
 21611  * xor and lighter aren't well handled by cairo; they mostly work, but we don't want
 21612  * to test that
 21613  */
 21614  //test_2d_composite_solid_lighter();
 21615  //test_2d_composite_transparent_xor();
 21616  //test_2d_composite_solid_xor();
 21617  //test_2d_composite_transparent_lighter();
 21618  //test_2d_composite_image_xor();
 21619  //test_2d_composite_image_lighter();
 21620  //test_2d_composite_canvas_xor();
 21621  //test_2d_composite_canvas_lighter();
 21622  //test_2d_composite_clip_xor();
 21623  //test_2d_composite_clip_lighter();
 21625 /**
 21626  * Temporarily disabled tests; unbounded operators changed behaviour, need to reevaluate tests
 21627  */
 21628  //test_2d_composite_canvas_destination_atop();
 21629  //test_2d_composite_canvas_destination_in();
 21630  //test_2d_composite_canvas_source_in();
 21631  //test_2d_composite_canvas_source_out();
 21632  //test_2d_composite_image_destination_atop();
 21633  //test_2d_composite_image_destination_in();
 21634  //test_2d_composite_image_source_in();
 21635  //test_2d_composite_image_source_out();
 21637  /**
 21638   * These tests only pass on Mac OS X >= 10.5; see bug 450114
 21639   */
 21640  //test_2d_gradient_radial_equal();
 21641  //test_2d_gradient_radial_touch1();
 21642  //test_2d_gradient_radial_touch2();
 21643  //test_2d_gradient_radial_touch3();
 21645  /**
 21646   * These 19 tests receive special makefile treatment
 21647   */
 21648  //test_2d_composite_uncovered_image_destination_atop();
 21649  //test_2d_composite_uncovered_image_destination_in();
 21650  //test_2d_composite_uncovered_image_source_in();
 21651  //test_2d_composite_uncovered_image_source_out();
 21652  //test_2d_gradient_radial_cone_behind();
 21653  //test_2d_gradient_radial_cone_beside();
 21654  //test_2d_gradient_radial_cone_front();
 21655  //test_2d_gradient_radial_cone_shape2();
 21656  //test_2d_gradient_radial_cone_top();
 21657  //test_2d_gradient_radial_inside2();
 21658  //test_2d_gradient_radial_inside3();
 21659  //test_2d_gradient_radial_outside1();
 21660  //test_2d_gradient_radial_outside2();
 21661  //test_2d_gradient_radial_outside3();
 21662  //test_2d_line_cap_closed();
 21663  //test_2d_line_join_parallel();
 21664  //test_2d_path_arc_shape_3();
 21665  //test_2d_path_rect_selfintersect();
 21666  //test_2d_strokeRect_zero_5();
 21668  /**
 21669   * Other tests not being run
 21670   */
 21671  //test_2d_composite_uncovered_fill_destination_atop();
 21672  //test_2d_composite_uncovered_fill_destination_in();
 21673  //test_2d_composite_uncovered_fill_source_in();
 21674  //test_2d_composite_uncovered_fill_source_out();
 21675  //test_2d_composite_uncovered_pattern_destination_atop();
 21676  //test_2d_composite_uncovered_pattern_destination_in();
 21677  //test_2d_composite_uncovered_pattern_source_in();
 21678  //test_2d_composite_uncovered_pattern_source_out();
 21680  //test_2d_path_rect_zero_6();	// This test is bogus according to the spec; see bug 407107
 21682  // These tests are bogus according to the spec: shadows should not be 
 21683  // drawn if shadowBlur, shadowOffsetX, and shadowOffsetY are all zero, whic
 21684  // they are in these tests
 21685  //test_2d_shadow_composite_3();
 21686  //test_2d_shadow_composite_4();
 21687  try {
 21688   test_2d_canvas_readonly();
 21689  } catch (e) {
 21690   ok(false, "unexpected exception thrown in: test_2d_canvas_readonly");
 21692  try {
 21693   test_2d_canvas_reference();
 21694  } catch (e) {
 21695   ok(false, "unexpected exception thrown in: test_2d_canvas_reference");
 21697  try {
 21698   test_2d_clearRect_basic();
 21699  } catch (e) {
 21700   ok(false, "unexpected exception thrown in: test_2d_clearRect_basic");
 21702  try {
 21703   test_2d_clearRect_clip();
 21704  } catch (e) {
 21705   ok(false, "unexpected exception thrown in: test_2d_clearRect_clip");
 21707  try {
 21708   test_2d_clearRect_globalalpha();
 21709  } catch (e) {
 21710   ok(false, "unexpected exception thrown in: test_2d_clearRect_globalalpha");
 21712  try {
 21713   test_2d_clearRect_globalcomposite();
 21714  } catch (e) {
 21715   ok(false, "unexpected exception thrown in: test_2d_clearRect_globalcomposite");
 21717  try {
 21718   test_2d_clearRect_negative();
 21719  } catch (e) {
 21720   ok(false, "unexpected exception thrown in: test_2d_clearRect_negative");
 21722  try {
 21723   test_2d_clearRect_nonfinite();
 21724  } catch (e) {
 21725   ok(false, "unexpected exception thrown in: test_2d_clearRect_nonfinite");
 21727  try {
 21728   test_2d_clearRect_path();
 21729  } catch (e) {
 21730   ok(false, "unexpected exception thrown in: test_2d_clearRect_path");
 21732  try {
 21733   test_2d_clearRect_shadow();
 21734  } catch (e) {
 21735   ok(false, "unexpected exception thrown in: test_2d_clearRect_shadow");
 21737  try {
 21738   test_2d_clearRect_transform();
 21739  } catch (e) {
 21740   ok(false, "unexpected exception thrown in: test_2d_clearRect_transform");
 21742  try {
 21743   test_2d_clearRect_zero();
 21744  } catch (e) {
 21745   ok(false, "unexpected exception thrown in: test_2d_clearRect_zero");
 21747  try {
 21748   test_2d_composite_canvas_copy();
 21749  } catch (e) {
 21750   ok(false, "unexpected exception thrown in: test_2d_composite_canvas_copy");
 21752  try {
 21753   test_2d_composite_canvas_destination_out();
 21754  } catch (e) {
 21755   ok(false, "unexpected exception thrown in: test_2d_composite_canvas_destination_out");
 21757  try {
 21758   test_2d_composite_canvas_destination_over();
 21759  } catch (e) {
 21760   ok(false, "unexpected exception thrown in: test_2d_composite_canvas_destination_over");
 21762  try {
 21763   test_2d_composite_canvas_source_atop();
 21764  } catch (e) {
 21765   ok(false, "unexpected exception thrown in: test_2d_composite_canvas_source_atop");
 21767  try {
 21768   test_2d_composite_canvas_source_over();
 21769  } catch (e) {
 21770   ok(false, "unexpected exception thrown in: test_2d_composite_canvas_source_over");
 21772  try {
 21773   test_2d_composite_clip_copy();
 21774  } catch (e) {
 21775   ok(false, "unexpected exception thrown in: test_2d_composite_clip_copy");
 21777  try {
 21778   test_2d_composite_clip_destination_atop();
 21779  } catch (e) {
 21780   ok(false, "unexpected exception thrown in: test_2d_composite_clip_destination_atop");
 21782  try {
 21783   test_2d_composite_clip_destination_in();
 21784  } catch (e) {
 21785   ok(false, "unexpected exception thrown in: test_2d_composite_clip_destination_in");
 21787  try {
 21788   test_2d_composite_clip_destination_out();
 21789  } catch (e) {
 21790   ok(false, "unexpected exception thrown in: test_2d_composite_clip_destination_out");
 21792  try {
 21793   test_2d_composite_clip_destination_over();
 21794  } catch (e) {
 21795   ok(false, "unexpected exception thrown in: test_2d_composite_clip_destination_over");
 21797  try {
 21798   test_2d_composite_clip_source_atop();
 21799  } catch (e) {
 21800   ok(false, "unexpected exception thrown in: test_2d_composite_clip_source_atop");
 21802  try {
 21803   test_2d_composite_clip_source_in();
 21804  } catch (e) {
 21805   ok(false, "unexpected exception thrown in: test_2d_composite_clip_source_in");
 21807  try {
 21808   test_2d_composite_clip_source_out();
 21809  } catch (e) {
 21810   ok(false, "unexpected exception thrown in: test_2d_composite_clip_source_out");
 21812  try {
 21813   test_2d_composite_clip_source_over();
 21814  } catch (e) {
 21815   ok(false, "unexpected exception thrown in: test_2d_composite_clip_source_over");
 21817  try {
 21818   test_2d_composite_globalAlpha_canvas();
 21819  } catch (e) {
 21820   ok(false, "unexpected exception thrown in: test_2d_composite_globalAlpha_canvas");
 21822  try {
 21823   test_2d_composite_globalAlpha_canvaspattern();
 21824  } catch (e) {
 21825   ok(false, "unexpected exception thrown in: test_2d_composite_globalAlpha_canvaspattern");
 21827  try {
 21828   test_2d_composite_globalAlpha_default();
 21829  } catch (e) {
 21830   ok(false, "unexpected exception thrown in: test_2d_composite_globalAlpha_default");
 21832  try {
 21833   test_2d_composite_globalAlpha_fill();
 21834  } catch (e) {
 21835   ok(false, "unexpected exception thrown in: test_2d_composite_globalAlpha_fill");
 21837  try {
 21838   test_2d_composite_globalAlpha_image();
 21839  } catch (e) {
 21840   ok(false, "unexpected exception thrown in: test_2d_composite_globalAlpha_image");
 21842  try {
 21843   test_2d_composite_globalAlpha_imagepattern();
 21844  } catch (e) {
 21845   ok(false, "unexpected exception thrown in: test_2d_composite_globalAlpha_imagepattern");
 21847  try {
 21848   test_2d_composite_globalAlpha_invalid();
 21849  } catch (e) {
 21850   ok(false, "unexpected exception thrown in: test_2d_composite_globalAlpha_invalid");
 21852  try {
 21853   test_2d_composite_globalAlpha_range();
 21854  } catch (e) {
 21855   ok(false, "unexpected exception thrown in: test_2d_composite_globalAlpha_range");
 21857  try {
 21858   test_2d_composite_image_copy();
 21859  } catch (e) {
 21860   ok(false, "unexpected exception thrown in: test_2d_composite_image_copy");
 21862  try {
 21863   test_2d_composite_image_destination_out();
 21864  } catch (e) {
 21865   ok(false, "unexpected exception thrown in: test_2d_composite_image_destination_out");
 21867  try {
 21868   test_2d_composite_image_destination_over();
 21869  } catch (e) {
 21870   ok(false, "unexpected exception thrown in: test_2d_composite_image_destination_over");
 21872  try {
 21873   test_2d_composite_image_source_atop();
 21874  } catch (e) {
 21875   ok(false, "unexpected exception thrown in: test_2d_composite_image_source_atop");
 21877  try {
 21878   test_2d_composite_image_source_over();
 21879  } catch (e) {
 21880   ok(false, "unexpected exception thrown in: test_2d_composite_image_source_over");
 21882  try {
 21883   test_2d_composite_operation_casesensitive();
 21884  } catch (e) {
 21885   ok(false, "unexpected exception thrown in: test_2d_composite_operation_casesensitive");
 21887  try {
 21888   test_2d_composite_operation_clear();
 21889  } catch (e) {
 21890   ok(false, "unexpected exception thrown in: test_2d_composite_operation_clear");
 21892  try {
 21893   test_2d_composite_operation_darker();
 21894  } catch (e) {
 21895   ok(false, "unexpected exception thrown in: test_2d_composite_operation_darker");
 21897  try {
 21898   test_2d_composite_operation_default();
 21899  } catch (e) {
 21900   ok(false, "unexpected exception thrown in: test_2d_composite_operation_default");
 21902  try {
 21903   test_2d_composite_operation_get();
 21904  } catch (e) {
 21905   ok(false, "unexpected exception thrown in: test_2d_composite_operation_get");
 21907  try {
 21908   test_2d_composite_operation_highlight();
 21909  } catch (e) {
 21910   ok(false, "unexpected exception thrown in: test_2d_composite_operation_highlight");
 21912  try {
 21913   test_2d_composite_operation_nullsuffix();
 21914  } catch (e) {
 21915   ok(false, "unexpected exception thrown in: test_2d_composite_operation_nullsuffix");
 21917  try {
 21918   test_2d_composite_operation_over();
 21919  } catch (e) {
 21920   ok(false, "unexpected exception thrown in: test_2d_composite_operation_over");
 21922  try {
 21923   test_2d_composite_operation_unrecognised();
 21924  } catch (e) {
 21925   ok(false, "unexpected exception thrown in: test_2d_composite_operation_unrecognised");
 21927  try {
 21928   test_2d_composite_solid_copy();
 21929  } catch (e) {
 21930   ok(false, "unexpected exception thrown in: test_2d_composite_solid_copy");
 21932  try {
 21933   test_2d_composite_solid_destination_atop();
 21934  } catch (e) {
 21935   ok(false, "unexpected exception thrown in: test_2d_composite_solid_destination_atop");
 21937  try {
 21938   test_2d_composite_solid_destination_in();
 21939  } catch (e) {
 21940   ok(false, "unexpected exception thrown in: test_2d_composite_solid_destination_in");
 21942  try {
 21943   test_2d_composite_solid_destination_out();
 21944  } catch (e) {
 21945   ok(false, "unexpected exception thrown in: test_2d_composite_solid_destination_out");
 21947  try {
 21948   test_2d_composite_solid_destination_over();
 21949  } catch (e) {
 21950   ok(false, "unexpected exception thrown in: test_2d_composite_solid_destination_over");
 21952  try {
 21953   test_2d_composite_solid_source_atop();
 21954  } catch (e) {
 21955   ok(false, "unexpected exception thrown in: test_2d_composite_solid_source_atop");
 21957  try {
 21958   test_2d_composite_solid_source_in();
 21959  } catch (e) {
 21960   ok(false, "unexpected exception thrown in: test_2d_composite_solid_source_in");
 21962  try {
 21963   test_2d_composite_solid_source_out();
 21964  } catch (e) {
 21965   ok(false, "unexpected exception thrown in: test_2d_composite_solid_source_out");
 21967  try {
 21968   test_2d_composite_solid_source_over();
 21969  } catch (e) {
 21970   ok(false, "unexpected exception thrown in: test_2d_composite_solid_source_over");
 21972  try {
 21973   test_2d_composite_transparent_copy();
 21974  } catch (e) {
 21975   ok(false, "unexpected exception thrown in: test_2d_composite_transparent_copy");
 21977  try {
 21978   test_2d_composite_transparent_destination_atop();
 21979  } catch (e) {
 21980   ok(false, "unexpected exception thrown in: test_2d_composite_transparent_destination_atop");
 21982  try {
 21983   test_2d_composite_transparent_destination_in();
 21984  } catch (e) {
 21985   ok(false, "unexpected exception thrown in: test_2d_composite_transparent_destination_in");
 21987  try {
 21988   test_2d_composite_transparent_destination_out();
 21989  } catch (e) {
 21990   ok(false, "unexpected exception thrown in: test_2d_composite_transparent_destination_out");
 21992  try {
 21993   test_2d_composite_transparent_destination_over();
 21994  } catch (e) {
 21995   ok(false, "unexpected exception thrown in: test_2d_composite_transparent_destination_over");
 21997  try {
 21998   test_2d_composite_transparent_source_atop();
 21999  } catch (e) {
 22000   ok(false, "unexpected exception thrown in: test_2d_composite_transparent_source_atop");
 22002  try {
 22003   test_2d_composite_transparent_source_in();
 22004  } catch (e) {
 22005   ok(false, "unexpected exception thrown in: test_2d_composite_transparent_source_in");
 22007  try {
 22008   test_2d_composite_transparent_source_out();
 22009  } catch (e) {
 22010   ok(false, "unexpected exception thrown in: test_2d_composite_transparent_source_out");
 22012  try {
 22013   test_2d_composite_transparent_source_over();
 22014  } catch (e) {
 22015   ok(false, "unexpected exception thrown in: test_2d_composite_transparent_source_over");
 22017  try {
 22018   test_2d_composite_uncovered_fill_copy();
 22019  } catch (e) {
 22020   ok(false, "unexpected exception thrown in: test_2d_composite_uncovered_fill_copy");
 22022  try {
 22023   test_2d_composite_uncovered_image_copy();
 22024  } catch (e) {
 22025   ok(false, "unexpected exception thrown in: test_2d_composite_uncovered_image_copy");
 22027  try {
 22028   test_2d_composite_uncovered_pattern_copy();
 22029  } catch (e) {
 22030   ok(false, "unexpected exception thrown in: test_2d_composite_uncovered_pattern_copy");
 22032  try {
 22033   test_2d_drawImage_3arg();
 22034  } catch (e) {
 22035   ok(false, "unexpected exception thrown in: test_2d_drawImage_3arg");
 22037  try {
 22038   test_2d_drawImage_5arg();
 22039  } catch (e) {
 22040   ok(false, "unexpected exception thrown in: test_2d_drawImage_5arg");
 22042  try {
 22043   test_2d_drawImage_9arg_basic();
 22044  } catch (e) {
 22045   ok(false, "unexpected exception thrown in: test_2d_drawImage_9arg_basic");
 22047  try {
 22048   test_2d_drawImage_9arg_destpos();
 22049  } catch (e) {
 22050   ok(false, "unexpected exception thrown in: test_2d_drawImage_9arg_destpos");
 22052  try {
 22053   test_2d_drawImage_9arg_destsize();
 22054  } catch (e) {
 22055   ok(false, "unexpected exception thrown in: test_2d_drawImage_9arg_destsize");
 22057  try {
 22058   test_2d_drawImage_9arg_sourcepos();
 22059  } catch (e) {
 22060   ok(false, "unexpected exception thrown in: test_2d_drawImage_9arg_sourcepos");
 22062  try {
 22063   test_2d_drawImage_9arg_sourcesize();
 22064  } catch (e) {
 22065   ok(false, "unexpected exception thrown in: test_2d_drawImage_9arg_sourcesize");
 22067  try {
 22068   test_2d_drawImage_alpha();
 22069  } catch (e) {
 22070   ok(false, "unexpected exception thrown in: test_2d_drawImage_alpha");
 22072  try {
 22073   test_2d_drawImage_animated_poster();
 22074  } catch (e) {
 22075   ok(false, "unexpected exception thrown in: test_2d_drawImage_animated_poster");
 22077  try {
 22078   test_2d_drawImage_broken();
 22079  } catch (e) {
 22080   ok(false, "unexpected exception thrown in: test_2d_drawImage_broken");
 22082  try {
 22083   test_2d_drawImage_canvas();
 22084  } catch (e) {
 22085   ok(false, "unexpected exception thrown in: test_2d_drawImage_canvas");
 22087  try {
 22088   test_2d_drawImage_clip();
 22089  } catch (e) {
 22090   ok(false, "unexpected exception thrown in: test_2d_drawImage_clip");
 22092  try {
 22093   test_2d_drawImage_composite();
 22094  } catch (e) {
 22095   ok(false, "unexpected exception thrown in: test_2d_drawImage_composite");
 22097  try {
 22098   test_2d_drawImage_floatsource();
 22099  } catch (e) {
 22100   ok(false, "unexpected exception thrown in: test_2d_drawImage_floatsource");
 22102  try {
 22103   test_2d_drawImage_incomplete();
 22104  } catch (e) {
 22105   ok(false, "unexpected exception thrown in: test_2d_drawImage_incomplete");
 22107  try {
 22108   test_2d_drawImage_negativedest();
 22109  } catch (e) {
 22110   ok(false, "unexpected exception thrown in: test_2d_drawImage_negativedest");
 22112  try {
 22113   test_2d_drawImage_negativesource();
 22114  } catch (e) {
 22115   ok(false, "unexpected exception thrown in: test_2d_drawImage_negativesource");
 22117  try {
 22118   test_2d_drawImage_nonfinite();
 22119  } catch (e) {
 22120   ok(false, "unexpected exception thrown in: test_2d_drawImage_nonfinite");
 22122  try {
 22123   test_2d_drawImage_nowrap();
 22124  } catch (e) {
 22125   ok(false, "unexpected exception thrown in: test_2d_drawImage_nowrap");
 22127  try {
 22128   test_2d_drawImage_null();
 22129  } catch (e) {
 22130   ok(false, "unexpected exception thrown in: test_2d_drawImage_null");
 22132  try {
 22133   test_2d_drawImage_outsidesource();
 22134  } catch (e) {
 22135   ok(false, "unexpected exception thrown in: test_2d_drawImage_outsidesource");
 22137  try {
 22138   test_2d_drawImage_path();
 22139  } catch (e) {
 22140   ok(false, "unexpected exception thrown in: test_2d_drawImage_path");
 22142  try {
 22143   test_2d_drawImage_self_1();
 22144  } catch (e) {
 22145   ok(false, "unexpected exception thrown in: test_2d_drawImage_self_1");
 22147  try {
 22148   test_2d_drawImage_self_2();
 22149  } catch (e) {
 22150   ok(false, "unexpected exception thrown in: test_2d_drawImage_self_2");
 22152  try {
 22153   test_2d_drawImage_transform();
 22154  } catch (e) {
 22155   ok(false, "unexpected exception thrown in: test_2d_drawImage_transform");
 22157  try {
 22158   test_2d_drawImage_wrongtype();
 22159  } catch (e) {
 22160   ok(false, "unexpected exception thrown in: test_2d_drawImage_wrongtype");
 22162  try {
 22163   test_2d_drawImage_zerosource();
 22164  } catch (e) {
 22165   ok(false, "unexpected exception thrown in: test_2d_drawImage_zerosource");
 22167  try {
 22168   test_2d_fillRect_basic();
 22169  } catch (e) {
 22170   ok(false, "unexpected exception thrown in: test_2d_fillRect_basic");
 22172  try {
 22173   test_2d_fillRect_clip();
 22174  } catch (e) {
 22175   ok(false, "unexpected exception thrown in: test_2d_fillRect_clip");
 22177  try {
 22178   test_2d_fillRect_negative();
 22179  } catch (e) {
 22180   ok(false, "unexpected exception thrown in: test_2d_fillRect_negative");
 22182  try {
 22183   test_2d_fillRect_nonfinite();
 22184  } catch (e) {
 22185   ok(false, "unexpected exception thrown in: test_2d_fillRect_nonfinite");
 22187  try {
 22188   test_2d_fillRect_path();
 22189  } catch (e) {
 22190   ok(false, "unexpected exception thrown in: test_2d_fillRect_path");
 22192  try {
 22193   test_2d_fillRect_shadow();
 22194  } catch (e) {
 22195   ok(false, "unexpected exception thrown in: test_2d_fillRect_shadow");
 22197  try {
 22198   test_2d_fillRect_transform();
 22199  } catch (e) {
 22200   ok(false, "unexpected exception thrown in: test_2d_fillRect_transform");
 22202  try {
 22203   test_2d_fillRect_zero();
 22204  } catch (e) {
 22205   ok(false, "unexpected exception thrown in: test_2d_fillRect_zero");
 22207  try {
 22208   test_2d_fillStyle_default();
 22209  } catch (e) {
 22210   ok(false, "unexpected exception thrown in: test_2d_fillStyle_default");
 22212  try {
 22213   test_2d_fillStyle_get_semitransparent();
 22214  } catch (e) {
 22215   ok(false, "unexpected exception thrown in: test_2d_fillStyle_get_semitransparent");
 22217  try {
 22218   test_2d_fillStyle_get_solid();
 22219  } catch (e) {
 22220   ok(false, "unexpected exception thrown in: test_2d_fillStyle_get_solid");
 22222  try {
 22223   test_2d_fillStyle_get_transparent();
 22224  } catch (e) {
 22225   ok(false, "unexpected exception thrown in: test_2d_fillStyle_get_transparent");
 22227  try {
 22228   test_2d_fillStyle_invalidstring();
 22229  } catch (e) {
 22230   ok(false, "unexpected exception thrown in: test_2d_fillStyle_invalidstring");
 22232  try {
 22233   test_2d_fillStyle_invalidtype();
 22234  } catch (e) {
 22235   ok(false, "unexpected exception thrown in: test_2d_fillStyle_invalidtype");
 22237  try {
 22238   test_2d_fillStyle_parse_current_basic();
 22239  } catch (e) {
 22240   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_current_basic");
 22242  try {
 22243   test_2d_fillStyle_parse_current_changed();
 22244  } catch (e) {
 22245   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_current_changed");
 22247  try {
 22248   test_2d_fillStyle_parse_current_removed();
 22249  } catch (e) {
 22250   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_current_removed");
 22252  try {
 22253   test_2d_fillStyle_parse_hex3();
 22254  } catch (e) {
 22255   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hex3");
 22257  try {
 22258   test_2d_fillStyle_parse_hex6();
 22259  } catch (e) {
 22260   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hex6");
 22262  try {
 22263   test_2d_fillStyle_parse_hsl_1();
 22264  } catch (e) {
 22265   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsl_1");
 22267  try {
 22268   test_2d_fillStyle_parse_hsl_2();
 22269  } catch (e) {
 22270   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsl_2");
 22272  try {
 22273   test_2d_fillStyle_parse_hsl_3();
 22274  } catch (e) {
 22275   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsl_3");
 22277  try {
 22278   test_2d_fillStyle_parse_hsl_4();
 22279  } catch (e) {
 22280   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsl_4");
 22282  try {
 22283   test_2d_fillStyle_parse_hsl_5();
 22284  } catch (e) {
 22285   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsl_5");
 22287  try {
 22288   test_2d_fillStyle_parse_hsl_clamp_1();
 22289  } catch (e) {
 22290   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsl_clamp_1");
 22292  try {
 22293   test_2d_fillStyle_parse_hsl_clamp_2();
 22294  } catch (e) {
 22295   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsl_clamp_2");
 22297  try {
 22298   test_2d_fillStyle_parse_hsl_clamp_3();
 22299  } catch (e) {
 22300   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsl_clamp_3");
 22302  try {
 22303   test_2d_fillStyle_parse_hsl_clamp_4();
 22304  } catch (e) {
 22305   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsl_clamp_4");
 22307  try {
 22308   test_2d_fillStyle_parse_hsla_1();
 22309  } catch (e) {
 22310   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsla_1");
 22312  try {
 22313   test_2d_fillStyle_parse_hsla_2();
 22314  } catch (e) {
 22315   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsla_2");
 22317  try {
 22318   test_2d_fillStyle_parse_hsla_clamp_1();
 22319  } catch (e) {
 22320   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsla_clamp_1");
 22322  try {
 22323   test_2d_fillStyle_parse_hsla_clamp_2();
 22324  } catch (e) {
 22325   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsla_clamp_2");
 22327  try {
 22328   test_2d_fillStyle_parse_hsla_clamp_3();
 22329  } catch (e) {
 22330   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsla_clamp_3");
 22332  try {
 22333   test_2d_fillStyle_parse_hsla_clamp_4();
 22334  } catch (e) {
 22335   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsla_clamp_4");
 22337  try {
 22338   test_2d_fillStyle_parse_hsla_clamp_5();
 22339  } catch (e) {
 22340   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsla_clamp_5");
 22342  try {
 22343   test_2d_fillStyle_parse_hsla_clamp_6();
 22344  } catch (e) {
 22345   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_hsla_clamp_6");
 22347  try {
 22348   test_2d_fillStyle_parse_html4();
 22349  } catch (e) {
 22350   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_html4");
 22352  try {
 22353   test_2d_fillStyle_parse_invalid_hex3();
 22354  } catch (e) {
 22355   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_hex3");
 22357  try {
 22358   test_2d_fillStyle_parse_invalid_hex6();
 22359  } catch (e) {
 22360   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_hex6");
 22362  try {
 22363   test_2d_fillStyle_parse_invalid_hsl_1();
 22364  } catch (e) {
 22365   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_hsl_1");
 22367  try {
 22368   test_2d_fillStyle_parse_invalid_hsl_2();
 22369  } catch (e) {
 22370   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_hsl_2");
 22372  try {
 22373   test_2d_fillStyle_parse_invalid_hsl_3();
 22374  } catch (e) {
 22375   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_hsl_3");
 22377  try {
 22378   test_2d_fillStyle_parse_invalid_hsl_4();
 22379  } catch (e) {
 22380   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_hsl_4");
 22382  try {
 22383   test_2d_fillStyle_parse_invalid_hsl_5();
 22384  } catch (e) {
 22385   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_hsl_5");
 22387  try {
 22388   test_2d_fillStyle_parse_invalid_hsla_1();
 22389  } catch (e) {
 22390   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_hsla_1");
 22392  try {
 22393   test_2d_fillStyle_parse_invalid_hsla_2();
 22394  } catch (e) {
 22395   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_hsla_2");
 22397  try {
 22398    test_2d_fillStyle_parse_invalid_name_1()
 22399  } catch (e) {
 22400   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_name_1");
 22402  try {
 22403    test_2d_fillStyle_parse_invalid_name_2()
 22404  } catch (e) {
 22405   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_name_2");
 22407  try {
 22408    test_2d_fillStyle_parse_invalid_name_3()
 22409  } catch (e) {
 22410   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_name_3");
 22412  try {
 22413   test_2d_fillStyle_parse_invalid_rgb_1();
 22414  } catch (e) {
 22415   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_rgb_1");
 22417  try {
 22418   test_2d_fillStyle_parse_invalid_rgb_2();
 22419  } catch (e) {
 22420   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_rgb_2");
 22422  try {
 22423   test_2d_fillStyle_parse_invalid_rgb_3();
 22424  } catch (e) {
 22425   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_rgb_3");
 22427  try {
 22428   test_2d_fillStyle_parse_invalid_rgb_4();
 22429  } catch (e) {
 22430   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_rgb_4");
 22432  try {
 22433   test_2d_fillStyle_parse_invalid_rgb_5();
 22434  } catch (e) {
 22435   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_rgb_5");
 22437  try {
 22438   test_2d_fillStyle_parse_invalid_rgb_6();
 22439  } catch (e) {
 22440   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_rgb_6");
 22442  try {
 22443   test_2d_fillStyle_parse_invalid_rgb_7();
 22444  } catch (e) {
 22445   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_rgb_7");
 22447  try {
 22448   test_2d_fillStyle_parse_invalid_rgba_1();
 22449  } catch (e) {
 22450   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_rgba_1");
 22452  try {
 22453   test_2d_fillStyle_parse_invalid_rgba_2();
 22454  } catch (e) {
 22455   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_rgba_2");
 22457  try {
 22458   test_2d_fillStyle_parse_invalid_rgba_3();
 22459  } catch (e) {
 22460   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_rgba_3");
 22462  try {
 22463   test_2d_fillStyle_parse_invalid_rgba_4();
 22464  } catch (e) {
 22465   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_rgba_4");
 22467  try {
 22468   test_2d_fillStyle_parse_invalid_rgba_5();
 22469  } catch (e) {
 22470   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_invalid_rgba_5");
 22472  try {
 22473   test_2d_fillStyle_parse_rgb_clamp_1();
 22474  } catch (e) {
 22475   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgb_clamp_1");
 22477  try {
 22478   test_2d_fillStyle_parse_rgb_clamp_2();
 22479  } catch (e) {
 22480   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgb_clamp_2");
 22482  try {
 22483   test_2d_fillStyle_parse_rgb_clamp_3();
 22484  } catch (e) {
 22485   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgb_clamp_3");
 22487  try {
 22488   test_2d_fillStyle_parse_rgb_clamp_4();
 22489  } catch (e) {
 22490   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgb_clamp_4");
 22492  try {
 22493   test_2d_fillStyle_parse_rgb_clamp_5();
 22494  } catch (e) {
 22495   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgb_clamp_5");
 22497  try {
 22498   test_2d_fillStyle_parse_rgb_num();
 22499  } catch (e) {
 22500   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgb_num");
 22502  try {
 22503   test_2d_fillStyle_parse_rgb_percent();
 22504  } catch (e) {
 22505   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgb_percent");
 22507  try {
 22508   test_2d_fillStyle_parse_rgba_clamp_1();
 22509  } catch (e) {
 22510   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgba_clamp_1");
 22512  try {
 22513   test_2d_fillStyle_parse_rgba_clamp_2();
 22514  } catch (e) {
 22515   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgba_clamp_2");
 22517  try {
 22518   test_2d_fillStyle_parse_rgba_num_1();
 22519  } catch (e) {
 22520   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgba_num_1");
 22522  try {
 22523   test_2d_fillStyle_parse_rgba_num_2();
 22524  } catch (e) {
 22525   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgba_num_2");
 22527  try {
 22528   test_2d_fillStyle_parse_rgba_percent();
 22529  } catch (e) {
 22530   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgba_percent");
 22532  try {
 22533   test_2d_fillStyle_parse_rgba_solid_1();
 22534  } catch (e) {
 22535   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgba_solid_1");
 22537  try {
 22538   test_2d_fillStyle_parse_rgba_solid_2();
 22539  } catch (e) {
 22540   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_rgba_solid_2");
 22542  try {
 22543   test_2d_fillStyle_parse_svg_1();
 22544  } catch (e) {
 22545   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_svg_1");
 22547  try {
 22548   test_2d_fillStyle_parse_svg_2();
 22549  } catch (e) {
 22550   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_svg_2");
 22552  try {
 22553   test_2d_fillStyle_parse_system();
 22554  } catch (e) {
 22555   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_system");
 22557  try {
 22558   test_2d_fillStyle_parse_transparent_1();
 22559  } catch (e) {
 22560   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_transparent_1");
 22562  try {
 22563   test_2d_fillStyle_parse_transparent_2();
 22564  } catch (e) {
 22565   ok(false, "unexpected exception thrown in: test_2d_fillStyle_parse_transparent_2");
 22567  try {
 22568   test_2d_getcontext_exists();
 22569  } catch (e) {
 22570   ok(false, "unexpected exception thrown in: test_2d_getcontext_exists");
 22572  try {
 22573   test_2d_getcontext_shared();
 22574  } catch (e) {
 22575   ok(false, "unexpected exception thrown in: test_2d_getcontext_shared");
 22577  try {
 22578   test_2d_getcontext_unique();
 22579  } catch (e) {
 22580   ok(false, "unexpected exception thrown in: test_2d_getcontext_unique");
 22582  try {
 22583   test_2d_gradient_empty();
 22584  } catch (e) {
 22585   ok(false, "unexpected exception thrown in: test_2d_gradient_empty");
 22587  try {
 22588   test_2d_gradient_interpolate_alpha();
 22589  } catch (e) {
 22590   ok(false, "unexpected exception thrown in: test_2d_gradient_interpolate_alpha");
 22592  try {
 22593   test_2d_gradient_interpolate_colour();
 22594  } catch (e) {
 22595   ok(false, "unexpected exception thrown in: test_2d_gradient_interpolate_colour");
 22597  try {
 22598   test_2d_gradient_interpolate_colouralpha();
 22599  } catch (e) {
 22600   ok(false, "unexpected exception thrown in: test_2d_gradient_interpolate_colouralpha");
 22602  try {
 22603   test_2d_gradient_interpolate_multiple();
 22604  } catch (e) {
 22605   ok(false, "unexpected exception thrown in: test_2d_gradient_interpolate_multiple");
 22607  try {
 22608   test_2d_gradient_interpolate_outside();
 22609  } catch (e) {
 22610   ok(false, "unexpected exception thrown in: test_2d_gradient_interpolate_outside");
 22612  try {
 22613   test_2d_gradient_interpolate_overlap();
 22614  } catch (e) {
 22615   ok(false, "unexpected exception thrown in: test_2d_gradient_interpolate_overlap");
 22617  try {
 22618   test_2d_gradient_interpolate_overlap2();
 22619  } catch (e) {
 22620   ok(false, "unexpected exception thrown in: test_2d_gradient_interpolate_overlap2");
 22622  try {
 22623   test_2d_gradient_interpolate_solid();
 22624  } catch (e) {
 22625   ok(false, "unexpected exception thrown in: test_2d_gradient_interpolate_solid");
 22627  try {
 22628   test_2d_gradient_interpolate_vertical();
 22629  } catch (e) {
 22630   ok(false, "unexpected exception thrown in: test_2d_gradient_interpolate_vertical");
 22632  try {
 22633   test_2d_gradient_interpolate_zerosize();
 22634  } catch (e) {
 22635   ok(false, "unexpected exception thrown in: test_2d_gradient_interpolate_zerosize");
 22637  try {
 22638   test_2d_gradient_linear_nonfinite();
 22639  } catch (e) {
 22640   ok(false, "unexpected exception thrown in: test_2d_gradient_linear_nonfinite");
 22642  try {
 22643   test_2d_gradient_linear_transform_1();
 22644  } catch (e) {
 22645   ok(false, "unexpected exception thrown in: test_2d_gradient_linear_transform_1");
 22647  try {
 22648   test_2d_gradient_linear_transform_2();
 22649  } catch (e) {
 22650   ok(false, "unexpected exception thrown in: test_2d_gradient_linear_transform_2");
 22652  try {
 22653   test_2d_gradient_linear_transform_3();
 22654  } catch (e) {
 22655   ok(false, "unexpected exception thrown in: test_2d_gradient_linear_transform_3");
 22657  try {
 22658   test_2d_gradient_object_compare();
 22659  } catch (e) {
 22660   ok(false, "unexpected exception thrown in: test_2d_gradient_object_compare");
 22662  try {
 22663   test_2d_gradient_object_crosscanvas();
 22664  } catch (e) {
 22665   ok(false, "unexpected exception thrown in: test_2d_gradient_object_crosscanvas");
 22667  try {
 22668   test_2d_gradient_object_invalidcolour();
 22669  } catch (e) {
 22670   ok(false, "unexpected exception thrown in: test_2d_gradient_object_invalidcolour");
 22672  try {
 22673   test_2d_gradient_object_invalidoffset();
 22674  } catch (e) {
 22675   ok(false, "unexpected exception thrown in: test_2d_gradient_object_invalidoffset");
 22677  try {
 22678   test_2d_gradient_object_return();
 22679  } catch (e) {
 22680   ok(false, "unexpected exception thrown in: test_2d_gradient_object_return");
 22682  try {
 22683   test_2d_gradient_object_type();
 22684  } catch (e) {
 22685   ok(false, "unexpected exception thrown in: test_2d_gradient_object_type");
 22687  try {
 22688   test_2d_gradient_object_update();
 22689  } catch (e) {
 22690   ok(false, "unexpected exception thrown in: test_2d_gradient_object_update");
 22692  try {
 22693   test_2d_gradient_radial_cone_bottom();
 22694  } catch (e) {
 22695   ok(false, "unexpected exception thrown in: test_2d_gradient_radial_cone_bottom");
 22697  try {
 22698   test_2d_gradient_radial_cone_cylinder();
 22699  } catch (e) {
 22700   ok(false, "unexpected exception thrown in: test_2d_gradient_radial_cone_cylinder");
 22702  try {
 22703   test_2d_gradient_radial_cone_shape1();
 22704  } catch (e) {
 22705   ok(false, "unexpected exception thrown in: test_2d_gradient_radial_cone_shape1");
 22707  try {
 22708   test_2d_gradient_radial_inside1();
 22709  } catch (e) {
 22710   ok(false, "unexpected exception thrown in: test_2d_gradient_radial_inside1");
 22712  try {
 22713   test_2d_gradient_radial_negative();
 22714  } catch (e) {
 22715   ok(false, "unexpected exception thrown in: test_2d_gradient_radial_negative");
 22717  try {
 22718   test_2d_gradient_radial_nonfinite();
 22719  } catch (e) {
 22720   ok(false, "unexpected exception thrown in: test_2d_gradient_radial_nonfinite");
 22722  try {
 22723   test_2d_gradient_radial_transform_1();
 22724  } catch (e) {
 22725   ok(false, "unexpected exception thrown in: test_2d_gradient_radial_transform_1");
 22727  try {
 22728   test_2d_gradient_radial_transform_2();
 22729  } catch (e) {
 22730   ok(false, "unexpected exception thrown in: test_2d_gradient_radial_transform_2");
 22732  try {
 22733   test_2d_gradient_radial_transform_3();
 22734  } catch (e) {
 22735   ok(false, "unexpected exception thrown in: test_2d_gradient_radial_transform_3");
 22737  try {
 22738   test_2d_imageData_create_basic();
 22739  } catch (e) {
 22740   ok(false, "unexpected exception thrown in: test_2d_imageData_create_basic");
 22742  try {
 22743   test_2d_imageData_create1_basic();
 22744  } catch (e) {
 22745   ok(false, "unexpected exception thrown in: test_2d_imageData_create1_basic");
 22747  try {
 22748   test_2d_imageData_create_initial();
 22749  } catch (e) {
 22750   ok(false, "unexpected exception thrown in: test_2d_imageData_create_initial");
 22752  try {
 22753   test_2d_imageData_create1_initial();
 22754  } catch (e) {
 22755   ok(false, "unexpected exception thrown in: test_2d_imageData_create1_initial");
 22757  try {
 22758   test_2d_imageData_create_large();
 22759  } catch (e) {
 22760   ok(false, "unexpected exception thrown in: test_2d_imageData_create_large");
 22762  try {
 22763   test_2d_imageData_create_negative();
 22764  } catch (e) {
 22765   ok(false, "unexpected exception thrown in: test_2d_imageData_create_negative");
 22767  try {
 22768   test_2d_imageData_create_nonfinite();
 22769  } catch (e) {
 22770   ok(false, "unexpected exception thrown in: test_2d_imageData_create_nonfinite");
 22772  try {
 22773   test_2d_imageData_create_round();
 22774  } catch (e) {
 22775   ok(false, "unexpected exception thrown in: test_2d_imageData_create_round");
 22777  try {
 22778   test_2d_imageData_create_tiny();
 22779  } catch (e) {
 22780   ok(false, "unexpected exception thrown in: test_2d_imageData_create_tiny");
 22782  try {
 22783   test_2d_imageData_create_type();
 22784  } catch (e) {
 22785   ok(false, "unexpected exception thrown in: test_2d_imageData_create_type");
 22787  try {
 22788   test_2d_imageData_create1_type();
 22789  } catch (e) {
 22790   ok(false, "unexpected exception thrown in: test_2d_imageData_create1_type");
 22792  try {
 22793   test_2d_imageData_create_zero();
 22794  } catch (e) {
 22795   ok(false, "unexpected exception thrown in: test_2d_imageData_create_zero");
 22797  try {
 22798   test_2d_imageData_create1_zero();
 22799  } catch (e) {
 22800   ok(false, "unexpected exception thrown in: test_2d_imageData_create1_zero");
 22802  try {
 22803   test_2d_imageData_get_basic();
 22804  } catch (e) {
 22805   ok(false, "unexpected exception thrown in: test_2d_imageData_get_basic");
 22807  try {
 22808   test_2d_imageData_get_clamp();
 22809  } catch (e) {
 22810   ok(false, "unexpected exception thrown in: test_2d_imageData_get_clamp");
 22812  try {
 22813   test_2d_imageData_get_nonfinite();
 22814  } catch (e) {
 22815   ok(false, "unexpected exception thrown in: test_2d_imageData_get_nonfinite");
 22817  try {
 22818   test_2d_imageData_get_nonpremul();
 22819  } catch (e) {
 22820   ok(false, "unexpected exception thrown in: test_2d_imageData_get_nonpremul");
 22822  try {
 22823   test_2d_imageData_get_order_alpha();
 22824  } catch (e) {
 22825   ok(false, "unexpected exception thrown in: test_2d_imageData_get_order_alpha");
 22827  try {
 22828   test_2d_imageData_get_order_cols();
 22829  } catch (e) {
 22830   ok(false, "unexpected exception thrown in: test_2d_imageData_get_order_cols");
 22832  try {
 22833   test_2d_imageData_get_order_rgb();
 22834  } catch (e) {
 22835   ok(false, "unexpected exception thrown in: test_2d_imageData_get_order_rgb");
 22837  try {
 22838   test_2d_imageData_get_order_rows();
 22839  } catch (e) {
 22840   ok(false, "unexpected exception thrown in: test_2d_imageData_get_order_rows");
 22842  try {
 22843   test_2d_imageData_get_range();
 22844  } catch (e) {
 22845   ok(false, "unexpected exception thrown in: test_2d_imageData_get_range");
 22847  try {
 22848   test_2d_imageData_get_source_negative();
 22849  } catch (e) {
 22850   ok(false, "unexpected exception thrown in: test_2d_imageData_get_source_negative");
 22852  try {
 22853   test_2d_imageData_get_source_outside();
 22854  } catch (e) {
 22855   ok(false, "unexpected exception thrown in: test_2d_imageData_get_source_outside");
 22857  try {
 22858   test_2d_imageData_get_source_size();
 22859  } catch (e) {
 22860   ok(false, "unexpected exception thrown in: test_2d_imageData_get_source_size");
 22862  try {
 22863   test_2d_imageData_get_tiny();
 22864  } catch (e) {
 22865   ok(false, "unexpected exception thrown in: test_2d_imageData_get_tiny");
 22867  try {
 22868   test_2d_imageData_get_type();
 22869  } catch (e) {
 22870   ok(false, "unexpected exception thrown in: test_2d_imageData_get_type");
 22872  try {
 22873   test_2d_imageData_get_unaffected();
 22874  } catch (e) {
 22875   ok(false, "unexpected exception thrown in: test_2d_imageData_get_unaffected");
 22877  try {
 22878   test_2d_imageData_get_zero();
 22879  } catch (e) {
 22880   ok(false, "unexpected exception thrown in: test_2d_imageData_get_zero");
 22882  try {
 22883   test_2d_imageData_object_clamp();
 22884  } catch (e) {
 22885   ok(false, "unexpected exception thrown in: test_2d_imageData_object_clamp");
 22887  try {
 22888   test_2d_imageData_object_ctor();
 22889  } catch (e) {
 22890   ok(false, "unexpected exception thrown in: test_2d_imageData_object_ctor");
 22892  try {
 22893   test_2d_imageData_object_nan();
 22894  } catch (e) {
 22895   ok(false, "unexpected exception thrown in: test_2d_imageData_object_nan");
 22897  try {
 22898   test_2d_imageData_object_properties();
 22899  } catch (e) {
 22900   ok(false, "unexpected exception thrown in: test_2d_imageData_object_properties");
 22902  try {
 22903   test_2d_imageData_object_readonly();
 22904  } catch (e) {
 22905   ok(false, "unexpected exception thrown in: test_2d_imageData_object_readonly");
 22907  try {
 22908   test_2d_imageData_object_round();
 22909  } catch (e) {
 22910   ok(false, "unexpected exception thrown in: test_2d_imageData_object_round");
 22912  try {
 22913   test_2d_imageData_object_set();
 22914  } catch (e) {
 22915   ok(false, "unexpected exception thrown in: test_2d_imageData_object_set");
 22917  try {
 22918   test_2d_imageData_object_string();
 22919  } catch (e) {
 22920   ok(false, "unexpected exception thrown in: test_2d_imageData_object_string");
 22922  try {
 22923   test_2d_imageData_object_undefined();
 22924  } catch (e) {
 22925   ok(false, "unexpected exception thrown in: test_2d_imageData_object_undefined");
 22927  try {
 22928   test_2d_imageData_put_alpha();
 22929  } catch (e) {
 22930   ok(false, "unexpected exception thrown in: test_2d_imageData_put_alpha");
 22932  try {
 22933   test_2d_imageData_put_basic();
 22934  } catch (e) {
 22935   ok(false, "unexpected exception thrown in: test_2d_imageData_put_basic");
 22937  try {
 22938   test_2d_imageData_put_clip();
 22939  } catch (e) {
 22940   ok(false, "unexpected exception thrown in: test_2d_imageData_put_clip");
 22942  try {
 22943   test_2d_imageData_put_created();
 22944  } catch (e) {
 22945   ok(false, "unexpected exception thrown in: test_2d_imageData_put_created");
 22947  try {
 22948   test_2d_imageData_put_cross();
 22949  } catch (e) {
 22950   ok(false, "unexpected exception thrown in: test_2d_imageData_put_cross");
 22952  try {
 22953   test_2d_imageData_put_dirty_negative();
 22954  } catch (e) {
 22955   ok(false, "unexpected exception thrown in: test_2d_imageData_put_dirty_negative");
 22957  try {
 22958   test_2d_imageData_put_dirty_outside();
 22959  } catch (e) {
 22960   ok(false, "unexpected exception thrown in: test_2d_imageData_put_dirty_outside");
 22962  try {
 22963   test_2d_imageData_put_dirty_rect1();
 22964  } catch (e) {
 22965   ok(false, "unexpected exception thrown in: test_2d_imageData_put_dirty_rect1");
 22967  try {
 22968   test_2d_imageData_put_dirty_rect2();
 22969  } catch (e) {
 22970   ok(false, "unexpected exception thrown in: test_2d_imageData_put_dirty_rect2");
 22972  try {
 22973   test_2d_imageData_put_dirty_zero();
 22974  } catch (e) {
 22975   ok(false, "unexpected exception thrown in: test_2d_imageData_put_dirty_zero");
 22977  try {
 22978   test_2d_imageData_put_modified();
 22979  } catch (e) {
 22980   ok(false, "unexpected exception thrown in: test_2d_imageData_put_modified");
 22982  try {
 22983   test_2d_imageData_put_nonfinite();
 22984  } catch (e) {
 22985   ok(false, "unexpected exception thrown in: test_2d_imageData_put_nonfinite");
 22987  try {
 22988   test_2d_imageData_put_null();
 22989  } catch (e) {
 22990   ok(false, "unexpected exception thrown in: test_2d_imageData_put_null");
 22992  try {
 22993   test_2d_imageData_put_path();
 22994  } catch (e) {
 22995   ok(false, "unexpected exception thrown in: test_2d_imageData_put_path");
 22997  try {
 22998   test_2d_imageData_put_unaffected();
 22999  } catch (e) {
 23000   ok(false, "unexpected exception thrown in: test_2d_imageData_put_unaffected");
 23002  try {
 23003   test_2d_imageData_put_unchanged();
 23004  } catch (e) {
 23005   ok(false, "unexpected exception thrown in: test_2d_imageData_put_unchanged");
 23007  try {
 23008   test_2d_imageData_put_wrongtype();
 23009  } catch (e) {
 23010   ok(false, "unexpected exception thrown in: test_2d_imageData_put_wrongtype");
 23012  try {
 23013   test_2d_line_cap_butt();
 23014  } catch (e) {
 23015   ok(false, "unexpected exception thrown in: test_2d_line_cap_butt");
 23017  try {
 23018   test_2d_line_cap_invalid();
 23019  } catch (e) {
 23020   ok(false, "unexpected exception thrown in: test_2d_line_cap_invalid");
 23022  try {
 23023   test_2d_line_cap_open();
 23024  } catch (e) {
 23025   ok(false, "unexpected exception thrown in: test_2d_line_cap_open");
 23027  try {
 23028   test_2d_line_cap_round();
 23029  } catch (e) {
 23030   ok(false, "unexpected exception thrown in: test_2d_line_cap_round");
 23032  try {
 23033   test_2d_line_cap_square();
 23034  } catch (e) {
 23035   ok(false, "unexpected exception thrown in: test_2d_line_cap_square");
 23037  try {
 23038   test_2d_line_cross();
 23039  } catch (e) {
 23040   ok(false, "unexpected exception thrown in: test_2d_line_cross");
 23042  try {
 23043   test_2d_line_defaults();
 23044  } catch (e) {
 23045   ok(false, "unexpected exception thrown in: test_2d_line_defaults");
 23047  try {
 23048   test_2d_line_join_bevel();
 23049  } catch (e) {
 23050   ok(false, "unexpected exception thrown in: test_2d_line_join_bevel");
 23052  try {
 23053   test_2d_line_join_closed();
 23054  } catch (e) {
 23055   ok(false, "unexpected exception thrown in: test_2d_line_join_closed");
 23057  try {
 23058   test_2d_line_join_invalid();
 23059  } catch (e) {
 23060   ok(false, "unexpected exception thrown in: test_2d_line_join_invalid");
 23062  try {
 23063   test_2d_line_join_miter();
 23064  } catch (e) {
 23065   ok(false, "unexpected exception thrown in: test_2d_line_join_miter");
 23067  try {
 23068   test_2d_line_join_open();
 23069  } catch (e) {
 23070   ok(false, "unexpected exception thrown in: test_2d_line_join_open");
 23072  try {
 23073   test_2d_line_join_round();
 23074  } catch (e) {
 23075   ok(false, "unexpected exception thrown in: test_2d_line_join_round");
 23077  try {
 23078   test_2d_line_miter_acute();
 23079  } catch (e) {
 23080   ok(false, "unexpected exception thrown in: test_2d_line_miter_acute");
 23082  try {
 23083   test_2d_line_miter_exceeded();
 23084  } catch (e) {
 23085   ok(false, "unexpected exception thrown in: test_2d_line_miter_exceeded");
 23087  try {
 23088   test_2d_line_miter_invalid();
 23089  } catch (e) {
 23090   ok(false, "unexpected exception thrown in: test_2d_line_miter_invalid");
 23092  try {
 23093   test_2d_line_miter_lineedge();
 23094  } catch (e) {
 23095   ok(false, "unexpected exception thrown in: test_2d_line_miter_lineedge");
 23097  try {
 23098   test_2d_line_miter_obtuse();
 23099  } catch (e) {
 23100   ok(false, "unexpected exception thrown in: test_2d_line_miter_obtuse");
 23102  try {
 23103   test_2d_line_miter_rightangle();
 23104  } catch (e) {
 23105   ok(false, "unexpected exception thrown in: test_2d_line_miter_rightangle");
 23107  try {
 23108   test_2d_line_miter_within();
 23109  } catch (e) {
 23110   ok(false, "unexpected exception thrown in: test_2d_line_miter_within");
 23112  try {
 23113   test_2d_line_union();
 23114  } catch (e) {
 23115   ok(false, "unexpected exception thrown in: test_2d_line_union");
 23117  try {
 23118   test_2d_line_width_basic();
 23119  } catch (e) {
 23120   ok(false, "unexpected exception thrown in: test_2d_line_width_basic");
 23122  try {
 23123   test_2d_line_width_invalid();
 23124  } catch (e) {
 23125   ok(false, "unexpected exception thrown in: test_2d_line_width_invalid");
 23127  try {
 23128   test_2d_line_width_transformed();
 23129  } catch (e) {
 23130   ok(false, "unexpected exception thrown in: test_2d_line_width_transformed");
 23132  try {
 23133   test_2d_missingargs();
 23134  } catch (e) {
 23135   ok(false, "unexpected exception thrown in: test_2d_missingargs");
 23137  try {
 23138   test_2d_path_arc_angle_1();
 23139  } catch (e) {
 23140   ok(false, "unexpected exception thrown in: test_2d_path_arc_angle_1");
 23142  try {
 23143   test_2d_path_arc_angle_2();
 23144  } catch (e) {
 23145   ok(false, "unexpected exception thrown in: test_2d_path_arc_angle_2");
 23147  try {
 23148   test_2d_path_arc_angle_3();
 23149  } catch (e) {
 23150   ok(false, "unexpected exception thrown in: test_2d_path_arc_angle_3");
 23152  try {
 23153   test_2d_path_arc_angle_4();
 23154  } catch (e) {
 23155   ok(false, "unexpected exception thrown in: test_2d_path_arc_angle_4");
 23157  try {
 23158   test_2d_path_arc_angle_5();
 23159  } catch (e) {
 23160   ok(false, "unexpected exception thrown in: test_2d_path_arc_angle_5");
 23162  try {
 23163   test_2d_path_arc_angle_6();
 23164  } catch (e) {
 23165   ok(false, "unexpected exception thrown in: test_2d_path_arc_angle_6");
 23167  try {
 23168   test_2d_path_arc_empty();
 23169  } catch (e) {
 23170   ok(false, "unexpected exception thrown in: test_2d_path_arc_empty");
 23172  try {
 23173   test_2d_path_arc_end();
 23174  } catch (e) {
 23175   ok(false, "unexpected exception thrown in: test_2d_path_arc_end");
 23177  try {
 23178   test_2d_path_arc_negative();
 23179  } catch (e) {
 23180   ok(false, "unexpected exception thrown in: test_2d_path_arc_negative");
 23182  try {
 23183   test_2d_path_arc_nonempty();
 23184  } catch (e) {
 23185   ok(false, "unexpected exception thrown in: test_2d_path_arc_nonempty");
 23187  try {
 23188   test_2d_path_arc_nonfinite();
 23189  } catch (e) {
 23190   ok(false, "unexpected exception thrown in: test_2d_path_arc_nonfinite");
 23192  try {
 23193   test_2d_path_arc_scale_1();
 23194  } catch (e) {
 23195   ok(false, "unexpected exception thrown in: test_2d_path_arc_scale_1");
 23197  try {
 23198   test_2d_path_arc_scale_2();
 23199  } catch (e) {
 23200   ok(false, "unexpected exception thrown in: test_2d_path_arc_scale_2");
 23202  try {
 23203   test_2d_path_arc_selfintersect_1();
 23204  } catch (e) {
 23205   ok(false, "unexpected exception thrown in: test_2d_path_arc_selfintersect_1");
 23207  try {
 23208   test_2d_path_arc_selfintersect_2();
 23209  } catch (e) {
 23210   ok(false, "unexpected exception thrown in: test_2d_path_arc_selfintersect_2");
 23212  try {
 23213   test_2d_path_arc_shape_1();
 23214  } catch (e) {
 23215   ok(false, "unexpected exception thrown in: test_2d_path_arc_shape_1");
 23217  try {
 23218   test_2d_path_arc_shape_2();
 23219  } catch (e) {
 23220   ok(false, "unexpected exception thrown in: test_2d_path_arc_shape_2");
 23222  try {
 23223   test_2d_path_arc_shape_4();
 23224  } catch (e) {
 23225   ok(false, "unexpected exception thrown in: test_2d_path_arc_shape_4");
 23227  try {
 23228   test_2d_path_arc_shape_5();
 23229  } catch (e) {
 23230   ok(false, "unexpected exception thrown in: test_2d_path_arc_shape_5");
 23232  try {
 23233   test_2d_path_arc_twopie_1();
 23234  } catch (e) {
 23235   ok(false, "unexpected exception thrown in: test_2d_path_arc_twopie_1");
 23237  try {
 23238   test_2d_path_arc_twopie_2();
 23239  } catch (e) {
 23240   ok(false, "unexpected exception thrown in: test_2d_path_arc_twopie_2");
 23242  try {
 23243   test_2d_path_arc_twopie_3();
 23244  } catch (e) {
 23245   ok(false, "unexpected exception thrown in: test_2d_path_arc_twopie_3");
 23247  try {
 23248   test_2d_path_arc_twopie_4();
 23249  } catch (e) {
 23250   ok(false, "unexpected exception thrown in: test_2d_path_arc_twopie_4");
 23252  try {
 23253   test_2d_path_arc_zero_1();
 23254  } catch (e) {
 23255   ok(false, "unexpected exception thrown in: test_2d_path_arc_zero_1");
 23257  try {
 23258   test_2d_path_arc_zero_2();
 23259  } catch (e) {
 23260   ok(false, "unexpected exception thrown in: test_2d_path_arc_zero_2");
 23262  try {
 23263   test_2d_path_arc_zeroradius();
 23264  } catch (e) {
 23265   ok(false, "unexpected exception thrown in: test_2d_path_arc_zeroradius");
 23267  try {
 23268   test_2d_path_arcTo_coincide_1();
 23269  } catch (e) {
 23270   ok(false, "unexpected exception thrown in: test_2d_path_arcTo_coincide_1");
 23272  try {
 23273   test_2d_path_arcTo_coincide_2();
 23274  } catch (e) {
 23275   ok(false, "unexpected exception thrown in: test_2d_path_arcTo_coincide_2");
 23277  try {
 23278   test_2d_path_arcTo_collinear_1();
 23279  } catch (e) {
 23280   ok(false, "unexpected exception thrown in: test_2d_path_arcTo_collinear_1");
 23282  try {
 23283   test_2d_path_arcTo_collinear_2();
 23284  } catch (e) {
 23285   ok(false, "unexpected exception thrown in: test_2d_path_arcTo_collinear_2");
 23287  try {
 23288   test_2d_path_arcTo_collinear_3();
 23289  } catch (e) {
 23290   ok(false, "unexpected exception thrown in: test_2d_path_arcTo_collinear_3");
 23292  try {
 23293   test_2d_path_arcTo_emptysubpath();
 23294  } catch (e) {
 23295   ok(false, "unexpected exception thrown in: test_2d_path_arcTo_emptysubpath");
 23297  try {
 23298   test_2d_path_arcTo_negative();
 23299  } catch (e) {
 23300   ok(false, "unexpected exception thrown in: test_2d_path_arcTo_negative");
 23302  try {
 23303   test_2d_path_arcTo_nonfinite();
 23304  } catch (e) {
 23305   ok(false, "unexpected exception thrown in: test_2d_path_arcTo_nonfinite");
 23307  try {
 23308   test_2d_path_arcTo_scale();
 23309  } catch (e) {
 23310   ok(false, "unexpected exception thrown in: test_2d_path_arcTo_scale");
 23312  try {
 23313   test_2d_path_arcTo_shape_curve1();
 23314  } catch (e) {
 23315   ok(false, "unexpected exception thrown in: test_2d_path_arcTo_shape_curve1");
 23317  try {
 23318   test_2d_path_arcTo_shape_curve2();
 23319  } catch (e) {
 23320   ok(false, "unexpected exception thrown in: test_2d_path_arcTo_shape_curve2");
 23322  try {
 23323   test_2d_path_arcTo_shape_end();
 23324  } catch (e) {
 23325   ok(false, "unexpected exception thrown in: test_2d_path_arcTo_shape_end");
 23327  try {
 23328   test_2d_path_arcTo_shape_start();
 23329  } catch (e) {
 23330   ok(false, "unexpected exception thrown in: test_2d_path_arcTo_shape_start");
 23332  try {
 23333   test_2d_path_arcTo_transformation();
 23334  } catch (e) {
 23335   ok(false, "unexpected exception thrown in: test_2d_path_arcTo_transformation");
 23337  try {
 23338   test_2d_path_arcTo_zero_1();
 23339  } catch (e) {
 23340   ok(false, "unexpected exception thrown in: test_2d_path_arcTo_zero_1");
 23342  try {
 23343   test_2d_path_arcTo_zero_2();
 23344  } catch (e) {
 23345   ok(false, "unexpected exception thrown in: test_2d_path_arcTo_zero_2");
 23347  try {
 23348   test_2d_path_beginPath();
 23349  } catch (e) {
 23350   ok(false, "unexpected exception thrown in: test_2d_path_beginPath");
 23352  try {
 23353   test_2d_path_bezierCurveTo_basic();
 23354  } catch (e) {
 23355   ok(false, "unexpected exception thrown in: test_2d_path_bezierCurveTo_basic");
 23357  try {
 23358   test_2d_path_bezierCurveTo_emptysubpath();
 23359  } catch (e) {
 23360   ok(false, "unexpected exception thrown in: test_2d_path_bezierCurveTo_emptysubpath");
 23362  try {
 23363   test_2d_path_bezierCurveTo_nonfinite();
 23364  } catch (e) {
 23365   ok(false, "unexpected exception thrown in: test_2d_path_bezierCurveTo_nonfinite");
 23367  try {
 23368   test_2d_path_bezierCurveTo_scaled();
 23369  } catch (e) {
 23370   ok(false, "unexpected exception thrown in: test_2d_path_bezierCurveTo_scaled");
 23372  try {
 23373   test_2d_path_bezierCurveTo_shape();
 23374  } catch (e) {
 23375   ok(false, "unexpected exception thrown in: test_2d_path_bezierCurveTo_shape");
 23377  try {
 23378   test_2d_path_clip_basic_1();
 23379  } catch (e) {
 23380   ok(false, "unexpected exception thrown in: test_2d_path_clip_basic_1");
 23382  try {
 23383   test_2d_path_clip_basic_2();
 23384  } catch (e) {
 23385   ok(false, "unexpected exception thrown in: test_2d_path_clip_basic_2");
 23387  try {
 23388   test_2d_path_clip_empty();
 23389  } catch (e) {
 23390   ok(false, "unexpected exception thrown in: test_2d_path_clip_empty");
 23392  try {
 23393   test_2d_path_clip_intersect();
 23394  } catch (e) {
 23395   ok(false, "unexpected exception thrown in: test_2d_path_clip_intersect");
 23397  try {
 23398   test_2d_path_clip_unaffected();
 23399  } catch (e) {
 23400   ok(false, "unexpected exception thrown in: test_2d_path_clip_unaffected");
 23402  try {
 23403   test_2d_path_clip_winding_1();
 23404  } catch (e) {
 23405   ok(false, "unexpected exception thrown in: test_2d_path_clip_winding_1");
 23407  try {
 23408   test_2d_path_clip_winding_2();
 23409  } catch (e) {
 23410   ok(false, "unexpected exception thrown in: test_2d_path_clip_winding_2");
 23412  try {
 23413   test_2d_path_closePath_empty();
 23414  } catch (e) {
 23415   ok(false, "unexpected exception thrown in: test_2d_path_closePath_empty");
 23417  try {
 23418   test_2d_path_closePath_newline();
 23419  } catch (e) {
 23420   ok(false, "unexpected exception thrown in: test_2d_path_closePath_newline");
 23422  try {
 23423   test_2d_path_closePath_nextpoint();
 23424  } catch (e) {
 23425   ok(false, "unexpected exception thrown in: test_2d_path_closePath_nextpoint");
 23427  try {
 23428   test_2d_path_fill_closed_basic();
 23429  } catch (e) {
 23430   ok(false, "unexpected exception thrown in: test_2d_path_fill_closed_basic");
 23432  try {
 23433   test_2d_path_fill_closed_unaffected();
 23434  } catch (e) {
 23435   ok(false, "unexpected exception thrown in: test_2d_path_fill_closed_unaffected");
 23437  try {
 23438   test_2d_path_fill_overlap();
 23439  } catch (e) {
 23440   ok(false, "unexpected exception thrown in: test_2d_path_fill_overlap");
 23442  try {
 23443   test_2d_path_fill_winding_add();
 23444  } catch (e) {
 23445   ok(false, "unexpected exception thrown in: test_2d_path_fill_winding_add");
 23447  try {
 23448   test_2d_path_fill_winding_subtract_1();
 23449  } catch (e) {
 23450   ok(false, "unexpected exception thrown in: test_2d_path_fill_winding_subtract_1");
 23452  try {
 23453   test_2d_path_fill_winding_subtract_2();
 23454  } catch (e) {
 23455   ok(false, "unexpected exception thrown in: test_2d_path_fill_winding_subtract_2");
 23457  try {
 23458   test_2d_path_fill_winding_subtract_3();
 23459  } catch (e) {
 23460   ok(false, "unexpected exception thrown in: test_2d_path_fill_winding_subtract_3");
 23462  try {
 23463   test_2d_path_initial();
 23464  } catch (e) {
 23465   ok(false, "unexpected exception thrown in: test_2d_path_initial");
 23467  try {
 23468   test_2d_path_isPointInPath_arc();
 23469  } catch (e) {
 23470   ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_arc");
 23472  try {
 23473   test_2d_path_isPointInPath_basic_1();
 23474  } catch (e) {
 23475   ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_basic_1");
 23477  try {
 23478   test_2d_path_isPointInPath_basic_2();
 23479  } catch (e) {
 23480   ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_basic_2");
 23482  try {
 23483   test_2d_path_isPointInPath_bezier();
 23484  } catch (e) {
 23485   ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_bezier");
 23487  try {
 23488   test_2d_path_isPointInPath_bigarc();
 23489  } catch (e) {
 23490   ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_bigarc");
 23492  try {
 23493   test_2d_path_isPointInPath_edge();
 23494  } catch (e) {
 23495   ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_edge");
 23497  try {
 23498   test_2d_path_isPointInPath_empty();
 23499  } catch (e) {
 23500   ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_empty");
 23502  try {
 23503   test_2d_path_isPointInPath_nonfinite();
 23504  } catch (e) {
 23505   ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_nonfinite");
 23507  try {
 23508   test_2d_path_isPointInPath_outside();
 23509  } catch (e) {
 23510   ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_outside");
 23512  try {
 23513   test_2d_path_isPointInPath_subpath();
 23514  } catch (e) {
 23515   ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_subpath");
 23517  try {
 23518    test_2d_path_isPointInPath_transform_1();
 23519  } catch (e) {
 23520   ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_transform_1");
 23522  try {
 23523   test_2d_path_isPointInPath_transform_2();
 23524  } catch (e) {
 23525   ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_transform_2");
 23527  try {
 23528   test_2d_path_isPointInPath_transform_3();
 23529  } catch (e) {
 23530   ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_transform_3");
 23532  try {
 23533   test_2d_path_isPointInPath_unclosed();
 23534  } catch (e) {
 23535   ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_unclosed");
 23537  try {
 23538   test_2d_path_isPointInPath_winding();
 23539  } catch (e) {
 23540   ok(false, "unexpected exception thrown in: test_2d_path_isPointInPath_winding");
 23542  try {
 23543   test_2d_path_lineTo_basic();
 23544  } catch (e) {
 23545   ok(false, "unexpected exception thrown in: test_2d_path_lineTo_basic");
 23547  try {
 23548   test_2d_path_lineTo_emptysubpath();
 23549  } catch (e) {
 23550   ok(false, "unexpected exception thrown in: test_2d_path_lineTo_emptysubpath");
 23552  try {
 23553   test_2d_path_lineTo_nextpoint();
 23554  } catch (e) {
 23555   ok(false, "unexpected exception thrown in: test_2d_path_lineTo_nextpoint");
 23557  try {
 23558   test_2d_path_lineTo_nonfinite();
 23559  } catch (e) {
 23560   ok(false, "unexpected exception thrown in: test_2d_path_lineTo_nonfinite");
 23562  try {
 23563   test_2d_path_moveTo_basic();
 23564  } catch (e) {
 23565   ok(false, "unexpected exception thrown in: test_2d_path_moveTo_basic");
 23567  try {
 23568   test_2d_path_moveTo_multiple();
 23569  } catch (e) {
 23570   ok(false, "unexpected exception thrown in: test_2d_path_moveTo_multiple");
 23572  try {
 23573   test_2d_path_moveTo_newsubpath();
 23574  } catch (e) {
 23575   ok(false, "unexpected exception thrown in: test_2d_path_moveTo_newsubpath");
 23577  try {
 23578   test_2d_path_moveTo_nonfinite();
 23579  } catch (e) {
 23580   ok(false, "unexpected exception thrown in: test_2d_path_moveTo_nonfinite");
 23582  try {
 23583   test_2d_path_quadraticCurveTo_basic();
 23584  } catch (e) {
 23585   ok(false, "unexpected exception thrown in: test_2d_path_quadraticCurveTo_basic");
 23587  try {
 23588   test_2d_path_quadraticCurveTo_emptysubpath();
 23589  } catch (e) {
 23590   ok(false, "unexpected exception thrown in: test_2d_path_quadraticCurveTo_emptysubpath");
 23592  try {
 23593   test_2d_path_quadraticCurveTo_nonfinite();
 23594  } catch (e) {
 23595   ok(false, "unexpected exception thrown in: test_2d_path_quadraticCurveTo_nonfinite");
 23597  try {
 23598   test_2d_path_quadraticCurveTo_scaled();
 23599  } catch (e) {
 23600   ok(false, "unexpected exception thrown in: test_2d_path_quadraticCurveTo_scaled");
 23602  try {
 23603   test_2d_path_quadraticCurveTo_shape();
 23604  } catch (e) {
 23605   ok(false, "unexpected exception thrown in: test_2d_path_quadraticCurveTo_shape");
 23607  try {
 23608   test_2d_path_rect_basic();
 23609  } catch (e) {
 23610   ok(false, "unexpected exception thrown in: test_2d_path_rect_basic");
 23612  try {
 23613   test_2d_path_rect_closed();
 23614  } catch (e) {
 23615   ok(false, "unexpected exception thrown in: test_2d_path_rect_closed");
 23617  try {
 23618   test_2d_path_rect_end_1();
 23619  } catch (e) {
 23620   ok(false, "unexpected exception thrown in: test_2d_path_rect_end_1");
 23622  try {
 23623   test_2d_path_rect_end_2();
 23624  } catch (e) {
 23625   ok(false, "unexpected exception thrown in: test_2d_path_rect_end_2");
 23627  try {
 23628   test_2d_path_rect_negative();
 23629  } catch (e) {
 23630   ok(false, "unexpected exception thrown in: test_2d_path_rect_negative");
 23632  try {
 23633   test_2d_path_rect_newsubpath();
 23634  } catch (e) {
 23635   ok(false, "unexpected exception thrown in: test_2d_path_rect_newsubpath");
 23637  try {
 23638   test_2d_path_rect_nonfinite();
 23639  } catch (e) {
 23640   ok(false, "unexpected exception thrown in: test_2d_path_rect_nonfinite");
 23642  try {
 23643   test_2d_path_rect_winding();
 23644  } catch (e) {
 23645   ok(false, "unexpected exception thrown in: test_2d_path_rect_winding");
 23647  try {
 23648   test_2d_path_rect_zero_1();
 23649  } catch (e) {
 23650   ok(false, "unexpected exception thrown in: test_2d_path_rect_zero_1");
 23652  try {
 23653   test_2d_path_rect_zero_2();
 23654  } catch (e) {
 23655   ok(false, "unexpected exception thrown in: test_2d_path_rect_zero_2");
 23657  try {
 23658   test_2d_path_rect_zero_3();
 23659  } catch (e) {
 23660   ok(false, "unexpected exception thrown in: test_2d_path_rect_zero_3");
 23662  try {
 23663   test_2d_path_rect_zero_4();
 23664  } catch (e) {
 23665   ok(false, "unexpected exception thrown in: test_2d_path_rect_zero_4");
 23667  try {
 23668   test_2d_path_rect_zero_5();
 23669  } catch (e) {
 23670   ok(false, "unexpected exception thrown in: test_2d_path_rect_zero_5");
 23672  try {
 23673   test_2d_path_stroke_empty();
 23674  } catch (e) {
 23675   ok(false, "unexpected exception thrown in: test_2d_path_stroke_empty");
 23677  try {
 23678   test_2d_path_stroke_overlap();
 23679  } catch (e) {
 23680   ok(false, "unexpected exception thrown in: test_2d_path_stroke_overlap");
 23682  try {
 23683   test_2d_path_stroke_prune_arc();
 23684  } catch (e) {
 23685   ok(false, "unexpected exception thrown in: test_2d_path_stroke_prune_arc");
 23687  try {
 23688   test_2d_path_stroke_prune_closed();
 23689  } catch (e) {
 23690   ok(false, "unexpected exception thrown in: test_2d_path_stroke_prune_closed");
 23692  try {
 23693   test_2d_path_stroke_prune_corner();
 23694  } catch (e) {
 23695   ok(false, "unexpected exception thrown in: test_2d_path_stroke_prune_corner");
 23697  try {
 23698   test_2d_path_stroke_prune_curve();
 23699  } catch (e) {
 23700   ok(false, "unexpected exception thrown in: test_2d_path_stroke_prune_curve");
 23702  try {
 23703   test_2d_path_stroke_prune_line();
 23704  } catch (e) {
 23705   ok(false, "unexpected exception thrown in: test_2d_path_stroke_prune_line");
 23707  try {
 23708   test_2d_path_stroke_prune_rect();
 23709  } catch (e) {
 23710   ok(false, "unexpected exception thrown in: test_2d_path_stroke_prune_rect");
 23712  try {
 23713   test_2d_path_stroke_scale1();
 23714  } catch (e) {
 23715   ok(false, "unexpected exception thrown in: test_2d_path_stroke_scale1");
 23717  try {
 23718   test_2d_path_stroke_scale2();
 23719  } catch (e) {
 23720   ok(false, "unexpected exception thrown in: test_2d_path_stroke_scale2");
 23722  try {
 23723   test_2d_path_stroke_skew();
 23724  } catch (e) {
 23725   ok(false, "unexpected exception thrown in: test_2d_path_stroke_skew");
 23727  try {
 23728   test_2d_path_stroke_unaffected();
 23729  } catch (e) {
 23730   ok(false, "unexpected exception thrown in: test_2d_path_stroke_unaffected");
 23732  try {
 23733   test_2d_path_stroke_union();
 23734  } catch (e) {
 23735   ok(false, "unexpected exception thrown in: test_2d_path_stroke_union");
 23737  try {
 23738   test_2d_path_transformation_basic();
 23739  } catch (e) {
 23740   ok(false, "unexpected exception thrown in: test_2d_path_transformation_basic");
 23742  try {
 23743   test_2d_path_transformation_changing();
 23744  } catch (e) {
 23745   ok(false, "unexpected exception thrown in: test_2d_path_transformation_changing");
 23747  try {
 23748   test_2d_path_transformation_multiple();
 23749  } catch (e) {
 23750   ok(false, "unexpected exception thrown in: test_2d_path_transformation_multiple");
 23752  try {
 23753   test_2d_pattern_animated_gif();
 23754  } catch (e) {
 23755   ok(false, "unexpected exception thrown in: test_2d_pattern_animated_gif");
 23757  try {
 23758   test_2d_pattern_basic_canvas();
 23759  } catch (e) {
 23760   ok(false, "unexpected exception thrown in: test_2d_pattern_basic_canvas");
 23762  try {
 23763   test_2d_pattern_basic_image();
 23764  } catch (e) {
 23765   ok(false, "unexpected exception thrown in: test_2d_pattern_basic_image");
 23767  try {
 23768   test_2d_pattern_basic_nocontext();
 23769  } catch (e) {
 23770   ok(false, "unexpected exception thrown in: test_2d_pattern_basic_nocontext");
 23772  try {
 23773   test_2d_pattern_basic_type();
 23774  } catch (e) {
 23775   ok(false, "unexpected exception thrown in: test_2d_pattern_basic_type");
 23777  try {
 23778   test_2d_pattern_basic_zerocanvas();
 23779  } catch (e) {
 23780   ok(false, "unexpected exception thrown in: test_2d_pattern_basic_zerocanvas");
 23782  try {
 23783   test_2d_pattern_crosscanvas();
 23784  } catch (e) {
 23785   ok(false, "unexpected exception thrown in: test_2d_pattern_crosscanvas");
 23787  try {
 23788   test_2d_pattern_image_broken();
 23789  } catch (e) {
 23790   ok(false, "unexpected exception thrown in: test_2d_pattern_image_broken");
 23792  try {
 23793   test_2d_pattern_image_incomplete();
 23794  } catch (e) {
 23795   ok(false, "unexpected exception thrown in: test_2d_pattern_image_incomplete");
 23797  try {
 23798   test_2d_pattern_image_null();
 23799  } catch (e) {
 23800   ok(false, "unexpected exception thrown in: test_2d_pattern_image_null");
 23802  try {
 23803   test_2d_pattern_image_string();
 23804  } catch (e) {
 23805   ok(false, "unexpected exception thrown in: test_2d_pattern_image_string");
 23807  try {
 23808   test_2d_pattern_image_undefined();
 23809  } catch (e) {
 23810   ok(false, "unexpected exception thrown in: test_2d_pattern_image_undefined");
 23812  try {
 23813   test_2d_pattern_modify_canvas1();
 23814  } catch (e) {
 23815   ok(false, "unexpected exception thrown in: test_2d_pattern_modify_canvas1");
 23817  try {
 23818   test_2d_pattern_modify_canvas2();
 23819  } catch (e) {
 23820   ok(false, "unexpected exception thrown in: test_2d_pattern_modify_canvas2");
 23822  try {
 23823   test_2d_pattern_modify_image1();
 23824  } catch (e) {
 23825   ok(false, "unexpected exception thrown in: test_2d_pattern_modify_image1");
 23827  try {
 23828   test_2d_pattern_modify_image2();
 23829  } catch (e) {
 23830   ok(false, "unexpected exception thrown in: test_2d_pattern_modify_image2");
 23832  try {
 23833   test_2d_pattern_paint_norepeat_basic();
 23834  } catch (e) {
 23835   ok(false, "unexpected exception thrown in: test_2d_pattern_paint_norepeat_basic");
 23837  try {
 23838   test_2d_pattern_paint_norepeat_coord1();
 23839  } catch (e) {
 23840   ok(false, "unexpected exception thrown in: test_2d_pattern_paint_norepeat_coord1");
 23842  try {
 23843   test_2d_pattern_paint_norepeat_coord2();
 23844  } catch (e) {
 23845   ok(false, "unexpected exception thrown in: test_2d_pattern_paint_norepeat_coord2");
 23847  try {
 23848   test_2d_pattern_paint_norepeat_coord3();
 23849  } catch (e) {
 23850   ok(false, "unexpected exception thrown in: test_2d_pattern_paint_norepeat_coord3");
 23852  try {
 23853   test_2d_pattern_paint_norepeat_outside();
 23854  } catch (e) {
 23855   ok(false, "unexpected exception thrown in: test_2d_pattern_paint_norepeat_outside");
 23857  try {
 23858   test_2d_pattern_paint_orientation_canvas();
 23859  } catch (e) {
 23860   ok(false, "unexpected exception thrown in: test_2d_pattern_paint_orientation_canvas");
 23862  try {
 23863   test_2d_pattern_paint_orientation_image();
 23864  } catch (e) {
 23865   ok(false, "unexpected exception thrown in: test_2d_pattern_paint_orientation_image");
 23867  try {
 23868   test_2d_pattern_paint_repeat_basic();
 23869  } catch (e) {
 23870   ok(false, "unexpected exception thrown in: test_2d_pattern_paint_repeat_basic");
 23872  try {
 23873   test_2d_pattern_paint_repeat_coord1();
 23874  } catch (e) {
 23875   ok(false, "unexpected exception thrown in: test_2d_pattern_paint_repeat_coord1");
 23877  try {
 23878   test_2d_pattern_paint_repeat_coord2();
 23879  } catch (e) {
 23880   ok(false, "unexpected exception thrown in: test_2d_pattern_paint_repeat_coord2");
 23882  try {
 23883   test_2d_pattern_paint_repeat_coord3();
 23884  } catch (e) {
 23885   ok(false, "unexpected exception thrown in: test_2d_pattern_paint_repeat_coord3");
 23887  try {
 23888   test_2d_pattern_paint_repeat_outside();
 23889  } catch (e) {
 23890   ok(false, "unexpected exception thrown in: test_2d_pattern_paint_repeat_outside");
 23892  try {
 23893   test_2d_pattern_paint_repeatx_basic();
 23894  } catch (e) {
 23895   ok(false, "unexpected exception thrown in: test_2d_pattern_paint_repeatx_basic");
 23897  try {
 23898   test_2d_pattern_paint_repeatx_coord1();
 23899  } catch (e) {
 23900   ok(false, "unexpected exception thrown in: test_2d_pattern_paint_repeatx_coord1");
 23902  try {
 23903   test_2d_pattern_paint_repeatx_outside();
 23904  } catch (e) {
 23905   ok(false, "unexpected exception thrown in: test_2d_pattern_paint_repeatx_outside");
 23907  try {
 23908   test_2d_pattern_paint_repeaty_basic();
 23909  } catch (e) {
 23910   ok(false, "unexpected exception thrown in: test_2d_pattern_paint_repeaty_basic");
 23912  try {
 23913   test_2d_pattern_paint_repeaty_coord1();
 23914  } catch (e) {
 23915   ok(false, "unexpected exception thrown in: test_2d_pattern_paint_repeaty_coord1");
 23917  try {
 23918   test_2d_pattern_paint_repeaty_outside();
 23919  } catch (e) {
 23920   ok(false, "unexpected exception thrown in: test_2d_pattern_paint_repeaty_outside");
 23922  try {
 23923   test_2d_pattern_repeat_case();
 23924  } catch (e) {
 23925   ok(false, "unexpected exception thrown in: test_2d_pattern_repeat_case");
 23927  try {
 23928   test_2d_pattern_repeat_empty();
 23929  } catch (e) {
 23930   ok(false, "unexpected exception thrown in: test_2d_pattern_repeat_empty");
 23932  try {
 23933   test_2d_pattern_repeat_null();
 23934  } catch (e) {
 23935   ok(false, "unexpected exception thrown in: test_2d_pattern_repeat_null");
 23937  try {
 23938   test_2d_pattern_repeat_nullsuffix();
 23939  } catch (e) {
 23940   ok(false, "unexpected exception thrown in: test_2d_pattern_repeat_nullsuffix");
 23942  try {
 23943   test_2d_pattern_repeat_undefined();
 23944  } catch (e) {
 23945   ok(false, "unexpected exception thrown in: test_2d_pattern_repeat_undefined");
 23947  try {
 23948   test_2d_pattern_repeat_unrecognised();
 23949  } catch (e) {
 23950   ok(false, "unexpected exception thrown in: test_2d_pattern_repeat_unrecognised");
 23952  try {
 23953   test_2d_scaled();
 23954  } catch (e) {
 23955   ok(false, "unexpected exception thrown in: test_2d_scaled");
 23957  try {
 23958   test_2d_shadow_alpha_1();
 23959  } catch (e) {
 23960   ok(false, "unexpected exception thrown in: test_2d_shadow_alpha_1");
 23962  try {
 23963   test_2d_shadow_alpha_2();
 23964  } catch (e) {
 23965   ok(false, "unexpected exception thrown in: test_2d_shadow_alpha_2");
 23967  try {
 23968   test_2d_shadow_alpha_3();
 23969  } catch (e) {
 23970   ok(false, "unexpected exception thrown in: test_2d_shadow_alpha_3");
 23972  try {
 23973   test_2d_shadow_alpha_4();
 23974  } catch (e) {
 23975   ok(false, "unexpected exception thrown in: test_2d_shadow_alpha_4");
 23977  try {
 23978   test_2d_shadow_alpha_5();
 23979  } catch (e) {
 23980   ok(false, "unexpected exception thrown in: test_2d_shadow_alpha_5");
 23982  try {
 23983   test_2d_shadow_attributes_shadowBlur_1();
 23984  } catch (e) {
 23985   ok(false, "unexpected exception thrown in: test_2d_shadow_attributes_shadowBlur_1");
 23987  try {
 23988   test_2d_shadow_attributes_shadowBlur_2();
 23989  } catch (e) {
 23990   ok(false, "unexpected exception thrown in: test_2d_shadow_attributes_shadowBlur_2");
 23992  try {
 23993   test_2d_shadow_attributes_shadowColor_1();
 23994  } catch (e) {
 23995   ok(false, "unexpected exception thrown in: test_2d_shadow_attributes_shadowColor_1");
 23997  try {
 23998   test_2d_shadow_attributes_shadowColor_2();
 23999  } catch (e) {
 24000   ok(false, "unexpected exception thrown in: test_2d_shadow_attributes_shadowColor_2");
 24002  try {
 24003   test_2d_shadow_attributes_shadowOffset_1();
 24004  } catch (e) {
 24005   ok(false, "unexpected exception thrown in: test_2d_shadow_attributes_shadowOffset_1");
 24007  try {
 24008   test_2d_shadow_attributes_shadowOffset_2();
 24009  } catch (e) {
 24010   ok(false, "unexpected exception thrown in: test_2d_shadow_attributes_shadowOffset_2");
 24012  try {
 24013   test_2d_shadow_basic_1();
 24014  } catch (e) {
 24015   ok(false, "unexpected exception thrown in: test_2d_shadow_basic_1");
 24017  try {
 24018   test_2d_shadow_basic_2();
 24019  } catch (e) {
 24020   ok(false, "unexpected exception thrown in: test_2d_shadow_basic_2");
 24022  try {
 24023   test_2d_shadow_blur_high();
 24024  } catch (e) {
 24025   ok(false, "unexpected exception thrown in: test_2d_shadow_blur_high");
 24027  try {
 24028   test_2d_shadow_blur_low();
 24029  } catch (e) {
 24030   ok(false, "unexpected exception thrown in: test_2d_shadow_blur_low");
 24032  try {
 24033   test_2d_shadow_canvas_alpha();
 24034  } catch (e) {
 24035   ok(false, "unexpected exception thrown in: test_2d_shadow_canvas_alpha");
 24037  try {
 24038   test_2d_shadow_canvas_basic();
 24039  } catch (e) {
 24040   ok(false, "unexpected exception thrown in: test_2d_shadow_canvas_basic");
 24042  try {
 24043   test_2d_shadow_canvas_transparent_1();
 24044  } catch (e) {
 24045   ok(false, "unexpected exception thrown in: test_2d_shadow_canvas_transparent_1");
 24047  try {
 24048   test_2d_shadow_canvas_transparent_2();
 24049  } catch (e) {
 24050   ok(false, "unexpected exception thrown in: test_2d_shadow_canvas_transparent_2");
 24052  try {
 24053   test_2d_shadow_clip_1();
 24054  } catch (e) {
 24055   ok(false, "unexpected exception thrown in: test_2d_shadow_clip_1");
 24057  try {
 24058   test_2d_shadow_clip_2();
 24059  } catch (e) {
 24060   ok(false, "unexpected exception thrown in: test_2d_shadow_clip_2");
 24062  try {
 24063   test_2d_shadow_clip_3();
 24064  } catch (e) {
 24065   ok(false, "unexpected exception thrown in: test_2d_shadow_clip_3");
 24067  try {
 24068   test_2d_shadow_composite_1();
 24069  } catch (e) {
 24070   ok(false, "unexpected exception thrown in: test_2d_shadow_composite_1");
 24072  try {
 24073   test_2d_shadow_composite_2();
 24074  } catch (e) {
 24075   ok(false, "unexpected exception thrown in: test_2d_shadow_composite_2");
 24077  try {
 24078   test_2d_shadow_gradient_alpha();
 24079  } catch (e) {
 24080   ok(false, "unexpected exception thrown in: test_2d_shadow_gradient_alpha");
 24082  try {
 24083   test_2d_shadow_gradient_basic();
 24084  } catch (e) {
 24085   ok(false, "unexpected exception thrown in: test_2d_shadow_gradient_basic");
 24087  try {
 24088   test_2d_shadow_gradient_transparent_1();
 24089  } catch (e) {
 24090   ok(false, "unexpected exception thrown in: test_2d_shadow_gradient_transparent_1");
 24092  try {
 24093   test_2d_shadow_gradient_transparent_2();
 24094  } catch (e) {
 24095   ok(false, "unexpected exception thrown in: test_2d_shadow_gradient_transparent_2");
 24097  try {
 24098   test_2d_shadow_image_alpha();
 24099  } catch (e) {
 24100   ok(false, "unexpected exception thrown in: test_2d_shadow_image_alpha");
 24102  try {
 24103   test_2d_shadow_image_basic();
 24104  } catch (e) {
 24105   ok(false, "unexpected exception thrown in: test_2d_shadow_image_basic");
 24107  try {
 24108   test_2d_shadow_image_scale();
 24109  } catch (e) {
 24110   ok(false, "unexpected exception thrown in: test_2d_shadow_image_scale");
 24112  try {
 24113   test_2d_shadow_image_section();
 24114  } catch (e) {
 24115   ok(false, "unexpected exception thrown in: test_2d_shadow_image_section");
 24117  try {
 24118   test_2d_shadow_image_transparent_1();
 24119  } catch (e) {
 24120   ok(false, "unexpected exception thrown in: test_2d_shadow_image_transparent_1");
 24122  try {
 24123   test_2d_shadow_image_transparent_2();
 24124  } catch (e) {
 24125   ok(false, "unexpected exception thrown in: test_2d_shadow_image_transparent_2");
 24127  try {
 24128   test_2d_shadow_offset_negativeX();
 24129  } catch (e) {
 24130   ok(false, "unexpected exception thrown in: test_2d_shadow_offset_negativeX");
 24132  try {
 24133   test_2d_shadow_offset_negativeY();
 24134  } catch (e) {
 24135   ok(false, "unexpected exception thrown in: test_2d_shadow_offset_negativeY");
 24137  try {
 24138   test_2d_shadow_offset_positiveX();
 24139  } catch (e) {
 24140   ok(false, "unexpected exception thrown in: test_2d_shadow_offset_positiveX");
 24142  try {
 24143   test_2d_shadow_offset_positiveY();
 24144  } catch (e) {
 24145   ok(false, "unexpected exception thrown in: test_2d_shadow_offset_positiveY");
 24147  try {
 24148   test_2d_shadow_outside();
 24149  } catch (e) {
 24150   ok(false, "unexpected exception thrown in: test_2d_shadow_outside");
 24152  try {
 24153   test_2d_shadow_pattern_alpha();
 24154  } catch (e) {
 24155   ok(false, "unexpected exception thrown in: test_2d_shadow_pattern_alpha");
 24157  try {
 24158   test_2d_shadow_pattern_basic();
 24159  } catch (e) {
 24160   ok(false, "unexpected exception thrown in: test_2d_shadow_pattern_basic");
 24162  try {
 24163   test_2d_shadow_pattern_transparent_1();
 24164  } catch (e) {
 24165   ok(false, "unexpected exception thrown in: test_2d_shadow_pattern_transparent_1");
 24167  try {
 24168   test_2d_shadow_pattern_transparent_2();
 24169  } catch (e) {
 24170   ok(false, "unexpected exception thrown in: test_2d_shadow_pattern_transparent_2");
 24172  try {
 24173   test_2d_shadow_stroke_basic();
 24174  } catch (e) {
 24175   ok(false, "unexpected exception thrown in: test_2d_shadow_stroke_basic");
 24177  try {
 24178   test_2d_shadow_stroke_cap_1();
 24179  } catch (e) {
 24180   ok(false, "unexpected exception thrown in: test_2d_shadow_stroke_cap_1");
 24182  try {
 24183   test_2d_shadow_stroke_cap_2();
 24184  } catch (e) {
 24185   ok(false, "unexpected exception thrown in: test_2d_shadow_stroke_cap_2");
 24187  try {
 24188   test_2d_shadow_stroke_join_1();
 24189  } catch (e) {
 24190   ok(false, "unexpected exception thrown in: test_2d_shadow_stroke_join_1");
 24192  try {
 24193   test_2d_shadow_stroke_join_2();
 24194  } catch (e) {
 24195   ok(false, "unexpected exception thrown in: test_2d_shadow_stroke_join_2");
 24197  try {
 24198   test_2d_shadow_stroke_join_3();
 24199  } catch (e) {
 24200   ok(false, "unexpected exception thrown in: test_2d_shadow_stroke_join_3");
 24202  try {
 24203   test_2d_shadow_transform_1();
 24204  } catch (e) {
 24205   ok(false, "unexpected exception thrown in: test_2d_shadow_transform_1");
 24207  try {
 24208   test_2d_shadow_transform_2();
 24209  } catch (e) {
 24210   ok(false, "unexpected exception thrown in: test_2d_shadow_transform_2");
 24212  try {
 24213   test_2d_state_saverestore_bitmap();
 24214  } catch (e) {
 24215   ok(false, "unexpected exception thrown in: test_2d_state_saverestore_bitmap");
 24217  try {
 24218   test_2d_state_saverestore_clip();
 24219  } catch (e) {
 24220   ok(false, "unexpected exception thrown in: test_2d_state_saverestore_clip");
 24222  try {
 24223   test_2d_state_saverestore_fillStyle();
 24224  } catch (e) {
 24225   ok(false, "unexpected exception thrown in: test_2d_state_saverestore_fillStyle");
 24227  try {
 24228   test_2d_state_saverestore_globalAlpha();
 24229  } catch (e) {
 24230   ok(false, "unexpected exception thrown in: test_2d_state_saverestore_globalAlpha");
 24232  try {
 24233   test_2d_state_saverestore_globalCompositeOperation();
 24234  } catch (e) {
 24235   ok(false, "unexpected exception thrown in: test_2d_state_saverestore_globalCompositeOperation");
 24237  try {
 24238   test_2d_state_saverestore_lineCap();
 24239  } catch (e) {
 24240   ok(false, "unexpected exception thrown in: test_2d_state_saverestore_lineCap");
 24242  try {
 24243   test_2d_state_saverestore_lineJoin();
 24244  } catch (e) {
 24245   ok(false, "unexpected exception thrown in: test_2d_state_saverestore_lineJoin");
 24247  try {
 24248   test_2d_state_saverestore_lineWidth();
 24249  } catch (e) {
 24250   ok(false, "unexpected exception thrown in: test_2d_state_saverestore_lineWidth");
 24252  try {
 24253   test_2d_state_saverestore_miterLimit();
 24254  } catch (e) {
 24255   ok(false, "unexpected exception thrown in: test_2d_state_saverestore_miterLimit");
 24257  try {
 24258   test_2d_state_saverestore_path();
 24259  } catch (e) {
 24260   ok(false, "unexpected exception thrown in: test_2d_state_saverestore_path");
 24262  try {
 24263   test_2d_state_saverestore_shadowBlur();
 24264  } catch (e) {
 24265   ok(false, "unexpected exception thrown in: test_2d_state_saverestore_shadowBlur");
 24267  try {
 24268   test_2d_state_saverestore_shadowColor();
 24269  } catch (e) {
 24270   ok(false, "unexpected exception thrown in: test_2d_state_saverestore_shadowColor");
 24272  try {
 24273   test_2d_state_saverestore_shadowOffsetX();
 24274  } catch (e) {
 24275   ok(false, "unexpected exception thrown in: test_2d_state_saverestore_shadowOffsetX");
 24277  try {
 24278   test_2d_state_saverestore_shadowOffsetY();
 24279  } catch (e) {
 24280   ok(false, "unexpected exception thrown in: test_2d_state_saverestore_shadowOffsetY");
 24282  try {
 24283   test_2d_state_saverestore_stack();
 24284  } catch (e) {
 24285   ok(false, "unexpected exception thrown in: test_2d_state_saverestore_stack");
 24287  try {
 24288   test_2d_state_saverestore_stackdepth();
 24289  } catch (e) {
 24290   ok(false, "unexpected exception thrown in: test_2d_state_saverestore_stackdepth");
 24292  try {
 24293   test_2d_state_saverestore_strokeStyle();
 24294  } catch (e) {
 24295   ok(false, "unexpected exception thrown in: test_2d_state_saverestore_strokeStyle");
 24297  try {
 24298   test_2d_state_saverestore_transformation();
 24299  } catch (e) {
 24300   ok(false, "unexpected exception thrown in: test_2d_state_saverestore_transformation");
 24302  try {
 24303   test_2d_state_saverestore_underflow();
 24304  } catch (e) {
 24305   ok(false, "unexpected exception thrown in: test_2d_state_saverestore_underflow");
 24307  try {
 24308   test_2d_strokeRect_basic();
 24309  } catch (e) {
 24310   ok(false, "unexpected exception thrown in: test_2d_strokeRect_basic");
 24312  try {
 24313   test_2d_strokeRect_clip();
 24314  } catch (e) {
 24315   ok(false, "unexpected exception thrown in: test_2d_strokeRect_clip");
 24317  try {
 24318   test_2d_strokeRect_globalalpha();
 24319  } catch (e) {
 24320   ok(false, "unexpected exception thrown in: test_2d_strokeRect_globalalpha");
 24322  try {
 24323   test_2d_strokeRect_globalcomposite();
 24324  } catch (e) {
 24325   ok(false, "unexpected exception thrown in: test_2d_strokeRect_globalcomposite");
 24327  try {
 24328   test_2d_strokeRect_negative();
 24329  } catch (e) {
 24330   ok(false, "unexpected exception thrown in: test_2d_strokeRect_negative");
 24332  try {
 24333   test_2d_strokeRect_nonfinite();
 24334  } catch (e) {
 24335   ok(false, "unexpected exception thrown in: test_2d_strokeRect_nonfinite");
 24337  try {
 24338   test_2d_strokeRect_path();
 24339  } catch (e) {
 24340   ok(false, "unexpected exception thrown in: test_2d_strokeRect_path");
 24342  try {
 24343   test_2d_strokeRect_shadow();
 24344  } catch (e) {
 24345   ok(false, "unexpected exception thrown in: test_2d_strokeRect_shadow");
 24347  try {
 24348   test_2d_strokeRect_transform();
 24349  } catch (e) {
 24350   ok(false, "unexpected exception thrown in: test_2d_strokeRect_transform");
 24352  try {
 24353   test_2d_strokeRect_zero_1();
 24354  } catch (e) {
 24355   ok(false, "unexpected exception thrown in: test_2d_strokeRect_zero_1");
 24357  try {
 24358   test_2d_strokeRect_zero_2();
 24359  } catch (e) {
 24360   ok(false, "unexpected exception thrown in: test_2d_strokeRect_zero_2");
 24362  try {
 24363   test_2d_strokeRect_zero_3();
 24364  } catch (e) {
 24365   ok(false, "unexpected exception thrown in: test_2d_strokeRect_zero_3");
 24367  try {
 24368   test_2d_strokeRect_zero_4();
 24369  } catch (e) {
 24370   ok(false, "unexpected exception thrown in: test_2d_strokeRect_zero_4");
 24372  try {
 24373   test_2d_strokeStyle_default();
 24374  } catch (e) {
 24375   ok(false, "unexpected exception thrown in: test_2d_strokeStyle_default");
 24377  try {
 24378   test_2d_text_align_default();
 24379  } catch (e) {
 24380   ok(false, "unexpected exception thrown in: test_2d_text_align_default");
 24382  try {
 24383   test_2d_text_align_invalid();
 24384  } catch (e) {
 24385   ok(false, "unexpected exception thrown in: test_2d_text_align_invalid");
 24387  try {
 24388   test_2d_text_baseline_default();
 24389  } catch (e) {
 24390   ok(false, "unexpected exception thrown in: test_2d_text_baseline_default");
 24392  try {
 24393   test_2d_text_baseline_invalid();
 24394  } catch (e) {
 24395   ok(false, "unexpected exception thrown in: test_2d_text_baseline_invalid");
 24397  try {
 24398   test_2d_transformation_order();
 24399  } catch (e) {
 24400   ok(false, "unexpected exception thrown in: test_2d_transformation_order");
 24402  try {
 24403   test_2d_transformation_rotate_direction();
 24404  } catch (e) {
 24405   ok(false, "unexpected exception thrown in: test_2d_transformation_rotate_direction");
 24407  try {
 24408   test_2d_transformation_rotate_nonfinite();
 24409  } catch (e) {
 24410   ok(false, "unexpected exception thrown in: test_2d_transformation_rotate_nonfinite");
 24412  try {
 24413   test_2d_transformation_rotate_radians();
 24414  } catch (e) {
 24415   ok(false, "unexpected exception thrown in: test_2d_transformation_rotate_radians");
 24417  try {
 24418   test_2d_transformation_rotate_wrap();
 24419  } catch (e) {
 24420   ok(false, "unexpected exception thrown in: test_2d_transformation_rotate_wrap");
 24422  try {
 24423   test_2d_transformation_rotate_wrapnegative();
 24424  } catch (e) {
 24425   ok(false, "unexpected exception thrown in: test_2d_transformation_rotate_wrapnegative");
 24427  try {
 24428   test_2d_transformation_rotate_zero();
 24429  } catch (e) {
 24430   ok(false, "unexpected exception thrown in: test_2d_transformation_rotate_zero");
 24432  try {
 24433   test_2d_transformation_scale_basic();
 24434  } catch (e) {
 24435   ok(false, "unexpected exception thrown in: test_2d_transformation_scale_basic");
 24437  try {
 24438   test_2d_transformation_scale_large();
 24439  } catch (e) {
 24440   ok(false, "unexpected exception thrown in: test_2d_transformation_scale_large");
 24442  try {
 24443   test_2d_transformation_scale_multiple();
 24444  } catch (e) {
 24445   ok(false, "unexpected exception thrown in: test_2d_transformation_scale_multiple");
 24447  try {
 24448   test_2d_transformation_scale_negative();
 24449  } catch (e) {
 24450   ok(false, "unexpected exception thrown in: test_2d_transformation_scale_negative");
 24452  try {
 24453   test_2d_transformation_scale_nonfinite();
 24454  } catch (e) {
 24455   ok(false, "unexpected exception thrown in: test_2d_transformation_scale_nonfinite");
 24457  try {
 24458   test_2d_transformation_scale_zero();
 24459  } catch (e) {
 24460   ok(false, "unexpected exception thrown in: test_2d_transformation_scale_zero");
 24462  try {
 24463   test_2d_transformation_setTransform_multiple();
 24464  } catch (e) {
 24465   ok(false, "unexpected exception thrown in: test_2d_transformation_setTransform_multiple");
 24467  try {
 24468   test_2d_transformation_setTransform_nonfinite();
 24469  } catch (e) {
 24470   ok(false, "unexpected exception thrown in: test_2d_transformation_setTransform_nonfinite");
 24472  try {
 24473   test_2d_transformation_setTransform_skewed();
 24474  } catch (e) {
 24475   ok(false, "unexpected exception thrown in: test_2d_transformation_setTransform_skewed");
 24477  try {
 24478   test_2d_transformation_transform_identity();
 24479  } catch (e) {
 24480   ok(false, "unexpected exception thrown in: test_2d_transformation_transform_identity");
 24482  try {
 24483   test_2d_transformation_transform_multiply();
 24484  } catch (e) {
 24485   ok(false, "unexpected exception thrown in: test_2d_transformation_transform_multiply");
 24487  try {
 24488   test_2d_transformation_transform_nonfinite();
 24489  } catch (e) {
 24490   ok(false, "unexpected exception thrown in: test_2d_transformation_transform_nonfinite");
 24492  try {
 24493   test_2d_transformation_transform_skewed();
 24494  } catch (e) {
 24495   ok(false, "unexpected exception thrown in: test_2d_transformation_transform_skewed");
 24497  try {
 24498   test_2d_transformation_translate_basic();
 24499  } catch (e) {
 24500   ok(false, "unexpected exception thrown in: test_2d_transformation_translate_basic");
 24502  try {
 24503   test_2d_transformation_translate_nonfinite();
 24504  } catch (e) {
 24505   ok(false, "unexpected exception thrown in: test_2d_transformation_translate_nonfinite");
 24507  try {
 24508   test_2d_type_exists();
 24509  } catch (e) {
 24510   ok(false, "unexpected exception thrown in: test_2d_type_exists");
 24512  try {
 24513   test_2d_type_extend();
 24514  } catch (e) {
 24515   ok(false, "unexpected exception thrown in: test_2d_type_extend");
 24517  try {
 24518   test_2d_type_prototype();
 24519  } catch (e) {
 24520   ok(false, "unexpected exception thrown in: test_2d_type_prototype");
 24522  try {
 24523   test_2d_type_replace();
 24524  } catch (e) {
 24525   ok(false, "unexpected exception thrown in: test_2d_type_replace");
 24527  try {
 24528   test_2d_voidreturn();
 24529  } catch (e) {
 24530   ok(false, "unexpected exception thrown in: test_2d_voidreturn");
 24532  try {
 24533   test_bug397524();
 24534  } catch (e) {
 24535   ok(false, "unexpected exception thrown in: test_bug397524");
 24537  try {
 24538   test_bug405982();
 24539  } catch (e) {
 24540   ok(false, "unexpected exception thrown in: test_bug405982");
 24542  try {
 24543   test_context_arguments_extra();
 24544  } catch (e) {
 24545   ok(false, "unexpected exception thrown in: test_context_arguments_extra");
 24547  try {
 24548   test_context_arguments_missing();
 24549  } catch (e) {
 24550   ok(false, "unexpected exception thrown in: test_context_arguments_missing");
 24552  try {
 24553   test_context_casesensitive();
 24554  } catch (e) {
 24555   ok(false, "unexpected exception thrown in: test_context_casesensitive");
 24557  try {
 24558   test_context_emptystring();
 24559  } catch (e) {
 24560   ok(false, "unexpected exception thrown in: test_context_emptystring");
 24562  try {
 24563   test_context_unrecognised_badname();
 24564  } catch (e) {
 24565   ok(false, "unexpected exception thrown in: test_context_unrecognised_badname");
 24567  try {
 24568   test_context_unrecognised_badsuffix();
 24569  } catch (e) {
 24570   ok(false, "unexpected exception thrown in: test_context_unrecognised_badsuffix");
 24572  try {
 24573   test_context_unrecognised_nullsuffix();
 24574  } catch (e) {
 24575   ok(false, "unexpected exception thrown in: test_context_unrecognised_nullsuffix");
 24577  try {
 24578   test_context_unrecognised_unicode();
 24579  } catch (e) {
 24580   ok(false, "unexpected exception thrown in: test_context_unrecognised_unicode");
 24582  try {
 24583   test_fallback_basic();
 24584  } catch (e) {
 24585   ok(false, "unexpected exception thrown in: test_fallback_basic");
 24587  try {
 24588   test_fallback_multiple();
 24589  } catch (e) {
 24590   ok(false, "unexpected exception thrown in: test_fallback_multiple");
 24592  try {
 24593   test_fallback_nested();
 24594  } catch (e) {
 24595   ok(false, "unexpected exception thrown in: test_fallback_nested");
 24597  try {
 24598   test_initial_colour();
 24599  } catch (e) {
 24600   ok(false, "unexpected exception thrown in: test_initial_colour");
 24602  try {
 24603   test_initial_reset_2dstate();
 24604  } catch (e) {
 24605   ok(false, "unexpected exception thrown in: test_initial_reset_2dstate");
 24607  try {
 24608   test_initial_reset_clip();
 24609  } catch (e) {
 24610   ok(false, "unexpected exception thrown in: test_initial_reset_clip");
 24612  try {
 24613   test_initial_reset_different();
 24614  } catch (e) {
 24615   ok(false, "unexpected exception thrown in: test_initial_reset_different");
 24617  try {
 24618   test_initial_reset_gradient();
 24619  } catch (e) {
 24620   ok(false, "unexpected exception thrown in: test_initial_reset_gradient");
 24622  try {
 24623   test_initial_reset_path();
 24624  } catch (e) {
 24625   ok(false, "unexpected exception thrown in: test_initial_reset_path");
 24627  try {
 24628   test_initial_reset_pattern();
 24629  } catch (e) {
 24630   ok(false, "unexpected exception thrown in: test_initial_reset_pattern");
 24632  try {
 24633   test_initial_reset_same();
 24634  } catch (e) {
 24635   ok(false, "unexpected exception thrown in: test_initial_reset_same");
 24637  try {
 24638   test_initial_reset_transform();
 24639  } catch (e) {
 24640   ok(false, "unexpected exception thrown in: test_initial_reset_transform");
 24642  try {
 24643   test_size_attributes_default();
 24644  } catch (e) {
 24645   ok(false, "unexpected exception thrown in: test_size_attributes_default");
 24647  try {
 24648   test_size_attributes();
 24649  } catch (e) {
 24650   ok(false, "unexpected exception thrown in: test_size_attributes");
 24652  try {
 24653   test_size_attributes_parse_badsuffix();
 24654  } catch (e) {
 24655   ok(false, "unexpected exception thrown in: test_size_attributes_parse_badsuffix");
 24657  try {
 24658   test_size_attributes_parse_floatsuffix();
 24659  } catch (e) {
 24660   ok(false, "unexpected exception thrown in: test_size_attributes_parse_floatsuffix");
 24662  try {
 24663   test_size_attributes_parse_negative();
 24664  } catch (e) {
 24665   ok(false, "unexpected exception thrown in: test_size_attributes_parse_negative");
 24667  try {
 24668   test_size_attributes_parse_nonnumber();
 24669  } catch (e) {
 24670   ok(false, "unexpected exception thrown in: test_size_attributes_parse_nonnumber");
 24672  try {
 24673   test_size_attributes_parse_percentsuffix();
 24674  } catch (e) {
 24675   ok(false, "unexpected exception thrown in: test_size_attributes_parse_percentsuffix");
 24677  try {
 24678   test_size_attributes_parse_whitespace();
 24679  } catch (e) {
 24680   ok(false, "unexpected exception thrown in: test_size_attributes_parse_whitespace");
 24682  try {
 24683   test_size_attributes_parse_zero();
 24684  } catch (e) {
 24685   ok(false, "unexpected exception thrown in: test_size_attributes_parse_zero");
 24687  try {
 24688   test_size_attributes_parse_zerosuffix();
 24689  } catch (e) {
 24690   ok(false, "unexpected exception thrown in: test_size_attributes_parse_zerosuffix");
 24692  try {
 24693   test_size_attributes_reflect_1();
 24694  } catch (e) {
 24695   ok(false, "unexpected exception thrown in: test_size_attributes_reflect_1");
 24697  try {
 24698   test_size_attributes_reflect_2();
 24699  } catch (e) {
 24700   ok(false, "unexpected exception thrown in: test_size_attributes_reflect_2");
 24702  try {
 24703   test_size_attributes_removed();
 24704  } catch (e) {
 24705   ok(false, "unexpected exception thrown in: test_size_attributes_removed");
 24707  try {
 24708   test_size_attributes_setAttribute_badsuffix();
 24709  } catch (e) {
 24710   ok(false, "unexpected exception thrown in: test_size_attributes_setAttribute_badsuffix");
 24712  try {
 24713   test_size_attributes_setAttribute_floatsuffix();
 24714  } catch (e) {
 24715   ok(false, "unexpected exception thrown in: test_size_attributes_setAttribute_floatsuffix");
 24717  try {
 24718   test_size_attributes_setAttribute_negative();
 24719  } catch (e) {
 24720   ok(false, "unexpected exception thrown in: test_size_attributes_setAttribute_negative");
 24722  try {
 24723   test_size_attributes_setAttribute_nonnumber();
 24724  } catch (e) {
 24725   ok(false, "unexpected exception thrown in: test_size_attributes_setAttribute_nonnumber");
 24727  try {
 24728   test_size_attributes_setAttribute_percentsuffix();
 24729  } catch (e) {
 24730   ok(false, "unexpected exception thrown in: test_size_attributes_setAttribute_percentsuffix");
 24732  try {
 24733   test_size_attributes_setAttribute_whitespace();
 24734  } catch (e) {
 24735   ok(false, "unexpected exception thrown in: test_size_attributes_setAttribute_whitespace");
 24737  try {
 24738   test_size_attributes_setAttribute_zero();
 24739  } catch (e) {
 24740   ok(false, "unexpected exception thrown in: test_size_attributes_setAttribute_zero");
 24742  try {
 24743   test_size_attributes_setAttribute_zerosuffix();
 24744  } catch (e) {
 24745   ok(false, "unexpected exception thrown in: test_size_attributes_setAttribute_zerosuffix");
 24747  try {
 24748   test_size_attributes_style();
 24749  } catch (e) {
 24750   ok(false, "unexpected exception thrown in: test_size_attributes_style");
 24752  try {
 24753   test_size_attributes_type_get();
 24754  } catch (e) {
 24755   ok(false, "unexpected exception thrown in: test_size_attributes_type_get");
 24757  try {
 24758   test_size_attributes_type_set();
 24759  } catch (e) {
 24760   ok(false, "unexpected exception thrown in: test_size_attributes_type_set");
 24762  try {
 24763   test_text_font();
 24764  } catch (e) {
 24765   ok(false, "unexpected exception thrown in: test_text_font");
 24767  try {
 24768   test_text_measure();
 24769  } catch (e) {
 24770   ok(false, "unexpected exception thrown in: test_text_measure");
 24772  try {
 24773   test_text_space_replace();
 24774  } catch (e) {
 24775   ok(false, "unexpected exception thrown in: test_text_space_replace");
 24777  try {
 24778   test_text_textAlign();
 24779  } catch (e) {
 24780   ok(false, "unexpected exception thrown in: test_text_textAlign");
 24782  try {
 24783   test_text_textBaseline();
 24784  } catch (e) {
 24785   ok(false, "unexpected exception thrown in: test_text_textBaseline");
 24787  try {
 24788   test_toDataURL_arguments_1();
 24789  } catch (e) {
 24790   ok(false, "unexpected exception thrown in: test_toDataURL_arguments_1");
 24792  try {
 24793   test_toDataURL_arguments_2();
 24794  } catch (e) {
 24795   ok(false, "unexpected exception thrown in: test_toDataURL_arguments_2");
 24797  try {
 24798   test_toDataURL_arguments_3();
 24799  } catch (e) {
 24800   ok(false, "unexpected exception thrown in: test_toDataURL_arguments_3");
 24802  try {
 24803   test_toDataURL_complexcolours();
 24804  } catch (e) {
 24805   ok(false, "unexpected exception thrown in: test_toDataURL_complexcolours");
 24807  try {
 24808   test_toDataURL_default();
 24809  } catch (e) {
 24810   ok(false, "unexpected exception thrown in: test_toDataURL_default");
 24812  try {
 24813   test_toDataURL_lowercase();
 24814  } catch (e) {
 24815   ok(false, "unexpected exception thrown in: test_toDataURL_lowercase");
 24817  try {
 24818   test_toDataURL_nocontext();
 24819  } catch (e) {
 24820   ok(false, "unexpected exception thrown in: test_toDataURL_nocontext");
 24822  try {
 24823   test_toDataURL_png();
 24824  } catch (e) {
 24825   ok(false, "unexpected exception thrown in: test_toDataURL_png");
 24827  try {
 24828   test_toDataURL_primarycolours();
 24829  } catch (e) {
 24830   ok(false, "unexpected exception thrown in: test_toDataURL_primarycolours");
 24832  try {
 24833   test_toDataURL_unrecognised();
 24834  } catch (e) {
 24835   ok(false, "unexpected exception thrown in: test_toDataURL_unrecognised");
 24837  try {
 24838   test_toDataURL_zerosize();
 24839  } catch (e) {
 24840   ok(false, "unexpected exception thrown in: test_toDataURL_zerosize");
 24842  try {
 24843   test_type_exists();
 24844  } catch (e) {
 24845   ok(false, "unexpected exception thrown in: test_type_exists");
 24847  try {
 24848   test_type_extend();
 24849  } catch (e) {
 24850   ok(false, "unexpected exception thrown in: test_type_extend");
 24852  try {
 24853   test_type_name();
 24854  } catch (e) {
 24855   ok(false, "unexpected exception thrown in: test_type_name");
 24857  try {
 24858   test_type_prototype();
 24859  } catch (e) {
 24860   ok(false, "unexpected exception thrown in: test_type_prototype");
 24862  try {
 24863   test_2d_imagedata_coercion();
 24864  } catch (e) {
 24865   ok(false, "unexpected exception thrown in: test_2d_imagedata_coercion");
 24867  try {
 24868   test_2d_imageSmoothing();
 24869  } catch (e) {
 24870   ok(false, "unexpected exception thrown in: test_2d_imageSmoothing");
 24872  try {
 24873   test_zero_dimensions();
 24874  } catch (e) {
 24875   ok(false, "unexpected exception thrown in: test_zero_dimensions");
 24877  try {
 24878   test_zero_dimensions_imagedata();
 24879  } catch(e) {
 24880   ok(false, "unexpected exception thrown in: test_zero_dimensions_imagedata");
 24882  try {
 24883   test_getImageData_after_zero_canvas();
 24884  } catch(e) {
 24885   throw e;
 24886   ok(false, "unexpected exception thrown in: test_getImageData_after_zero_canvas");
 24888  try {
 24889   test_linedash();
 24890  } catch(e) {
 24891   throw e;
 24892   ok(false, "unexpected exception thrown in: test_linedash");
 24894 try {
 24895   test_opaque();
 24896  } catch(e) {
 24897   throw e;
 24898   ok(false, "unexpected exception thrown in: test_opaque");
 24900  try {
 24901   // run this test last since it replaces the getContext method
 24902   test_type_replace();
 24903  } catch (e) {
 24904   ok(false, "unexpected exception thrown in: test_type_replace");
 24907  //run the asynchronous tests
 24908  try {
 24909   test_2d_drawImage_animated_apng();
 24910  } catch (e) {
 24911   ok(false, "unexpected exception thrown in: test_2d_drawImage_animated_apng");
 24913  try {
 24914   test_2d_drawImage_animated_gif();
 24915  } catch (e) {
 24916   ok(false, "unexpected exception thrown in: test_2d_drawImage_animated_gif");
 24919  setTimeout(asyncTestsDone, 500);
 24922 addLoadEvent(runTests);
 24924 </script>

mercurial