summaryrefslogtreecommitdiffstats
path: root/dom/canvas/test/test_canvas_focusring.html
blob: 9e2e832b3e9e79006bfdf64b51823cd0584ef188 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
<!DOCTYPE HTML>
<title>Canvas Tests</title>
<script src="/tests/SimpleTest/SimpleTest.js"></script>
<link rel="stylesheet" href="/tests/SimpleTest/test.css">
<body>
<script>

SimpleTest.waitForExplicitFinish();
const Cc = SpecialPowers.Cc;
const Cr = SpecialPowers.Cr;
SpecialPowers.setBoolPref("canvas.focusring.enabled", true);
SpecialPowers.setBoolPref("canvas.customfocusring.enabled", true);
</script>

<p>Canvas test: drawCustomFocusRing</p>
<canvas id="c688" class="output" width="100" height="50">+
    <input id="button1" type="range" min="1" max="12"></input>
    <input id="button2" type="range" min="1" max="12"></input>
</canvas>
<script type="text/javascript">
function test_drawCustomFocusRing_canvas() {
   var c = document.getElementById("c688");
   var ctx = c.getContext("2d");
   ctx.beginPath();
   var b1 = document.getElementById('button1');
   var b2 = document.getElementById('button2');
   ok(!ctx.drawCustomFocusRing(b1), "button 1 is focused");
   ok(!ctx.drawCustomFocusRing(b2), "button 2 is focused");
   b1.focus();
   ok(ctx.drawCustomFocusRing(b1), "button 1 should not be focused");
}
</script>

<p>Canvas test: drawFocusIfNeeded</p>
<canvas id="c689" class="output" width="50" height="25">
    <input id="button3" type="range" min="1" max="12"></input>
    <input id="button4" type="range" min="1" max="12"></input>
</canvas>
<script type="text/javascript">
function isEmptyCanvas(ctx, w, h) {
  var imgdata = ctx.getImageData(0, 0, w, h);
  for(var x = 0; x < w*h*4; x++)
    if(imgdata.data[x] != 0)
      return false;
  return true;
}

function test_drawFocusIfNeeded_canvas() {
  var c = document.getElementById("c689");
  var ctx = c.getContext("2d");
  var b1 = document.getElementById('button3');
  var b2 = document.getElementById('button4');
  ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
  ctx.beginPath();
  ctx.rect(10, 10, 30, 30);
  ctx.drawFocusIfNeeded(b1);
  ok(isEmptyCanvas(ctx, ctx.canvas.width, ctx.canvas.height), "focus of button 1 is drawn");

  ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
  ctx.beginPath();
  ctx.rect(50, 10, 30, 30);
  ctx.drawFocusIfNeeded(b2);
  ctx.rect(50, 10, 30, 30);
  ctx.drawFocusIfNeeded(b2);
  ok(isEmptyCanvas(ctx, ctx.canvas.width, ctx.canvas.height), "focus of button 2 is drawn");

  b1.focus();
  ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
  ctx.beginPath();
  ctx.rect(10, 10, 30, 30);
  ctx.drawFocusIfNeeded(b1);
  ok(!isEmptyCanvas(ctx, ctx.canvas.width, ctx.canvas.height) , "focus of button 1 is not drawn");
}
</script>


<script>

function runTests() {
 try {
  test_drawCustomFocusRing_canvas();
 } catch(e) {
  throw e;
  ok(false, "unexpected exception thrown in: test_drawCustomFocusRing_canvas");
 }
  try {
  test_drawFocusIfNeeded_canvas();
 } catch(e) {
  throw e;
  ok(false, "unexpected exception thrown in: test_drawFocusIfNeeded_canvas");
 }

 SpecialPowers.setBoolPref("canvas.focusring.enabled", false);
 SpecialPowers.setBoolPref("canvas.customfocusring.enabled", false);
 SimpleTest.finish();
}

addLoadEvent(runTests);

</script>