third_party/WebKit/LayoutTests/fast/canvas/script-tests/canvas-setTransform.js

   1 description("Series of tests to ensure correct behaviour of canvas.setTransform()");
   2 var ctx = document.createElement('canvas').getContext('2d');
   3
   4 debug("Reset the CTM to the initial matrix");
   5 ctx.beginPath();
   6 ctx.scale(0.5, 0.5);
   7 ctx.setTransform(1, 0, 0, 1, 0, 0);
   8 ctx.fillStyle = 'green';
   9 ctx.fillRect(0, 0, 100, 100);
  10
  11 var imageData = ctx.getImageData(1, 1, 98, 98);
  12 var imgdata = imageData.data;
  13 shouldBe("imgdata[4]", "0");
  14 shouldBe("imgdata[5]", "128");
  15 shouldBe("imgdata[6]", "0");
  16
  17 debug("setTransform should not affect the current path");
  18 ctx.beginPath();
  19 ctx.rect(0,0,100,100);
  20 ctx.save();
  21 ctx.setTransform(0.5, 0, 0, 0.5, 10, 10);
  22 ctx.fillStyle = 'red';
  23 ctx.fillRect(0, 0, 100, 100);
  24 ctx.restore();
  25 ctx.fillStyle = 'green';
  26 ctx.fillRect(0, 0, 100, 100);
  27
  28 imageData = ctx.getImageData(1, 1, 98, 98);
  29 imgdata = imageData.data;
  30 shouldBe("imgdata[4]", "0");
  31 shouldBe("imgdata[5]", "128");
  32 shouldBe("imgdata[6]", "0");
  33
  34 debug("setTransform should not affect the CTM outside of save() and restore()");
  35 ctx.beginPath();
  36 ctx.fillStyle = 'green';
  37 ctx.save();
  38 ctx.setTransform(0.5, 0, 0, 0.5, 0, 0);
  39 ctx.fillStyle = 'red';
  40 ctx.fillRect(0, 0, 100, 100);
  41 ctx.restore();
  42 ctx.fillRect(0, 0, 100, 100);
  43
  44 imageData = ctx.getImageData(1, 1, 98, 98);
  45 imgdata = imageData.data;
  46 shouldBe("imgdata[4]", "0");
  47 shouldBe("imgdata[5]", "128");
  48 shouldBe("imgdata[6]", "0");
  49
  50
  51 debug("stop drawing on not-invertible CTM");
  52 ctx.beginPath();
  53 ctx.fillStyle = 'green';
  54 ctx.fillRect(0, 0, 100, 100);
  55 ctx.setTransform(0, 0, 0, 0, 0, 0);
  56 ctx.fillStyle = 'red';
  57 ctx.fillRect(0, 0, 100, 100);
  58
  59 imageData = ctx.getImageData(1, 1, 98, 98);
  60 imgdata = imageData.data;
  61 shouldBe("imgdata[4]", "0");
  62 shouldBe("imgdata[5]", "128");
  63 shouldBe("imgdata[6]", "0");
  64
  65 debug("setTransform with a not-invertible matrix should only stop the drawing up to the next restore()");
  66 ctx.beginPath();
  67 ctx.resetTransform();
  68 ctx.save();
  69 ctx.setTransform(0, 0, 0, 0, 0, 0);
  70 ctx.fillStyle = 'red';
  71 ctx.fillRect(0, 0, 100, 100);
  72 ctx.restore();
  73 ctx.fillStyle = 'blue';
  74 ctx.fillRect(0, 0, 100, 100);
  75
  76 imageData = ctx.getImageData(1, 1, 98, 98);
  77 imgdata = imageData.data;
  78 shouldBe("imgdata[4]", "0");
  79 shouldBe("imgdata[5]", "0");
  80 shouldBe("imgdata[6]", "255");
  81
  82 debug("setTransform should set transform although CTM is not-invertible");
  83 ctx.beginPath();
  84 ctx.fillStyle = 'red';
  85 ctx.fillRect(0, 0, 100, 100);
  86 ctx.setTransform(0, 0, 0, 0, 0, 0);
  87 ctx.fillStyle = 'green';
  88 ctx.fillRect(0, 0, 100, 100);
  89 ctx.setTransform(1, 0, 0, 1, 0, 0);
  90 ctx.fillStyle = 'blue';
  91 ctx.fillRect(0, 0, 100, 100);
  92
  93 imageData = ctx.getImageData(1, 1, 98, 98);
  94 imgdata = imageData.data;
  95 shouldBe("imgdata[4]", "0");
  96 shouldBe("imgdata[5]", "0");
  97 shouldBe("imgdata[6]", "255");