third_party/WebKit/LayoutTests/fast/canvas/canvas-hit-regions-clear-test.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4   <title>Canvas Hit Regions: clear test</title>
   5   <script src="../../resources/js-test.js"></script>
   6 </head>
   7 <body>
   8 <canvas id="canvas" width="400" height="400">
   9   <button id="yellow"></button>
  10 </canvas>
  11 <script src="./resources/canvas-hit-region-event.js"></script>
  12 <script>
  13
  14   var canvas = document.getElementById("canvas");
  15   var context = canvas.getContext("2d");
  16
  17   shouldBe("internals.countHitRegions(context)", "0");
  18
  19   context.fillStyle = "red";
  20   context.rect(0, 0, 100, 100);
  21   context.fill();
  22   context.addHitRegion({ id : "red" });
  23   shouldBe("internals.countHitRegions(context)", "1");
  24
  25   context.beginPath();
  26   context.fillStyle = "yellow";
  27   context.rect(100, 100, 50, 50);
  28   context.fill();
  29   context.addHitRegion({ id : "yellow", control : document.getElementById("yellow") });
  30   shouldBe("internals.countHitRegions(context)", "2");
  31
  32   shouldBe("clickCanvas(60, 60)", "'red'");
  33   shouldBe("clickCanvas(120, 120)", "'yellow'");
  34
  35   context.clearRect(50, 50, 50, 50);
  36   shouldBe("internals.countHitRegions(context)", "2");
  37   shouldBe("clickCanvas(60, 60)", "null");
  38   shouldBe("clickCanvas(120, 120)", "'yellow'");
  39
  40   context.clearRect(100, 100, 50, 50);
  41   shouldBe("internals.countHitRegions(context)", "1");
  42   shouldBe("clickCanvas(120, 120)", "null");
  43
  44   context.beginPath();
  45   context.fillStyle = "red";
  46   context.rect(60, 60, 40, 40);
  47   context.fill();
  48   shouldBe("clickCanvas(40, 40)", "'red'");
  49   context.addHitRegion({ id : "red" });
  50   shouldBe("internals.countHitRegions(context)", "1");
  51   shouldBe("clickCanvas(62, 62)", "'red'");
  52   shouldBe("clickCanvas(40, 40)", "null");
  53
  54   context.beginPath();
  55   context.fillStyle = "yellow";
  56   context.rect(0, 0, 50, 50);
  57   context.fill();
  58   context.addHitRegion({ id : "yellow", control : document.getElementById("yellow") });
  59   shouldBe("internals.countHitRegions(context)", "2");
  60   shouldBe("clickCanvas(40, 40)", "'yellow'");
  61
  62   context.beginPath();
  63   context.fillStyle = "yellow";
  64   context.rect(100, 0, 50, 50);
  65   context.fill();
  66   context.addHitRegion({ control : document.getElementById("yellow") });
  67   shouldBe("internals.countHitRegions(context)", "2");
  68   shouldBe("clickCanvas(40, 40)", "null");
  69   shouldBe("clickCanvas(101, 1)", "null");
  70
  71   context.beginPath();
  72   context.fillStyle = "blue";
  73   context.rect(100, 50, 20, 20);
  74   context.fill();
  75   context.addHitRegion({ id : "blue" });
  76   shouldBe("internals.countHitRegions(context)", "3");
  77   shouldBe("clickCanvas(101, 51)", "'blue'");
  78
  79   context.removeHitRegion("blue");
  80   shouldBe("internals.countHitRegions(context)", "2");
  81   shouldBe("clickCanvas(101, 51)", "null");
  82
  83   context.clearHitRegions();
  84   shouldBe("internals.countHitRegions(context)", "0");
  85   shouldBe("clickCanvas(62, 62)", "null");
  86
  87   context.clearRect(0, 0, 400, 400);
  88   shouldBe("internals.countHitRegions(context)", "0");
  89
  90   debug("");
  91
  92 </script>
  93 </body>
  94 </html>