draw-focus-if-needed.html | Explore in Territory

<!DOCTYPE HTML>
<head>
<title>Canvas test: drawSystemFocusRing</title>
<script src="../resources/testharness.js"></script>
<script src="../resources/testharnessreport.js"></script>
</head>
<body style="padding: 0; margin: 0">
<canvas id="canvas" class="output" width="300" height="350">
    <button id="button1"></button>
    <div id="container">
      <button id="button2"></button>
    </div>
</canvas>
<div id="console"></div>
<script>
test((t) => {
    axButton1 = accessibilityController.accessibleElementById("button1");
    axContainer = accessibilityController.accessibleElementById("container");
    axButton2 = accessibilityController.accessibleElementById("button2");

    var canvas = document.getElementById("canvas").getContext("2d");
    canvas.save();
    canvas.translate(50, 50);

    canvas.beginPath();
    canvas.rect(0, 0, 200, 100);
    canvas.fillStyle = '#ccf';
    canvas.fill();
    canvas.drawFocusIfNeeded(document.getElementById('button1'));

    canvas.beginPath();
    canvas.rect(0, 150, 200, 100);
    canvas.fillStyle = '#cfc';
    canvas.fill();
    canvas.drawFocusIfNeeded(document.getElementById('button2'));

    canvas.restore();

    assert_equals(axButton1.x, 50);
    assert_equals(axButton1.y, 50);
    assert_equals(axButton1.width, 200);
    assert_equals(axButton1.height, 100);

    assert_equals(axContainer.x, 50);
    assert_equals(axContainer.y, 200);
    assert_equals(axContainer.width, 200);
    assert_equals(axContainer.height, 100);

    assert_equals(axButton2.x, 50);
    assert_equals(axButton2.y, 200);
    assert_equals(axButton2.width, 200);
    assert_equals(axButton2.height, 100);
}, "Tests drawSystemFocusRing sets bounds for AXObject");
</script>
</body>
chromium/third_party/blink/web_tests/accessibility/draw-focus-if-needed.html
