<!DOCTYPE HTML>
<html>
<head>
<script src="../../../resources/js-test.js"></script>
<script src="../resources/common.js"></script>
<script src="../resources/label-test-util.js"></script>
</head>
<body>
<p id="description"></p>
<div id="console"></div>
<script>
description('Test that labels with contenteditable attribute send focus and key events. ');
var parent = document.createElement('div');
parent.innerHTML = '<label id="label1" for="input1">text</label><input id="input1"> <label id="label2" contenteditable for="input2">text</label><input id="input2">';
document.body.appendChild(parent);
var label1 = document.getElementById('label1');
var input1 = document.getElementById('input1');
var label2 = document.getElementById('label2');
var input2 = document.getElementById('input2');
label1.addEventListener('keydown', function () { alert("FAIL: keydown should not be sent if the label does not have contenteditable attribute"); });
label1.addEventListener('keypress', function () { alert("FAIL: keypress should not be sent if the label does not have contenteditable attribute"); });
label1.addEventListener('keyup', function () { alert("FAIL: keyup should not be sent if the label does not have contenteditable attribute"); });
label1.addEventListener('focus', function () { alert("FAIL: focus should not be sent if the label does not have contenteditable attribute"); });
label1.addEventListener('blur', function () { alert("FAIL: blur should not be sent if the label does not have contenteditable attribute"); });
input1.addEventListener('focus', function () { alert("PASS: label passed the focus to the corresponding control"); });
label2.addEventListener('keydown', function () { alert("PASS: keydown should be sent if the label has contenteditable attribute"); });
label2.addEventListener('keypress', function () { alert("PASS: keypress should be sent if the label has contenteditable attribute"); });
label2.addEventListener('keyup', function () { alert("PASS: keyup should be sent if the label has contenteditable attribute"); });
label2.addEventListener('focus', function () { alert("PASS: focus should be sent if the label has contenteditable attribute"); });
label2.addEventListener('blur', function () { alert("PASS: blur should be sent if the label has contenteditable attribute"); });
input2.addEventListener('focus', function () { alert("PASS: label passed the focus to the corresponding control"); });
if (window.eventSender) {
eventSender.dragMode = false;
mouseMoveToLabel("label1");
eventSender.mouseDown();
eventSender.keyDown("A");
eventSender.mouseUp();
mouseMoveToLabel("label2");
eventSender.mouseDown();
eventSender.keyDown("A");
eventSender.mouseUp();
}
</script>
</body>
</html>