LayoutTests/fast/html/details-keyboard-show-hide.html

   1 <!DOCTYPE html>
   2 <head>
   3 <script src="../../fast/js/resources/js-test-pre.js"></script>
   4 </head>
   5
   6 <body>
   7 <p id="description"></p>
   8 <div id="console"></div>
   9 <details id="details"><summary id="summary"></summary><input></details>
  10 <script>
  11     function openAttribute(id) {
  12         return document.getElementById(id).open;
  13     }
  14
  15     description("This test verifies that pressing the ENTER or SPACEBAR key when the &lt;summary&gt; has focus will toggle the &lt;details&gt; display. On expanding details.open will be true and vice versa.");
  16
  17     if (window.eventSender) {
  18         var summary = document.getElementById("summary");
  19         summary.focus();
  20
  21         shouldBeFalse('openAttribute("details")');
  22         debug("Toggle &lt;display&gt; using Enter key:");
  23         eventSender.keyDown("\r");
  24         shouldBeTrue('openAttribute("details")');
  25         eventSender.keyDown("\r");
  26         shouldBeFalse('openAttribute("details")');
  27
  28         debug("Toggle &lt;display&gt; using Spacebar key:");
  29         eventSender.keyDown(" ");
  30         shouldBeTrue('openAttribute("details")');
  31         eventSender.keyDown(" ");
  32         shouldBeFalse('openAttribute("details")');
  33     } else {
  34         debug('There are tests using eventSender.');
  35     }
  36 </script>
  37 <script src="../../fast/js/resources/js-test-post.js"></script>
  38 </body>
  39 </html>