<!DOCTYPE html>
<html lang="en">
<title>HTMLSelectMenuElement Test: form state restore</title>
<link rel="author" title="Ionel Popescu" href="mailto:iopopesc@microsoft.com">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>

<input id="emptyOnFirstVisit">
<form action="support/back.html" id="form0">
<selectmenu id="selectmenu0">
  <option>one</option>
  <option>two</option>
  <option>three</option>
</selectmenu>
</form>

<script>
async_test(t => {
  window.onload = () => t.step_timeout(() => {
    let state = document.getElementById('emptyOnFirstVisit');
    let selectMenu = document.getElementById("selectmenu0");

    if (!state.value) {
      // First visit.
      t.step_timeout(() => {
        state.value = 'visited';
        assert_equals(selectMenu.value, "one");
        selectMenu.value = "two";
        // The form is submitted in a timeout to make sure that a new back/forward list item is created.
        document.getElementById('form0').submit();
      }, 0);
    } else {
      // Went back to this page again, and the form state should be restored.
      assert_equals(selectMenu.value, "two");
      t.done();
    }
  }, 1);
}, "Test restoring state after form submission");
</script>
