<!DOCTYPE html>
<link rel="help" href="https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#form-submission-algorithm">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="./resources/targetted-form.js"></script>
<body>
<script>
test(() => {
  let form = populateForm('<input name=n10 value=v10>');
  let counter = 0;
  form.addEventListener('formdata', e => {
    ++counter;
    form.submit();
  });
  form.submit();
  assert_equals(counter, 1);
  new FormData(form);
  assert_equals(counter, 2);
}, 'If constructing entry list flag of form is true, then return');

test(() => {
  let form = populateForm('<input><input type=submit>');
  let submitter1 = form.querySelector('input[type=submit]');
  let valid = form.elements[0];
  let counter = 0;
  valid.oninvalid = () => {
    ++counter;
  };
  form.onsubmit = () => {
    valid.required = true;
    submitter1.dispatchEvent(new MouseEvent("click"));
  };
  submitter1.dispatchEvent(new MouseEvent("click"));
  assert_equals(counter, 0);
}, "If firing submission events flag of form is true, then return");

test(() => {
  let form = populateForm('<input required><input type=submit><button type=submit></button>');
  let submitter1 = form.querySelector('input[type=submit]');
  let submitter2 = form.querySelector('button[type=submit]');
  let invalid = form.querySelector('[required]');
  let counter = 0;
  invalid.oninvalid = () => {
    ++counter;
    // Needs to click different one because click() has reentrancy protection.
    submitter2.click();
  };
  submitter1.click();
  assert_equals(counter, 1);
}, "If form's firing submission events is true, then return; 'invalid' event");

promise_test(async () => {
  let form = populateForm('<input type=submit name=n value=i><button type=submit name=n value=b>');
  let submitter1 = form.querySelector('input[type=submit]');
  let submitter2 = form.querySelector('button[type=submit]');
  let iframe = form.previousSibling;
  form.onsubmit = () => {
    // Needs to click different one because click() has reentrancy protection.
    submitter2.click();
  };
  submitter1.click();
  // We actually submit the form in order to check which 'click()' submits it.
  await loadPromise(iframe);
  assert_not_equals(iframe.contentWindow.location.search.indexOf('n=i'), -1);
}, "If form's firing submission events is true, then return; 'submit' event");

promise_test(async () => {
  let form = populateForm('<button type=submit></button><input name=n1 value=submit type=submit>');
  let iframe = form.previousSibling;
  let submitter = form.querySelector('input[type=submit]');
  let event;
  form.addEventListener('submit', e => { event = e; });
  submitter.click();
  await loadPromise(iframe);
  assert_true(event.bubbles);
  assert_true(event.cancelable);
  assert_equals(event.submitter, submitter);
  assert_true(event instanceof SubmitEvent);
}, 'firing an event named submit; clicking a submit button');

promise_test(async () => {
  let form = populateForm('<input type=image name=n1>');
  let iframe = form.previousSibling;
  let submitter = form.querySelector('input[type=image]');
  let event;
  form.addEventListener('submit', e => { event = e; });
  submitter.click();
  await loadPromise(iframe);
  assert_true(event.bubbles);
  assert_true(event.cancelable);
  assert_equals(event.submitter, submitter);
  assert_true(event instanceof SubmitEvent);
}, 'firing an event named submit; clicking an image button');

promise_test(async () => {
  let form = populateForm('');
  let iframe = form.previousSibling;
  let event;
  form.addEventListener('submit', e => { event = e; });
  form.requestSubmit();
  await loadPromise(iframe);
  assert_true(event.bubbles);
  assert_true(event.cancelable);
  assert_equals(event.submitter, null);
  assert_true(event instanceof SubmitEvent);
}, 'firing an event named submit; form.requestSubmit()');

promise_test(async () => {
  let form = populateForm('');
  let iframe = form.previousSibling;
  let event;
  form.addEventListener('submit', e => { event = e; });
  form.requestSubmit(null);
  await loadPromise(iframe);
  assert_true(event.bubbles);
  assert_true(event.cancelable);
  assert_equals(event.submitter, null);
  assert_true(event instanceof SubmitEvent);
}, 'firing an event named submit; form.requestSubmit(null)');

promise_test(async () => {
  let form = populateForm('<input type=submit><button type=submit></button>');
  let iframe = form.previousSibling;
  let submitter = form.querySelector('button');
  let event;
  form.addEventListener('submit', e => { event = e; });
  form.requestSubmit(submitter);
  await loadPromise(iframe);
  assert_true(event.bubbles);
  assert_true(event.cancelable);
  assert_equals(event.submitter, submitter);
  assert_true(event instanceof SubmitEvent);
}, 'firing an event named submit; form.requestSubmit(submitter)');

promise_test(async () => {
  let form = populateForm('<input name=n1 value=v1>');
  form.onformdata = (e) => { e.target.remove(); };
  let wasLoaded = false;
  let iframe = form.previousSibling;
  // Request to load '/common/dummy.xhtml', and immediately submit the form to
  // the same frame. If the form submission is aborted, the first request
  // will be completed.
  iframe.addEventListener("load", () => {
    // This may be complicated by loads of the initial about:blank;
    // we need to ignore them and only look at a load that isn't about:blank.
    if (iframe.contentWindow.location == "about:blank") { return; }
    wasLoaded = true;
  });
  iframe.src = '/common/dummy.xhtml';
  assert_false(wasLoaded, 'Make sure the first loading is ongoing.');
  form.submit();
  await loadPromise(iframe);
  assert_true(iframe.contentWindow.location.search.indexOf('n1=v1') == -1);
}, 'Cannot navigate (after constructing the entry list)');

promise_test(async () => {
  let form = populateForm('<input type=submit>');
  let iframe = form.previousSibling;
  let event;
  form.submit();
  await loadPromise(iframe);
  assert_true(iframe.contentWindow.location.href.includes("?"));
}, 'Submission URL should always have a non-null query part');
</script>
</body>
