third_party/WebKit/LayoutTests/fast/canvas/canvas-save-restore-with-path.js

   1 description("This test ensures that paths are correctly handled over save/restore boundaries");
   2
   3 function dataToArray(data) {
   4     var result = new Array(data.length)
   5     for (var i = 0; i < data.length; i++)
   6         result[i] = data[i];
   7     return result;
   8 }
   9
  10 function getPixel(x, y) {
  11     var data = context.getImageData(x,y,1,1);
  12     if (!data) // getImageData failed, which should never happen
  13         return [-1,-1,-1,-1];
  14     return dataToArray(data.data);
  15 }
  16
  17 function pixelShouldBe(x, y, colour) {
  18     shouldBe("getPixel(" + [x, y] +")", "["+colour+"]");
  19 }
  20
  21 var canvas = document.createElement("canvas");
  22 canvas.width = 100;
  23 canvas.height = 100;
  24
  25 var context = canvas.getContext("2d");
  26 context.fillStyle = "red";
  27 context.fillRect(0,0,100,100);
  28 context.fillStyle = "green";
  29
  30 // Test translate
  31 context.beginPath();
  32 context.save();
  33 context.translate(100, 100);
  34 context.rect(-100, -100, 50, 50);
  35 context.restore();
  36 context.fill();
  37 pixelShouldBe(25, 25, [0, 128, 0, 255]);
  38
  39 // Test scale
  40 context.beginPath();
  41 context.save();
  42 context.scale(2, 2);
  43 context.rect(25, 0,25,25);
  44 context.restore();
  45 context.fill();
  46 pixelShouldBe(75, 25, [0, 128, 0, 255]);
  47 pixelShouldBe(75, 75, [255, 0, 0, 255]);
  48
  49 // Test rotate
  50 context.beginPath();
  51 context.save();
  52 context.rotate(90/180 * Math.PI);
  53 context.rect(50, -50, 50, 50);
  54 context.restore();
  55 context.fill();
  56 pixelShouldBe(25, 75, [0, 128, 0, 255]);
  57 pixelShouldBe(75, 75, [255, 0, 0, 255]);
  58
  59 // Test transform
  60 context.beginPath();
  61 context.save();
  62 context.transform(1, 0, 0, 1, 50, 50);
  63 context.rect(0, 0, 50, 50);
  64 context.restore();
  65 context.fill();
  66 pixelShouldBe(75, 75, [0, 128, 0, 255]);