<!DOCTYPE html>
<html>
<body>
<p id="description">This test verifies that setting an empty suggested value removes/resets the shadow placeholder value.</p>
<pre><input id="test" type="text" value="initial value"><br>
<input id="inputwithplaceholder" type="text" placeholder="initial placeholder"><br>
<textarea id="textarea">initial value</textarea><br>
<textarea id="textareaWithPlaceholder" placeholder="initial placeholder"></textarea><br>
<select id="select"><option>CA</option><option>TX</option></select></pre>
<script src="../../resources/dump-as-markup.js"></script>
<script>

var input = document.getElementById('test');
var inputWithPlaceholder = document.getElementById('inputwithplaceholder');
var textarea = document.getElementById('textarea');
//textarea.value = "initial value"
var textareaWithPlaceholder = document.getElementById('textareaWithPlaceholder');
var select = document.getElementById('select');
select.selectedIndex = -1;
var result = document.getElementById('result');
if (!window.internals)
    testFailed('This test requires internals object');
else {
    input.focus();
    input.selectionStart = input.selectionEnd = 0;

    function addText(text) {
        input.parentNode.appendChild(document.createTextNode(text));
    }

    function log() {
        function addTextResult(value) { addText(value + ': ' + eval(value)); }
        addTextResult('input.value');
        addTextResult('internals.suggestedValue(input)');
        addTextResult('inputWithPlaceholder.value');
        addTextResult('internals.suggestedValue(inputWithPlaceholder)');
        addTextResult('textarea.value');
        addTextResult('internals.suggestedValue(textarea)');
        addTextResult('textareaWithPlaceholder.value');
        addTextResult('internals.suggestedValue(textareaWithPlaceholder)');
        addTextResult('select.value');
        addTextResult('internals.suggestedValue(select)');
    }

    function getSelectedValues(select) {
        var selectedValues = [];
        for (var i = 0; i < select.options.length; i++) {
            var option = select.options[i];
            if (option.selected)
                selectedValues.push(option.value);
        }
        return selectedValues.join(',');
    }

    Markup.description(document.getElementById('description').textContent)

    log();
    Markup.dump(input.parentNode, 'Input before setting suggested values');

    // Set some suggested value to all the fields.
    internals.setSuggestedValue(input, 'suggested value');
    internals.setSuggestedValue(inputWithPlaceholder, 'suggested value');
    internals.setSuggestedValue(textarea, 'suggested value');
    internals.setSuggestedValue(textareaWithPlaceholder, 'suggested value');
    internals.setSuggestedValue(select, 'TX');
    log();
    Markup.dump(input.parentNode, 'Input after setting suggestedValue');

    // Set an empty suggested value to all the fields.
    internals.setSuggestedValue(input, '');
    internals.setSuggestedValue(inputWithPlaceholder, '');
    internals.setSuggestedValue(textarea, '');
    internals.setSuggestedValue(textareaWithPlaceholder, '');
    internals.setSuggestedValue(select, '');

    log();
    var innerTextValue = internals.shadowRoot(input).lastChild.innerText;
    var innerTextWithPlaceholderValue = internals.shadowRoot(inputWithPlaceholder).lastChild.innerText;
    var innerTextAreaValue = internals.shadowRoot(textarea).lastChild.innerText;
    var innerTextAreaWithPlaceholderValue = internals.shadowRoot(textareaWithPlaceholder).lastChild.innerText;
    var selectedValues = getSelectedValues(select);
    addText(innerTextValue == 'initial value' &&
            innerTextWithPlaceholderValue == '' &&
            innerTextAreaValue == 'initial value' &&
            innerTextAreaWithPlaceholderValue == '' &&
            selectedValues == '' ? 'PASS' : 'FAIL');
    Markup.dump(input.parentNode, 'After resetting suggestedValue value');
}

</script>
</body>
</html>