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

   1 description("This test checks ellipse API in canvas v5");
   2
   3 var canvas = document.createElement('canvas');
   4 document.body.appendChild(canvas);
   5 canvas.setAttribute('width', '400');
   6 canvas.setAttribute('height', '400');
   7 var ctx = canvas.getContext('2d');
   8
   9 ctx.fillStyle="rgba(255, 255, 255, 1.0)";
  10 ctx.fillRect(0, 0, 400, 400);
  11
  12 ctx.strokeStyle="rgba(0, 0, 0, 1.0)";
  13 ctx.lineWidth = 10;
  14 ctx.beginPath();
  15 ctx.moveTo(0, 100);
  16 ctx.ellipse(200, 200, 100, 150, Math.PI / 9, -Math.PI, Math.PI * 5 / 9, false);
  17 ctx.lineTo(0, 300);
  18 ctx.stroke();
  19
  20 var imageData, data;
  21
  22 // Verify the method must add a straight line from the last point in the subpath
  23 // to the start point of the ellipse.
  24 imageData = ctx.getImageData(5, 103, 1, 1);
  25 data = imageData.data;
  26 shouldBe('data[0]', '0');
  27
  28 imageData = ctx.getImageData(49, 130, 1, 1);
  29 data = imageData.data;
  30 shouldBe('data[0]', '0');
  31
  32 imageData = ctx.getImageData(103, 163, 1, 1);
  33 data = imageData.data;
  34 shouldBe('data[0]', '0');
  35
  36 imageData = ctx.getImageData(36, 108, 1, 1);
  37 data = imageData.data;
  38 shouldBe('data[0]', '255');
  39
  40 // Verify ellipse API draws well.
  41 imageData = ctx.getImageData(101, 179, 1, 1);
  42 data = imageData.data;
  43 shouldBe('data[0]', '255');
  44
  45 imageData = ctx.getImageData(119, 132, 1, 1);
  46 data = imageData.data;
  47 shouldBe('data[0]', '0');
  48
  49 imageData = ctx.getImageData(260, 62, 1, 1);
  50 data = imageData.data;
  51 shouldBe('data[0]', '0');
  52
  53 imageData = ctx.getImageData(301, 122, 1, 1);
  54 data = imageData.data;
  55 shouldBe('data[0]', '0');
  56
  57 imageData = ctx.getImageData(273, 272, 1, 1);
  58 data = imageData.data;
  59 shouldBe('data[0]', '0');
  60
  61 imageData = ctx.getImageData(169, 344, 1, 1);
  62 data = imageData.data;
  63 shouldBe('data[0]', '0');
  64
  65 imageData = ctx.getImageData(196, 362, 1, 1);
  66 data = imageData.data;
  67 shouldBe('data[0]', '255');
  68
  69 // Verify the last point of ellipse is the start point of the next subpath.
  70 imageData = ctx.getImageData(128, 331, 1, 1);
  71 data = imageData.data;
  72 shouldBe('data[0]', '0');
  73
  74 imageData = ctx.getImageData(65, 315, 1, 1);
  75 data = imageData.data;
  76 shouldBe('data[0]', '0');
  77
  78 imageData = ctx.getImageData(9, 302, 1, 1);
  79 data = imageData.data;
  80 shouldBe('data[0]', '0');
  81
  82 imageData = ctx.getImageData(58, 300, 1, 1);
  83 data = imageData.data;
  84 shouldBe('data[0]', '255');
  85