summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas
diff options
context:
space:
mode:
authorMatt A. Tobin <mattatobin@localhost.localdomain>2018-02-02 04:16:08 -0500
committerMatt A. Tobin <mattatobin@localhost.localdomain>2018-02-02 04:16:08 -0500
commit5f8de423f190bbb79a62f804151bc24824fa32d8 (patch)
tree10027f336435511475e392454359edea8e25895d /testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas
parent49ee0794b5d912db1f95dce6eb52d781dc210db5 (diff)
downloadUXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.gz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.lz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.xz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.zip
Add m-esr52 at 52.6.0
Diffstat (limited to 'testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas')
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/.gitkeep0
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/canvas_complexshapes_ispointInpath_001.htm31
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/canvas_focus_drawCustomFocusRing_001.html41
-rw-r--r--testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/canvas_focus_drawFocusIfNeeded_AAPI_001-manual.html50
-rwxr-xr-xtesting/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/drawFocusIfNeeded_001.html66
-rwxr-xr-xtesting/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/drawFocusIfNeeded_002.html68
-rwxr-xr-xtesting/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/drawFocusIfNeeded_003.html69
-rwxr-xr-xtesting/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/drawFocusIfNeeded_004.html88
-rwxr-xr-xtesting/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/drawFocusIfNeeded_005.html88
9 files changed, 501 insertions, 0 deletions
diff --git a/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/.gitkeep b/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/.gitkeep
new file mode 100644
index 000000000..e69de29bb
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/.gitkeep
diff --git a/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/canvas_complexshapes_ispointInpath_001.htm b/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/canvas_complexshapes_ispointInpath_001.htm
new file mode 100644
index 000000000..18c3c9afb
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/canvas_complexshapes_ispointInpath_001.htm
@@ -0,0 +1,31 @@
+<!doctype HTML>
+<html>
+ <head>
+ <title>HTML5 Canvas Test: isPointInPath() unaffected by the current transformation matrix</title>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <link rel="author" title="Microsoft" href="http://www.microsoft.com" />
+ <link rel="help" href="http://www.w3.org/TR/2dcontext/#dom-context-2d-ispointinpath" />
+ <meta name="assert" content="isPointInPath must check the point (x, y) as coordinates unaffected by the current transformation matrix." />
+ <script type="text/javascript">
+ async_test(function(t) {
+ window.addEventListener("load", t.step_func_done(function runTest() {
+ var canvas = document.getElementById("canvas1");
+ var ctx = canvas.getContext("2d");
+
+ // Create a path that is transformed by a translation transformation matrix.
+ ctx.translate(100, 50);
+ ctx.rect(0, 0, 100, 50);
+
+ // Ensure that the coordinates passed to isPointInPath are unaffected by the current transformation matrix.
+ assert_true(ctx.isPointInPath(125, 75), "isPointInPath(125, 75)");
+ assert_false(ctx.isPointInPath(25, 25), "!isPointInPath(25, 25)");
+ }));
+ }, "isPointInPath unaffected by transformation matrix");
+ </script>
+ </head>
+ <body>
+ <p>Description: isPointInPath must check the point (x, y) as coordinates unaffected by the current transformation matrix.</p>
+ <canvas id="canvas1" width="300" height="150">Browser does not support HTML5 Canvas.</canvas>
+ </body>
+</html>
diff --git a/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/canvas_focus_drawCustomFocusRing_001.html b/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/canvas_focus_drawCustomFocusRing_001.html
new file mode 100644
index 000000000..56d5ebb51
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/canvas_focus_drawCustomFocusRing_001.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>canvas drawCustomFocusRing() step1 test</title>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <link rel="author" title="Takeshi Kurosawa" href="mailto:kurosawa-takeshi@mitsue.co.jp">
+ <link rel="help" href="http://www.w3.org/TR/2dcontext/#dom-context-2d-drawcustomfocusring">
+ </head>
+ <body>
+ <h1>Description</h1>
+ <p>This test checks whether drawCustomFocusRing returns false if the element passed as an argument is not focused or is not a descendant of the element with whose context the method is associated.</p>
+ <div id="log"></div>
+ <div>
+ <input type="text" id="text0">
+ <canvas id="canvas"><input type="text" id="text1"></canvas>
+ </div>
+ <script>
+ (function() {
+ test(function() {
+ var canvas = document.getElementById('canvas');
+ var context = canvas.getContext('2d');
+ var text0 = document.getElementById('text0');
+ text0.focus(); // document.activeElement === text0;
+
+ var text1 = document.getElementById('text1');
+ assert_false(context.drawCustomFocusRing(text1));
+ }, 'drawCustomFocusRing must return false for an element that is not focused.');
+
+ test(function() {
+ var canvas = document.getElementById('canvas');
+ var context = canvas.getContext('2d');
+ var text0 = document.getElementById('text0');
+ text0.focus(); // document.activeElement === text0;
+
+ assert_false(context.drawCustomFocusRing(text0));
+ }, 'drawCustomFocusRing must return false for an element that is not a descendant of the canvas element.');
+ })();
+ </script>
+ </body>
+</html>
diff --git a/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/canvas_focus_drawFocusIfNeeded_AAPI_001-manual.html b/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/canvas_focus_drawFocusIfNeeded_AAPI_001-manual.html
new file mode 100644
index 000000000..bf38fa68b
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/canvas_focus_drawFocusIfNeeded_AAPI_001-manual.html
@@ -0,0 +1,50 @@
+<html>
+ <head>
+ <meta charset="UTF-8">
+ <title>drawFocusIfNeeded() - AAPI test</title>
+ <link rel="author" title="Mark Sadecki" href="mark@w3.org">
+ <link rel="help" href="http://www.w3.org/TR/2dcontext/#dom-context-2d-drawFocusIfNeeded">
+
+ </head>
+ <body>
+ <h1>Description</h1>
+ <p>This manual test can be used to verify that drawFocusIfNeeded actually updates the accessible location information (i.e. UIAutomation's CurrentBoundingRectangle) in the Accessibility API. To perform this test, you will need an <a href="http://www.w3.org/WAI/PF/wiki/ARIA_Test_Plan#Test_tools">accessibility API inspector</a>. To perform this test, use the <code>tab</code> key to move from the first focusable element to through to the fourth. This test passes if the first parameter of the bounding rectangle increases by 100 when focus is moved from the gray square to the orange square.</p>
+ <p><a href="http://www.w3.org">First focusable element</a></p>
+ <canvas height=100 width=200 id=canvas>
+ <a href='http://www.w3.org' id='button1'>Second focusable element</a>
+ <a href='http://www.w3.org' id='button2'>Third focusable element</a>
+ </canvas>
+ <p><a href="http://www.w3.org">Fourth focusable element</a></p>
+
+ <script>
+ var button1 = document.getElementById('button1');
+ var button2 = document.getElementById('button2');
+ var canvas = document.getElementById('canvas');
+ var buttons = canvas.getElementsByTagName('a');
+
+ for (var i = 0; i < buttons.length; i++) {
+ buttons[i].addEventListener('focus', drawCanvas, false);
+ buttons[i].addEventListener('blur', drawCanvas, false);
+ }
+
+ function drawRect(context, color, element) {
+ context.beginPath();
+ context.rect(10, 10, 80, 80);
+ context.fillStyle = color;
+ context.fill();
+ context.drawFocusIfNeeded(element);
+ }
+
+ function drawCanvas() {
+ var canvas = document.getElementById('canvas');
+ var context = canvas.getContext('2d');
+ context.clearRect (0, 0, 200, 100);
+
+ drawRect(context, "gray", button1);
+ context.translate(100,0);
+ drawRect(context, "orange", button2);
+ }
+ drawCanvas();
+ </script>
+ </body>
+</html> \ No newline at end of file
diff --git a/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/drawFocusIfNeeded_001.html b/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/drawFocusIfNeeded_001.html
new file mode 100755
index 000000000..6daf32a2a
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/drawFocusIfNeeded_001.html
@@ -0,0 +1,66 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>drawFocusIfNeeded()</title>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <link rel="author" title="W3C">
+ <link rel="help" href="http://www.w3.org/TR/2dcontext/#dom-context-2d-drawFocusIfNeeded">
+ </head>
+ <body>
+ <h1>Description</h1>
+ <p>This test uses drawFocusIfNeeded to draw a focus ring in the canvas, then compare the ImageData before and after the invocation of the method to check that the focus ring was actually drawn.</p>
+ <div>
+ <p>Before:</p>
+ <canvas height=100 width=100 id='original'>
+ </canvas>
+ <p>After:</p>
+ <canvas height=100 width=100 id=canvas>
+ <label><a href='http://www.w3.org' id='element'>Focus</a></label>
+ </canvas>
+ </div>
+ <script>
+ test(function() {
+ var canvas = document.getElementById('canvas');
+ var context = canvas.getContext('2d');
+ var element = document.getElementById('element');
+ element.focus();
+ context.fillStyle = 'white';
+ context.fillRect(0, 0, 100, 100);
+ context.beginPath();
+ context.strokeStyle = 'black';
+ context.rect(10, 10, 80, 80);
+ context.stroke();
+ context.save();
+ var refImage = context.getImageData(0, 0, 100, 100);
+
+ assert_equals(40000, refImage.data.length, "ImageData.data.length is 40000");
+
+ var original = document.getElementById('original');
+ var o_context = original.getContext('2d');
+ o_context.fillStyle = 'white';
+ o_context.fillRect(0, 0, 100, 100);
+ o_context.putImageData(refImage, 0, 0, 0, 0, 100, 100);
+
+ context.rect(5, 5, 90, 90);
+ context.drawFocusIfNeeded(element);
+
+ var ringImage = context.getImageData(0, 0, 100, 100);
+ assert_equals(40000, ringImage.data.length, "ImageData.data.length is 40000");
+
+ // make sure refImage and ringImage are different
+ var length = 40000;
+ var index = length;
+ var identical = true;
+ while (--index > 0) {
+ if (refImage.data[index] != ringImage.data[index]) identical = false;
+ }
+
+ assert_false(identical, "The focus ring must appear in the canvas");
+
+
+ }, 'drawFocusIfNeeded draws a focus ring.');
+ </script>
+ <div id="log"></div>
+ </body>
+</html>
diff --git a/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/drawFocusIfNeeded_002.html b/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/drawFocusIfNeeded_002.html
new file mode 100755
index 000000000..ec0a4ef42
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/drawFocusIfNeeded_002.html
@@ -0,0 +1,68 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>drawFocusIfNeeded()</title>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <link rel="author" title="W3C">
+ <link rel="help" href="http://www.w3.org/TR/2dcontext/#dom-context-2d-drawFocusIfNeeded">
+ </head>
+ <body>
+ <h1>Description</h1>
+ <p>This test uses drawFocusIfNeeded does nothing if the element is not in focus but comparing ImageData from before and after.</p>
+ <div>
+ <p>Before:</p>
+ <canvas height=100 width=100 id='original'>
+ </canvas>
+ <p>After:</p>
+ <canvas height=100 width=100 id=canvas>
+ <label><a href='http://www.w3.org' id='element'>Focus</a></label>
+ </canvas>
+ </div>
+ <script>
+ test(function() {
+ var canvas = document.getElementById('canvas');
+ var context = canvas.getContext('2d');
+ var element = document.getElementById('element');
+ context.fillStyle = 'white';
+ context.fillRect(0, 0, 100, 100);
+ context.beginPath();
+ context.strokeStyle = 'black';
+ context.rect(10, 10, 80, 80);
+ context.stroke();
+ context.save();
+ var refImage = context.getImageData(0, 0, 100, 100);
+
+ assert_equals(40000, refImage.data.length, "ImageData.data.length is 40000");
+
+ var original = document.getElementById('original');
+ var o_context = original.getContext('2d');
+ o_context.fillStyle = 'white';
+ o_context.fillRect(0, 0, 100, 100);
+ o_context.putImageData(refImage, 0, 0, 0, 0, 100, 100);
+
+
+
+ context.strokeStyle = 'blue';
+ context.rect(5, 5, 90, 90);
+ context.drawFocusIfNeeded(element);
+
+ var ringImage = context.getImageData(0, 0, 100, 100);
+ assert_equals(40000, ringImage.data.length, "ImageData.data.length is 40000");
+
+ // make sure refImage and ringImage are different
+ var length = 40000;
+ var index = length;
+ var identical = true;
+ while (--index > 0) {
+ if (refImage.data[index] != ringImage.data[index]) identical = false;
+ }
+
+ assert_true(identical, "No focus ring appears in the canvas");
+
+
+ }, 'drawFocusIfNeeded does not draw a focus ring if the element is not in focus.');
+ </script>
+ <div id="log"></div>
+ </body>
+</html>
diff --git a/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/drawFocusIfNeeded_003.html b/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/drawFocusIfNeeded_003.html
new file mode 100755
index 000000000..b62c0641f
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/drawFocusIfNeeded_003.html
@@ -0,0 +1,69 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>drawFocusIfNeeded()</title>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <link rel="author" title="W3C">
+ <link rel="help" href="http://www.w3.org/TR/2dcontext/#dom-context-2d-drawFocusIfNeeded">
+ </head>
+ <body>
+ <h1>Description</h1>
+ <p>This test uses drawFocusIfNeeded does nothing if the element is not a descendant but comparing ImageData from before and after.</p>
+ <div>
+ <p>Before:</p>
+ <canvas height=100 width=100 id='original'>
+ <label><a href='http://www.w3.org' id='element'>Focus</a></label>
+ </canvas>
+ <p>After:</p>
+ <canvas height=100 width=100 id=canvas>
+ </canvas>
+ </div>
+ <script>
+ test(function() {
+ var canvas = document.getElementById('canvas');
+ var context = canvas.getContext('2d');
+ var element = document.getElementById('element');
+ element.focus();
+ context.fillStyle = 'white';
+ context.fillRect(0, 0, 100, 100);
+ context.beginPath();
+ context.strokeStyle = 'black';
+ context.rect(10, 10, 80, 80);
+ context.stroke();
+ context.save();
+ var refImage = context.getImageData(0, 0, 100, 100);
+
+ assert_equals(40000, refImage.data.length, "ImageData.data.length is 40000");
+
+ var original = document.getElementById('original');
+ var o_context = original.getContext('2d');
+ o_context.fillStyle = 'white';
+ o_context.fillRect(0, 0, 100, 100);
+ o_context.putImageData(refImage, 0, 0, 0, 0, 100, 100);
+
+
+
+ context.strokeStyle = 'blue';
+ context.rect(5, 5, 90, 90);
+ context.drawFocusIfNeeded(element);
+
+ var ringImage = context.getImageData(0, 0, 100, 100);
+ assert_equals(40000, ringImage.data.length, "ImageData.data.length is 40000");
+
+ // make sure refImage and ringImage are different
+ var length = 40000;
+ var index = length;
+ var identical = true;
+ while (--index > 0) {
+ if (refImage.data[index] != ringImage.data[index]) identical = false;
+ }
+
+ assert_true(identical, "No focus ring appears in the canvas");
+
+
+ }, 'drawFocusIfNeeded does not draw a focus ring if the element is not a descendant of the context.');
+ </script>
+ <div id="log"></div>
+ </body>
+</html>
diff --git a/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/drawFocusIfNeeded_004.html b/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/drawFocusIfNeeded_004.html
new file mode 100755
index 000000000..326db0daa
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/drawFocusIfNeeded_004.html
@@ -0,0 +1,88 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>drawFocusIfNeeded()</title>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <link rel="author" title="W3C">
+ <link rel="help" href="http://www.w3.org/TR/2dcontext/#dom-context-2d-drawFocusIfNeeded">
+ </head>
+ <body>
+ <h1>Description</h1>
+ <p>This test uses drawFocusIfNeeded to draw a complex path focus then compare ImageData from before and after.</p>
+ <div>
+ <p>Before:</p>
+ <canvas height=100 width=100 id='original'>
+ </canvas>
+ <p>After:</p>
+ <canvas height=100 width=100 id=canvas>
+ <label><a href='http://www.w3.org' id='element'>Focus</a></label>
+ </canvas>
+ </div>
+ <script>
+ test(function() {
+ var canvas = document.getElementById('canvas');
+ var context = canvas.getContext('2d');
+ var element = document.getElementById('element');
+ element.focus();
+ context.fillStyle = 'white';
+ context.fillRect(0, 0, 100, 100);
+ context.beginPath();
+ context.strokeStyle = 'black';
+
+ context.moveTo(10, 40);
+ context.lineTo(50, 10);
+ context.lineTo(90, 40);
+ context.lineTo(70, 40);
+ context.lineTo(70, 90);
+ context.lineTo(30, 90);
+ context.lineTo(30, 40);
+ context.closePath();
+
+ context.stroke();
+ context.save();
+ var refImage = context.getImageData(0, 0, 100, 100);
+
+ assert_equals(40000, refImage.data.length, "ImageData.data.length is 40000");
+
+ var original = document.getElementById('original');
+ var o_context = original.getContext('2d');
+ o_context.fillStyle = 'white';
+ o_context.fillRect(0, 0, 100, 100);
+ o_context.putImageData(refImage, 0, 0, 0, 0, 100, 100);
+
+
+
+ context.beginPath();
+ context.moveTo(5, 40);
+ context.lineTo(50, 5);
+ context.lineTo(95, 40);
+ context.lineTo(95, 45);
+ context.lineTo(75, 45);
+ context.lineTo(75, 95);
+ context.lineTo(25, 95);
+ context.lineTo(25, 45);
+ context.lineTo(5, 45);
+ context.closePath();
+
+ context.drawFocusIfNeeded(element);
+
+ var ringImage = context.getImageData(0, 0, 100, 100);
+ assert_equals(40000, ringImage.data.length, "ImageData.data.length is 40000");
+
+ // make sure refImage and ringImage are different
+ var length = 40000;
+ var index = length;
+ var identical = true;
+ while (--index > 0) {
+ if (refImage.data[index] != ringImage.data[index]) identical = false;
+ }
+
+ assert_false(identical, "A focus ring appears in the canvas");
+
+
+ }, 'drawFocusIfNeeded does draw a focus ring if the element is in focus.');
+ </script>
+ <div id="log"></div>
+ </body>
+</html>
diff --git a/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/drawFocusIfNeeded_005.html b/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/drawFocusIfNeeded_005.html
new file mode 100755
index 000000000..96a4e3fd5
--- /dev/null
+++ b/testing/web-platform/tests/2dcontext/drawing-paths-to-the-canvas/drawFocusIfNeeded_005.html
@@ -0,0 +1,88 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>drawFocusIfNeeded()</title>
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+ <link rel="author" title="W3C">
+ <link rel="help" href="http://www.w3.org/TR/2dcontext/#dom-context-2d-drawFocusIfNeeded">
+ </head>
+ <body>
+ <h1>Description</h1>
+ <p>This test uses drawFocusIfNeeded to draw a complex path focus then compare ImageData from before and after.</p>
+ <div>
+ <p>Before:</p>
+ <canvas height=100 width=100 id='original'>
+ </canvas>
+ <p>After:</p>
+ <canvas height=100 width=100 id=canvas>
+ <p id='element' tabindex='1'>This is text.</p>
+ </canvas>
+ </div>
+ <script>
+ test(function() {
+ var canvas = document.getElementById('canvas');
+ var context = canvas.getContext('2d');
+ var element = document.getElementById('element');
+ element.focus();
+ context.fillStyle = 'white';
+ context.fillRect(0, 0, 100, 100);
+ context.beginPath();
+ context.strokeStyle = 'black';
+
+ context.moveTo(10, 40);
+ context.lineTo(50, 10);
+ context.lineTo(90, 40);
+ context.lineTo(70, 40);
+ context.lineTo(70, 90);
+ context.lineTo(30, 90);
+ context.lineTo(30, 40);
+ context.closePath();
+
+ context.stroke();
+ context.save();
+ var refImage = context.getImageData(0, 0, 100, 100);
+
+ assert_equals(40000, refImage.data.length, "ImageData.data.length is 40000");
+
+ var original = document.getElementById('original');
+ var o_context = original.getContext('2d');
+ o_context.fillStyle = 'white';
+ o_context.fillRect(0, 0, 100, 100);
+ o_context.putImageData(refImage, 0, 0, 0, 0, 100, 100);
+
+
+
+ context.beginPath();
+ context.moveTo(5, 40);
+ context.lineTo(50, 5);
+ context.lineTo(95, 40);
+ context.lineTo(95, 45);
+ context.lineTo(75, 45);
+ context.lineTo(75, 95);
+ context.lineTo(25, 95);
+ context.lineTo(25, 45);
+ context.lineTo(5, 45);
+ context.closePath();
+
+ context.drawFocusIfNeeded(element);
+
+ var ringImage = context.getImageData(0, 0, 100, 100);
+ assert_equals(40000, ringImage.data.length, "ImageData.data.length is 40000");
+
+ // make sure refImage and ringImage are different
+ var length = 40000;
+ var index = length;
+ var identical = true;
+ while (--index > 0) {
+ if (refImage.data[index] != ringImage.data[index]) identical = false;
+ }
+
+ assert_false(identical, "A focus ring appears in the canvas");
+
+
+ }, 'drawFocusIfNeeded does draw a focus ring if the element is in focus and the user activated a particular focus ring.');
+ </script>
+ <div id="log"></div>
+ </body>
+</html>