<!DOCTYPE html>
<body>
<script src="../../../resources/js-test.js"></script>
<div id="container">
<input type="date">
<input type="date" style="visibility: hidden;">
<input type="date" style="display: none;">
<input type="date" value="parsing"><!-- This should show one warning. -->
</div>
<script>
var visibleInput = document.querySelectorAll('input')[0];
var invisibleInput2 = document.querySelectorAll('input')[1];
var invisibleInput3 = document.querySelectorAll('input')[2];
// Force layout.  The warning message behavior depends on computed style.
visibleInput.offsetWidth;

debug('Invisible INPUT element should not show a format warning.');
invisibleInput2.value = ':)';
invisibleInput3.value = ':)';
debug('');

debug('Visible INPUT element should show a format warning. We\'ll see three warnings.');
visibleInput.setAttribute('value', 'Invalid attribute value'); // This shows a warning.
visibleInput.type = 'text';
visibleInput.type = 'date'; // This shows a warning again.

visibleInput.offsetWidth;
visibleInput.value = 'Invalid IDL value'; // This shows a warning.
visibleInput.type = 'text';
visibleInput.type = 'date'; // This doesn't show a warning.

document.querySelector('#container').remove();
</script>
</body>