<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<html>
<head>
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<style type="text/css">
input {
    background:rgb(255,255,100);
}
input:disabled {
    background:rgb(255,0,0);
}
</style>
</head>
<body>
<p id="description"></p>
<div id="console"></div>
<form>
<fieldset>
<legend><input type="text" id="parserGeneratedInput1"></legend>
<legend><input type="text" id="parserGeneratedInput2"></legend>
<input type="text" id="parserGeneratedInput3">
<input type="text" id="parserGeneratedInput4" disabled>
</fieldset>
<fieldset disabled>
<legend><input type="text" id="parserGeneratedInput5"></legend>
<legend><input type="text" id="parserGeneratedInput6"></legend>
<input type="text" id="parserGeneratedInput7">
<input type="text" id="parserGeneratedInput8" disabled>
</fieldset>
<fieldset disabled>
<input type="text" id="parserGeneratedInput9">
</fieldset>
</form>
<fieldset tabindex=0 disabled id="fieldset-tabindex"></fieldset>
<script>
test(() => {

// Verifying parser generated fieldsets.
var parserGeneratedInput1 = document.getElementById("parserGeneratedInput1");
var parserGeneratedInput2 = document.getElementById("parserGeneratedInput2");
var parserGeneratedInput3 = document.getElementById("parserGeneratedInput3");
var parserGeneratedInput4 = document.getElementById("parserGeneratedInput4");
var parserGeneratedInput5 = document.getElementById("parserGeneratedInput5");
var parserGeneratedInput6 = document.getElementById("parserGeneratedInput6");
var parserGeneratedInput7 = document.getElementById("parserGeneratedInput7");
var parserGeneratedInput8 = document.getElementById("parserGeneratedInput8");
var parserGeneratedInput9 = document.getElementById("parserGeneratedInput9");

parserGeneratedInput1.focus();
document.execCommand('insertText', false, 'L');
parserGeneratedInput2.focus();
document.execCommand('insertText', false, 'M');
parserGeneratedInput3.focus();
document.execCommand('insertText', false, 'N');
parserGeneratedInput4.focus();
document.execCommand('insertText', false, 'O');
parserGeneratedInput5.focus();
document.execCommand('insertText', false, 'P');
parserGeneratedInput6.focus();
document.execCommand('insertText', false, 'Q');
parserGeneratedInput7.focus();
document.execCommand('insertText', false, 'R');
parserGeneratedInput8.focus();
document.execCommand('insertText', false, 'S');
parserGeneratedInput9.focus();
document.execCommand('insertText', false, 'T');

assert_equals(parserGeneratedInput1.value, 'L');
assert_equals(parserGeneratedInput2.value, 'M');
assert_equals(parserGeneratedInput3.value, 'NO');
assert_equals(parserGeneratedInput4.value, '');
assert_equals(parserGeneratedInput5.value, 'PQRST');
assert_equals(parserGeneratedInput6.value, '');
assert_equals(parserGeneratedInput7.value, '');
assert_equals(parserGeneratedInput8.value, '');
assert_equals(parserGeneratedInput9.value, '');


// Testing a single fieldset element.
var fieldSet = document.createElement('fieldset');
document.body.appendChild(fieldSet);
var textInput = document.createElement('input');
textInput.type = "text";
fieldSet.appendChild(textInput);

// Verifying HTMLFormControl can be disabled regardless of enclosing fieldset.
textInput.disabled = true;
assert_true(textInput.disabled);
textInput.focus();
document.execCommand('insertText', false, 'A');
assert_equals(textInput.value, '');
assert_false(fieldSet.disabled);
textInput.disabled = false;

// Fieldset is enabled by default. A user can insertText into the text input field.
textInput.focus();
document.execCommand('insertText', false, 'A');
assert_equals(textInput.value, 'A');

// Disable fieldset.
fieldSet.disabled = true;
assert_true(fieldSet.disabled);

// Once the fieldset is disabled, text cannot be inserted.
textInput.focus();
document.execCommand('insertText', false, 'B');
assert_equals(textInput.value, 'A');

// Check if the style of the text element changed.
assert_equals(getComputedStyle(textInput).backgroundColor, 'rgb(255, 0, 0)');

// Enable fieldset.
fieldSet.disabled = false;
assert_false(fieldSet.disabled);
assert_equals(getComputedStyle(textInput).backgroundColor, 'rgb(255, 255, 100)');

textInput.focus();
document.execCommand('insertText', false, 'B');
assert_equals(textInput.value, 'AB');

// Move the textinput element out of the fieldset.
fieldSet.removeChild(textInput);
document.body.appendChild(textInput);

// Disable the fieldset.
fieldSet.disabled = true;
assert_true(fieldSet.disabled);

// Text can be inserted, because the textinput element is outside of the disabled fieldset.
textInput.focus();
document.execCommand('insertText', false, 'C');
assert_equals(textInput.value, 'ABC');

// Enable the fieldset.
fieldSet.disabled = false;
assert_false(fieldSet.disabled);

// Insert a table into the fieldset.
var table = document.createElement('table');
fieldSet.appendChild(table);
var tr = document.createElement('tr');
table.appendChild(tr);
var td = document.createElement('td');
tr.appendChild(td);

// Move the textinput field into the table.
document.body.removeChild(textInput);
td.appendChild(textInput);

textInput.focus();
document.execCommand('insertText', false, 'D');
assert_equals(textInput.value, 'ABCD');

// Disable the fieldset.
fieldSet.disabled = true;
assert_true(fieldSet.disabled);

// Inserting text should fail.
textInput.focus();
document.execCommand('insertText', false, 'E');
assert_equals(textInput.value, 'ABCD');

// Enable the fieldset.
fieldSet.disabled = false;
assert_false(fieldSet.disabled);

textInput.focus();
document.execCommand('insertText', false, 'E');
assert_equals(textInput.value, 'ABCDE');


// Testing nested fieldset elements.
var outerFieldSet = document.createElement('fieldset');
document.body.appendChild(outerFieldSet);
var innerFieldSet = document.createElement('fieldset');
outerFieldSet.appendChild(innerFieldSet);
var outerTextInput = document.createElement('input');
outerTextInput.type = "text";
outerFieldSet.appendChild(outerTextInput);
var innerTextInput = document.createElement('input');
innerTextInput.type = "text";
innerFieldSet.appendChild(innerTextInput);

// Verifying that subordinates of both fieldsets are enabled.
outerTextInput.focus();
document.execCommand('insertText', false, 'F');
innerTextInput.focus();
document.execCommand('insertText', false, 'F');
assert_equals(outerTextInput.value, 'F');
assert_equals(innerTextInput.value, 'F');

// Disabling the inner fieldset only.
innerFieldSet.disabled = true;
assert_true(innerFieldSet.disabled);
outerTextInput.focus();
document.execCommand('insertText', false, 'G');
innerTextInput.focus();
document.execCommand('insertText', false, 'G');
assert_equals(outerTextInput.value, 'FGG');
assert_equals(innerTextInput.value, 'F');

// Enabling the inner and disabling the outer fieldset.
outerFieldSet.disabled = true;
innerFieldSet.disabled = false;
assert_true(outerFieldSet.disabled);
assert_false(innerFieldSet.disabled);
outerTextInput.focus();
document.execCommand('insertText', false, 'H');
innerTextInput.focus();
document.execCommand('insertText', false, 'H');
assert_equals(outerTextInput.value, 'FGG');
assert_equals(innerTextInput.value, 'F');

// Disabling both fieldset elements.
outerFieldSet.disabled = true;
innerFieldSet.disabled = true;
assert_true(outerFieldSet.disabled);
assert_true(innerFieldSet.disabled);
outerTextInput.focus();
document.execCommand('insertText', false, 'H');
innerTextInput.focus();
document.execCommand('insertText', false, 'H');
assert_equals(outerTextInput.value, 'FGG');
assert_equals(innerTextInput.value, 'F');

// Enabling both fieldset elements.
outerFieldSet.disabled = false;
innerFieldSet.disabled = false;
assert_false(outerFieldSet.disabled);
assert_false(innerFieldSet.disabled);
outerTextInput.focus();
document.execCommand('insertText', false, 'H');
innerTextInput.focus();
document.execCommand('insertText', false, 'H');
assert_equals(outerTextInput.value, 'FGGH');
assert_equals(innerTextInput.value, 'FH');


// Test behavior of the first legend element in a fieldset elements.
var legendFieldSet = document.createElement('fieldset');
document.body.appendChild(legendFieldSet);
var firstLegend = document.createElement('legend');
legendFieldSet.appendChild(firstLegend);
var secondLegend = document.createElement('legend');
legendFieldSet.appendChild(secondLegend);

var firstLegendTextInput = document.createElement('input');
firstLegendTextInput.type = "text";
firstLegend.appendChild(firstLegendTextInput);

var secondLegendTextInput = document.createElement('input');
secondLegendTextInput.type = "text";
secondLegend.appendChild(secondLegendTextInput);

// Children of the first legend element in a fieldset should not get disabled with the fieldset.
legendFieldSet.disabled = true;
assert_true(legendFieldSet.disabled);
firstLegendTextInput.focus();
document.execCommand('insertText', false, 'I');
secondLegendTextInput.focus()
document.execCommand('insertText', false, 'I');
assert_equals(firstLegendTextInput.value, 'II');
assert_equals(secondLegendTextInput.value, '');

// Insert another legend element before the currently first one, and check again.
var insertedLegend = document.createElement('legend');
legendFieldSet.insertBefore(insertedLegend, firstLegend);
var insertedLegendTextInput = document.createElement('input');
insertedLegend.appendChild(insertedLegendTextInput);

insertedLegendTextInput.focus();
document.execCommand('insertText', false, 'J');
firstLegendTextInput.focus();
document.execCommand('insertText', false, 'J');
secondLegendTextInput.focus()
document.execCommand('insertText', false, 'J');
assert_equals(insertedLegendTextInput.value, 'JJJ');
assert_equals(firstLegendTextInput.value, 'II');
assert_equals(secondLegendTextInput.value, '');

// Enable the fieldset again and check for sanity.
legendFieldSet.disabled = false;
assert_false(legendFieldSet.disabled);
insertedLegendTextInput.focus();
document.execCommand('insertText', false, 'K');
firstLegendTextInput.focus();
document.execCommand('insertText', false, 'K');
secondLegendTextInput.focus()
document.execCommand('insertText', false, 'K');
assert_equals(insertedLegendTextInput.value, 'JJJK');
assert_equals(firstLegendTextInput.value, 'IIK');
assert_equals(secondLegendTextInput.value, 'K');

var disabledFieldsetWithTabindex = document.getElementById('fieldset-tabindex');
document.activeElement.blur();
disabledFieldsetWithTabindex.focus();
assert_equals(document.activeElement, disabledFieldsetWithTabindex);

document.body.removeChild(document.getElementsByTagName('form')[0]);
document.body.removeChild(fieldSet);
document.body.removeChild(outerFieldSet);
document.body.removeChild(legendFieldSet);
document.body.removeChild(disabledFieldsetWithTabindex);
var successfullyParsed = true;
}, 'Tests for HTMLFieldSetElement.disabled behavior.');
</script>

</body>
</html>
