<!DOCTYPE html>
<html>
<head>
<script src="../../resources/js-test-pre.js"></script>
</head>
<body>

<a href="#fragment1" id="link1" tabindex="0">link1</a>
<a href="#fragment2" id="link2" tabindex="0">link2</a>

<br><br>

<div id="fragment1" name="fragment1" tabindex="0">fragment1</div>
<div id="fragment2" name="fragment2">fragment2</div>
<div id="fragment3" name="fragment3" tabindex="0">fragment3</div>

<script>

description("This tests that if an in-page link is activated, focus control is transferred to the fragment if possible.");

var link1 = document.getElementById("link1");
link1.focus();
debug("Verify that the focus is on the link.");
shouldBe("document.activeElement", "link1");

link1.click();
debug("Click the link and verify that focus has moved to the fragment.");
shouldBe("document.activeElement", "document.getElementById('fragment1')");

debug("Move focus back to the link and verify.");
link1.focus();
shouldBe("document.activeElement", "link1");

if (window.testRunner) {
  debug("Send an enter key event which should also trigger focus to move to the fragment.");
  eventSender.keyDown("\r");
  shouldBe("document.activeElement", "document.getElementById('fragment1')");

  debug("Verify Tab behaves correctly after following the link.");
  eventSender.keyDown("\t");
  shouldBe("document.activeElement", "document.getElementById('fragment3')");
  eventSender.keyDown("\t", ["shiftKey"]);
  shouldBe("document.activeElement", "document.getElementById('fragment1')");
}

debug("Activate a link that does not have a focusable fragment and verify focus does not move.");
var link2 = document.getElementById("link2");
link2.focus();
shouldBe("document.activeElement", "link2");
link2.click();
shouldBe("document.activeElement", "link2");

var successfullyParsed = true;

</script>
<script src="../../resources/js-test-post.js"></script>
</body>
</html>