<!DOCTYPE html>
<html>
<head>
<title>This test ensures all elements are highlighted in a multielement <a> when the text is clicked</title>
<script src="resources/link-highlight-helper.js"></script>
<link rel="stylesheet" type="text/css" href="resources/link-highlight-style.css">
</head>
<body onload="runTest();">
<div style="will-change: transform; padding: 20px;">
<a id="targetLink">
<font id="beforeTarget">Before Text</font><img id="imgTarget" width="320" height="240" src="resources/dice.png"><font id="afterTarget">After Text!</font>
</a>
</div>
<script>
function runTest() {
createHighlight(imgTarget);
// The united rect of beforeTarget and afterTarget also covers the descent
// part of the image.
var rect = beforeTarget.getBoundingClientRect();
rect.width = afterTarget.getBoundingClientRect().right - rect.left;
createHighlightRect(rect);
}
</script>
</script>
</body>
</html>