test_focus_radio.xhtml

Enable keyboard shortcuts

<?xml version="1.0"?>

<?xml-stylesheet href="chrome://global/skin" type="text/css"?>

<?xml-stylesheet href="chrome://mochikit/content/tests/SimpleTest/test.css"

                 type="text/css"?>

<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"

        title="Tests for Accessible TakeFocus on Radio Elements">

  <script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js" />

  <script src="chrome://mochikit/content/tests/SimpleTest/EventUtils.js"/>

  <script type="application/javascript"

          src="../common.js" />

  <script type="application/javascript"

          src="../role.js" />

  <script type="application/javascript"

          src="../states.js" />

  <script type="application/javascript"

          src="../promisified-events.js" />

  <script type="application/javascript">

  <![CDATA[

    async function doTests() {

      let radio1 = getAccessible("radio1");

      let focused = waitForEvent(EVENT_FOCUS, radio1);

      radio1.takeFocus();

      await focused;

      // radio1 wasn't selected. Ensure that takeFocus didn't change that.

      testStates(radio1, STATE_FOCUSED, 0, STATE_CHECKED);

      // Test focusing another radio in the group while the group is still

      // focused.

      let radio2 = getAccessible("radio2");

      focused = waitForEvent(EVENT_FOCUS, radio2);

      radio2.takeFocus();

      await focused;

      testStates(radio2, STATE_FOCUSED | STATE_CHECKED);

      let groupEl = document.getElementById("radiogroup");

      // Selecting an item also focuses it.

      focused = waitForEvent(EVENT_FOCUS, radio1);

      groupEl.value = "1";

      await focused;

      testStates(radio1, STATE_FOCUSED | STATE_CHECKED);

      // If an item is already selected but not focused, selecting it again

      // focuses it.

      focused = waitForEvent(EVENT_FOCUS, radio2);

      radio2.takeFocus();

      await focused;

      testStates(radio2, STATE_FOCUSED, 0, STATE_CHECKED);

      // radio1 is selected but not focused.

      // Select radio1 again, which should focus it.

      focused = waitForEvent(EVENT_FOCUS, radio1);

      groupEl.value = "1";

      await focused;

      testStates(radio1, STATE_FOCUSED | STATE_CHECKED);

      SimpleTest.finish();

    SimpleTest.waitForExplicitFinish();

    addA11yLoadEvent(doTests);

]]>

  </script>

  <hbox flex="1" style="overflow: auto;">

    <body xmlns="http://www.w3.org/1999/xhtml">

      <p id="display"></p>

      <div id="content" style="display: none"></div>

      <pre id="test">

      </pre>

    </body>

    <vbox flex="1">

      <radiogroup id="radiogroup" value="2">

        <radio id="radio1" value="1"/>

        <radio id="radio2" value="2"/>

      </radiogroup>

      <vbox id="eventdump"/>

    </vbox>

  </hbox>

</window>