<!DOCTYPE html>
<html>
<body>
<script src="../../../resources/js-test.js"></script>
<script>
description('Change multiple fields date input UI layout by value');
var testInput = document.createElement('input');
testInput.type = 'date';
testInput.max = '9999-12-31';
document.body.appendChild(testInput);
var widthOfEmptyValue = testInput.offsetWidth;
testInput.value = '10000-01-01';
var widthOfOverflowValue = testInput.offsetWidth;
shouldBeTrue('widthOfEmptyValue < widthOfOverflowValue');
testInput.value = '2012-10-05';
var widthOfValidValue = testInput.offsetWidth;
shouldBe('widthOfEmptyValue', 'widthOfValidValue');
document.body.removeChild(testInput);
</script>
</body>
</html>