Bug 1552294 [wpt PR 16743] - html: Add a test for form.requestSubmit(…

…), a=testonly Automatic update from web-platform-tests html: Add a test for form.requestSubmit() Specification issue: whatwg/html#4187 Specification PR: whatwg/html#4597 -- wp5At-commits: 1de2d96f75cdc7a920b74a8f406262f16531ef0f wpt-pr: 16743
mozilla · Jun 19, 2019 · 608fb1c · 608fb1c
1 parent 9b7299e
commit 608fb1c
Showing 1 changed file with 176 additions and 0 deletions.
diff --git a/testing/web-platform/tests/html/semantics/forms/the-form-element/form-requestsubmit.html b/testing/web-platform/tests/html/semantics/forms/the-form-element/form-requestsubmit.html
@@ -0,0 +1,176 @@
+<!DOCTYPE html>
+<title>form.requestSubmit() tests</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+
+<iframe name="iframe" src="about:blank"></iframe>
+
+<script>
+test(() => {
+  document.body.insertAdjacentHTML('afterbegin', '<form>' +
+      '<input type="reset">' +
+      '<input type="text">' +
+      '<button type="reset"></button>' +
+      '<button type="button"></button>' +
+      '</form>');
+  let form = document.querySelector('form');
+  assert_throws(new TypeError(), () => {
+    form.requestSubmit(document.body);
+  });
+  for (let control of form.elements) {
+    assert_throws(new TypeError(), () => { form.requestSubmit(control); });
+  }
+}, 'Passing an element which is not a submit button should throw');
+
+test(() => {
+  document.body.insertAdjacentHTML('afterbegin', `<form>
+      <input form="" type="submit">
+      <button form="form2" type="submit"></button>
+      </form>
+      <form id="form2"></form>`);
+  let form = document.querySelector('form');
+  let submitButton = document.createElement('button');
+  submitButton.type = 'submit';
+  assert_throws('NotFoundError', () => {
+    form.requestSubmit(submitButton);
+  });
+
+  let buttons = form.querySelectorAll('input, button');
+  assert_equals(buttons.length, 2);
+  for (let control of buttons) {
+    assert_throws('NotFoundError', () => { form.requestSubmit(control) },
+        control.outerHTML);
+  }
+}, 'Passing a submit button not owned by the context object should throw');
+
+test(() => {
+  document.body.insertAdjacentHTML('afterbegin', `<input type=submit form="form1">
+      <form id="form1" target="_blank">
+      <button type="submit"></button>
+      <button></button>
+      <button type="invalid"></button>
+      <input type="submit">
+      <input type="image">
+      </form>`);
+  let form = document.querySelector('form');
+  let didDispatchSubmit = false;
+  form.addEventListener('submit', event => { event.preventDefault(); didDispatchSubmit = true; });
+
+  assert_equals(form.elements.length, 5);
+  for (let control of form.elements) {
+    didDispatchSubmit = false;
+    form.requestSubmit(control);
+    assert_true(didDispatchSubmit, `${control.outerHTML} should submit the form`);
+  }
+  // <input type=image> is not in form.elements.
+  let control = form.querySelector('[type=image]');
+  didDispatchSubmit = false;
+  form.requestSubmit(control);
+  assert_true(didDispatchSubmit, `${control.outerHTML} should submit the form`);
+}, 'requestSubmit() should accept button[type=submit], input[type=submit], and input[type=image]');
+
+test(() => {
+  document.body.insertAdjacentHTML('afterbegin', '<form><input required></form>');
+  let form = document.querySelector('form');
+  let invalidControl = form.querySelector('input:invalid');
+  let didDispatchInvalid = false;
+  invalidControl.addEventListener('invalid', e => { didDispatchInvalid = true; });
+
+  form.requestSubmit();
+  assert_true(didDispatchInvalid);
+}, 'requestSubmit() should trigger interactive form validation');
+
+test(() => {
+  document.body.insertAdjacentHTML('afterbegin',
+      '<form><input type=submit></form>');
+  let form = document.querySelector('form');
+  let submitButton = form.elements[0];
+  let submitCounter = 0;
+  form.addEventListener('submit', e => {
+    ++submitCounter;
+    form.requestSubmit();
+    e.preventDefault();
+  }, {once: true});
+  form.requestSubmit();
+  assert_equals(submitCounter, 1, 'requestSubmit() + requestSubmit()');
+
+  submitCounter = 0;
+  form.addEventListener('submit', e => {
+    ++submitCounter;
+    submitButton.click();
+    e.preventDefault();
+  }, {once: true});
+  form.requestSubmit();
+  assert_equals(submitCounter, 1, 'requestSubmit() + click()');
+
+  submitCounter = 0;
+  form.addEventListener('submit', e => {
+    ++submitCounter;
+    form.requestSubmit();
+    e.preventDefault();
+  }, {once: true});
+  submitButton.click();
+  assert_equals(submitCounter, 1, 'click() + requestSubmit()');
+}, 'requestSubmit() doesn\'t run form submission reentrantly');
+
+test(() => {
+  document.body.insertAdjacentHTML('afterbegin',
+      '<form><input type=submit><input required></form>');
+  let form = document.querySelector('form');
+  let submitButton = form.elements[0];
+  let invalidControl = form.elements[1];
+  let invalidCounter = 0;
+  invalidControl.addEventListener('invalid', e => {
+    ++invalidCounter;
+    if (invalidCounter < 10)
+      form.requestSubmit();
+  }, {once: true});
+  form.requestSubmit();
+  assert_equals(invalidCounter, 1, 'requestSubmit() + requestSubmit()');
+
+  invalidCounter = 0;
+  invalidControl.addEventListener('invalid', e => {
+    ++invalidCounter;
+    if (invalidCounter < 10)
+      submitButton.click();
+  }, {once: true});
+  form.requestSubmit();
+  assert_equals(invalidCounter, 1, 'requestSubmit() + click()');
+
+  invalidCounter = 0;
+  invalidControl.addEventListener('invalid', e => {
+    ++invalidCounter;
+    if (invalidCounter < 10)
+      form.requestSubmit();
+  }, {once: true});
+  submitButton.click();
+  assert_equals(invalidCounter, 1, 'click() + requestSubmit()');
+}, 'requestSubmit() doesn\'t run interactive validation reentrantly');
+
+test(() => {
+  let form = document.createElement('form');
+  let submitCounter = 0;
+  form.addEventListener('submit', e => { ++submitCounter; e.preventDefault(); });
+  form.requestSubmit();
+  assert_equals(submitCounter, 0);
+}, 'requestSubmit() for a disconnected form should not submit the form');
+
+async_test(t => {
+  window.addEventListener('load', t.step_func(() => {
+    document.body.insertAdjacentHTML('afterbegin', `
+<form action="/common/blank.html">
+<input required>
+<input type=submit formnovalidate formtarget=iframe name=s value=v>
+</form>`);
+    let form = document.body.querySelector('form');
+    let iframe = document.body.querySelector('iframe');
+    assert_true(form.matches(':invalid'), 'The form is invalid.');
+    // The form should be submitted though it is invalid.
+    iframe.addEventListener('load', t.step_func_done(() => {
+      assert_not_equals(iframe.contentWindow.location.search.indexOf('s=v'), -1);
+    }));
+    form.requestSubmit(form.querySelector('[type=submit]'));
+  }));
+}, 'The value of the submitter should be appended, and form* ' +
+    'attributes of the submitter should be handled.');
+</script>