| <!DOCTYPE html> |
| <html> |
| <body> |
| <script src="../resources/common.js"></script> |
| <style> |
| input::-webkit-calendar-picker-indicator, |
| input::-webkit-inner-spin-button { |
| opacity: 1; |
| } |
| </style> |
| <dl> |
| <dt>Datalist follows: |
| <dd><input type="number" list="dl1"> |
| <dt>Empty datalist: |
| <dd><input type="number" list="dl-empty"> |
| <dt>Datalist without valid options: |
| <dd><input type="number" list="dl-invalid"> |
| <dt>Empty datalist becomes non-empty: |
| <dd><input type="number" list="dl-empty-valid"> |
| <dt>Datalist becomes empty: |
| <dd><input type="number" list="dl-valid-empty"> |
| <dt>Datalist disappears: |
| <dd><input type="number" list="dl-disappear"> |
| <dt>No datalist with the speicified ID: |
| <dd><input type="number" list="dl-no-id"> |
| <dt>No datalist with the speicified ID, then it appears: |
| <dd><input type="number" list="dl-no-id-then-added"> |
| </dl> |
| |
| <datalist id="dl1"> |
| <option>2</option> |
| </datalist> |
| <datalist id="dl-empty"> |
| </datalist> |
| <datalist id="dl-invalid"> |
| <option>Suggestion</option> |
| </datalist> |
| <datalist id="dl-empty-valid"> |
| </datalist> |
| <datalist id="dl-valid-empty"> |
| <option>3</option> |
| </datalist> |
| <datalist id="dl-disappear"> |
| <option>4</option> |
| </datalist> |
| <datalist id="dl-no-id-then-added-pre"> |
| <option>5</option> |
| </datalist> |
| |
| <script> |
| function change() { |
| $('dl-empty-valid').innerHTML = '<option>6</option>'; |
| $('dl-valid-empty').innerHTML = ''; |
| $('dl-disappear').remove(); |
| $('dl-no-id-then-added-pre').id = 'dl-no-id-then-added'; |
| document.body.offsetLeft; |
| testRunner.notifyDone(); |
| } |
| |
| window.onload = function() { |
| document.body.offsetLeft; |
| setTimeout(change, 0); |
| }; |
| testRunner.waitUntilDone(); |
| </script> |
| </body> |
| </html> |