test_visibility.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"

        xmlns:html="http://www.w3.org/1999/xhtml"

        title="XUL elements visibility states testing">

  <script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.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="../events.js" />

  <script type="application/javascript">

  <![CDATA[

    async function doTest() {

      testStates("deck_pane2", 0, 0, STATE_INVISIBLE | STATE_OFFSCREEN);

      testStates("tabs_pane1", 0, 0, STATE_INVISIBLE | STATE_OFFSCREEN);

      testStates("tabs_pane2", STATE_OFFSCREEN, 0, STATE_INVISIBLE);

      let menuNode1 = getNode("mi_file1");

      let focused = waitForEvent(EVENT_FOCUS, menuNode1);

      menuNode1.open = true;

      await focused;

      testStates("mi_file1", 0, 0, STATE_INVISIBLE | STATE_OFFSCREEN);

      testStates("mi_file1.1", 0, 0, STATE_INVISIBLE | STATE_OFFSCREEN);

      let menuNode2 = getNode("mi_file1.2");

      focused = waitForEvent(EVENT_FOCUS, menuNode2);

      menuNode2.open = true;

      await focused;

      testStates("mi_file1.2", 0, 0, STATE_INVISIBLE | STATE_OFFSCREEN);

      testStates("mi_file1.2.1", 0, 0, STATE_INVISIBLE | STATE_OFFSCREEN);

      testStates("mi_file1.2.4", STATE_OFFSCREEN, 0, STATE_INVISIBLE);

      focused = waitForEvent(EVENT_FOCUS, document);

      menuNode1.open = false;

      await focused;

      testStates("mi_file1", 0, 0, STATE_INVISIBLE | STATE_OFFSCREEN);

      testStates("mi_file1.1", STATE_INVISIBLE, 0, STATE_OFFSCREEN);

      testStates("mi_file1.2.1", STATE_INVISIBLE, 0, STATE_OFFSCREEN);

      SimpleTest.finish();

    SimpleTest.waitForExplicitFinish();

    addA11yLoadEvent(doTest);

]]>

  </script>

  <html:style>

  <![CDATA[

     /* We want to control the height of the menu and which elements are visible,

        and the Windows menu padding interferes with this. */

     menupopup::part(arrowscrollbox) {

       margin: 0 !important;

       padding-block: 0 !important;

]]>

  </html:style>

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

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

     <a target="_blank"

         href="https://bugzilla.mozilla.org/show_bug.cgi?id=810260"

         title="xul:deck hidden pages shouldn't be offscreen">

        Mozilla Bug 810260

     </a>

     <a target="_blank"

         href="https://bugzilla.mozilla.org/show_bug.cgi?id=865591"

         title="Visible menu item have offscreen state">

        Mozilla Bug 865591

     </a>

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

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

      </div>

      <pre id="test">

      </pre>

    </body>

    <vbox flex="1">

      <deck selectedIndex="1">

        <description value="This is the first page" id="deck_pane1"/>

        <button label="This is the second page" id="deck_pane2"/>

      </deck>

      <tabbox>

        <tabs>

          <tab>tab1</tab>

          <tab>tab2</tab>

        </tabs>

        <tabpanels>

          <description value="This is the first page" id="tabs_pane1"/>

          <button label="This is the second page" id="tabs_pane2"/>

        </tabpanels>

      </tabbox>

      <menubar>

        <menu label="File" id="mi_file1">

          <menupopup nonnative="">

            <menuitem label="SubFile" id="mi_file1.1"/>

            <menu label="SubFile2" id="mi_file1.2">

              <menupopup style="max-height: 3em;" nonnative="">

                <menuitem style="appearance: none; height: 1em" label="SubSubFile" id="mi_file1.2.1"/>

                <menuitem style="appearance: none; height: 1em" label="SubSubFile2" id="mi_file1.2.2"/>

                <menuitem style="appearance: none; height: 1em" label="SubSubFile3" id="mi_file1.2.3"/>

                <menuitem style="appearance: none; height: 1em" label="SubSubFile4" id="mi_file1.2.4"/>

              </menupopup>

            </menu>

          </menupopup>

        </menu>

      </menubar>

    </vbox>

  </hbox>

</window>