dom/canvas/test/test_2d_composite_canvaspattern_setTransform.html

   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>
   7
   8 SimpleTest.waitForExplicitFinish();
   9 const Cc = SpecialPowers.Cc;
  10 const Cr = SpecialPowers.Cr;
  11
  12 function isPixel(ctx, x,y, r,g,b,a, d) {
  13         var pos = x + "," + y;
  14         var colour = r + "," + g + "," + b + "," + a;
  15     var pixel = ctx.getImageData(x, y, 1, 1);
  16     var pr = pixel.data[0],
  17         pg = pixel.data[1],
  18         pb = pixel.data[2],
  19         pa = pixel.data[3];
  20     ok(r-d <= pr && pr <= r+d &&
  21        g-d <= pg && pg <= g+d &&
  22        b-d <= pb && pb <= b+d &&
  23        a-d <= pa && pa <= a+d,
  24        "pixel "+pos+" of "+ctx.canvas.id+" is "+pr+","+pg+","+pb+","+pa+"; expected "+colour+" +/- "+d);
  25 }
  26 </script>
  27
  28 <p>Canvas test: 2d.composite.canvaspattern.setTransform</p>
  29 <canvas id="ctx" width="100" height="50"><p class="fallback">FAIL
  30 (fallback content)</p></canvas>
  31 <img src="image_rgrg-256x256.png" id="rgrg-256x256.png" width="32"
  32 height="32" class="resource">
  33
  34 <script>
  35
  36 function test_2d_canvaspattern_setTransform() {
  37
  38   var canvas = document.getElementById('ctx');
  39   var ctx = canvas.getContext('2d');
  40   ctx.clearRect(0,0,canvas.width,canvas.height);
  41   var img = document.getElementById("rgrg-256x256.png");
  42   var pat = ctx.createPattern(img,"repeat");
  43
  44   var mtx = new DOMMatrix()
  45   pat.setTransform(mtx.rotate(-45).scale(0.1));
  46   ctx.fillStyle = pat;
  47   ctx.fillRect(0, 0, 100, 50);
  48
  49   // If the pattern doesn't get transformed, or only gets rotated or
  50   // scaled, but not both, this will not be green and will fail.
  51   isPixel(ctx, 90,14, 0,255,0,255, 0);
  52 }
  53 </script>
  54
  55 <script>
  56
  57 function runTests() {
  58  try {
  59   test_2d_canvaspattern_setTransform();
  60  } catch(e) {
  61   ok(false, "unexpected exception thrown in: test_2d_canvaspattern_setTransform");
  62   throw e;
  63  }
  64  SimpleTest.finish();
  65 }
  66
  67 addLoadEvent(function() {
  68   SpecialPowers.pushPrefEnv({"set":[["canvas.path.enabled", true]]}, runTests)
  69 });
  70
  71 // Don't leak the world via the Path2D reference to its window.
  72 document.all;
  73 window.p = new Path2D();
  74
  75 </script>