third_party/WebKit/LayoutTests/fast/events/tab-focus-link-with-scroll.html

   1 <!DOCTYPE html>
   2 <style>
   3 html, body, .workspace {
   4     height: 100%;
   5 }
   6 </style>
   7 <script src="../../resources/js-test.js"></script>
   8 <div class="workspace">
   9     <p id="description"></p>
  10     <div id="console"></div>
  11     <li><a id="tab1" href="#"><div class="a">Tab1</div></a></li>
  12 </div>
  13 <li><a id="tab2" href="#"><div class="a">Tab2</div></a></li>
  14 <li><a id="tab3" href="#"><div class="a">Tab3</div></a></li>
  15 <li><a id="tab4" href="#"><div class="a">Tab4</div></a></li>
  16 <script>
  17     description("This tests that the scroll should be happened on moving the focus to out of visible area by tabbing.");
  18     testRunner.overridePreference('WebKitTabToLinksPreferenceKey', true);
  19
  20     document.getElementById('tab1').focus();
  21     shouldBe("document.activeElement.id", "'tab1'");
  22
  23     eventSender.keyDown('\t');
  24     shouldBe("document.activeElement.id", "'tab2'");
  25
  26     eventSender.keyDown('\t');
  27     shouldBe("document.activeElement.id", "'tab3'");
  28
  29     eventSender.keyDown('\t');
  30     shouldBe("document.activeElement.id", "'tab4'");
  31
  32     shouldBe("document.body.clientHeight", "document.scrollingElement.scrollHeight - window.scrollY");
  33 </script>