<!DOCTYPE HTML>
<html>
<script src='test.js'></script>
<script src='focus.js'></script>
<script>
function testInactiveElement() {
var a = document.getElementById('a');
a.value = 'abc';
a.setSelectionRange(0, 2);
assertEquals(0, a.selectionStart);
assertEquals(2, a.selectionEnd);
var c = document.getElementById('c');
c.focus();
assertEquals(c, document.activeElement);
focus(a);
assertEquals(3, a.selectionStart);
assertEquals(3, a.selectionEnd);
}
function testActiveElement() {
var a = document.getElementById('a');
a.focus();
var is_blurred = false;
var onBlur = function() {
is_blurred = true;
}
a.addEventListener('blur', onBlur, false);
try {
focus(a);
assert(!is_blurred);
} catch (error) {
a.removeEventListener('blur', onBlur, false);
throw error;
}
}
function testNonTextInput() {
var a = document.getElementById('a');
a.focus();
assertEquals(a, document.activeElement);
var c = document.getElementById('c');
focus(c);
assertEquals(c, document.activeElement);
}
function testEditableDiv() {
var a = document.getElementById('a');
a.focus();
assertEquals(a, document.activeElement);
var d = document.getElementById('d');
focus(d);
assertEquals(d, document.activeElement);
}
function testNonFocusableChildOfEditableDiv() {
var a = document.getElementById('a');
a.focus();
assertEquals(a, document.activeElement);
try {
focus(document.getElementById('e'));
assert(false);
} catch (error) {
}
}
function testFocusableChildOfEditableDiv() {
var a = document.getElementById('a');
a.focus();
assertEquals(a, document.activeElement);
var f = document.getElementById('f');
focus(f);
assertEquals(f, document.activeElement);
}
function testTransparentElement() {
var a = document.getElementById('a');
a.focus();
assertEquals(a, document.activeElement);
var g = document.getElementById('g');
focus(g);
assertEquals(g, document.activeElement);
}
</script>
<body>
<input type="text" id="a">
<br>
<textarea id="b">
</textarea>
<br>
<input type="button" value="c" id="c">
<br>
<div id="d" contentEditable="true">
</div>
<div contentEditable="true">
<div id="e">editable</div>
</div>
<div contentEditable="true">
<input id="f" type="text">
</div>
<div>
<input id="g" style='opacity: 0' type='text'>
</div>
</body>
</html>