summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/html/semantics/forms/the-form-element/form-autocomplete.html
blob: fcd93ce2efc3a0ff6b4b4f15284dd0b84d20d974 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
<!DOCTYPE html>
<meta charset=utf-8>
<title>form autocomplete attribute</title>
<link rel="author" title="Denis Ah-Kang" href="mailto:denis@w3.org">
<link rel=help href="https://html.spec.whatwg.org/multipage/#the-form-element">
<link rel=help href="https://html.spec.whatwg.org/multipage/#attr-fe-autocomplete">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<div id="log"></div>
<form name="missing_attribute">
  <input>
  <input autocomplete="on">
  <input autocomplete="off">
  <input autocomplete="foobar">
</form>
<form name="autocomplete_on" autocomplete="on">
  <input>
  <input autocomplete="on">
  <input autocomplete="off">
  <input autocomplete="foobar">
</form>
<form name="autocomplete_off" autocomplete="off">
  <input>
  <input autocomplete="on">
  <input autocomplete="off">
  <input autocomplete="foobar">
</form>
<form name="autocomplete_invalid" autocomplete="foobar">
  <input>
  <input autocomplete="on">
  <input autocomplete="off">
  <input autocomplete="foobar">
</form>
<script>
  function autocompletetest(form, expectedValues, desc) {
    test(function(){
      assert_equals(form.autocomplete, expectedValues[0]);
      assert_equals(form.elements[0].autocomplete, expectedValues[1]);
      assert_equals(form.elements[1].autocomplete, expectedValues[2]);
      assert_equals(form.elements[2].autocomplete, expectedValues[3]);
      assert_equals(form.elements[3].autocomplete, expectedValues[4]);
    }, desc);
  }

  autocompletetest(document.forms.missing_attribute, ["on", "", "on", "off", ""], "form autocomplete attribute missing");
  autocompletetest(document.forms.autocomplete_on, ["on", "", "on", "off", ""], "form autocomplete attribute on");
  autocompletetest(document.forms.autocomplete_off, ["off", "", "on", "off", ""], "form autocomplete attribute off");
  autocompletetest(document.forms.autocomplete_invalid, ["on", "", "on", "off", ""], "form autocomplete attribute invalid");

  var keywords = [ "on", "off", "name", "honorific-prefix", "given-name", "additional-name", "family-name", "honorific-suffix", "nickname", "username", "new-password", "current-password", "one-time-code", "organization-title", "organization", "street-address", "address-line1", "address-line2", "address-line3", "address-level4", "address-level3", "address-level2", "address-level1", "country", "country-name", "postal-code", "cc-name", "cc-given-name", "cc-additional-name", "cc-family-name", "cc-number", "cc-exp", "cc-exp-month", "cc-exp-year", "cc-csc", "cc-type", "transaction-currency", "transaction-amount", "language", "bday", "bday-day", "bday-month", "bday-year", "sex", "url", "photo", "tel", "tel-country-code", "tel-national", "tel-area-code", "tel-local", "tel-local-prefix", "tel-local-suffix", "tel-extension", "email", "impp", "webauthn" ];

  keywords.forEach(function(keyword) {
    test(function(){
      var input = document.createElement("input");
      // Include whitespace to test splitting tokens on whitespace.
      // Convert to uppercase to ensure that the tokens are normalized to lowercase.
      input.setAttribute("autocomplete", " " + keyword.toUpperCase() + "\t");
      assert_equals(input.autocomplete, keyword);
    }, keyword + " is an allowed autocomplete field name");
  });


test(() => {
  const select = document.createElement("select");
  select.setAttribute("autocomplete", "  \n");
  assert_equals(select.autocomplete, "");
}, "Test whitespace-only attribute value");

test(() => {
  const select = document.createElement("select");

  select.setAttribute("autocomplete", "foo off");
  assert_equals(select.autocomplete, "");

  // Normal category; max=3
  select.setAttribute("autocomplete", "foo section-foo billing name");
  assert_equals(select.autocomplete, "");

  // Contact category; max=4
  select.setAttribute("autocomplete", "foo section-bar billing work tel");
  assert_equals(select.autocomplete, "");

  // Credential category; max=5
  select.setAttribute("autocomplete", "foo section-bar billing work tel webauthn");
  assert_equals(select.autocomplete, "");
}, "Test maximum number of tokens");

test(() => {
  const textarea = document.createElement("textarea");

  textarea.setAttribute("autocomplete", "call-sign");
  assert_equals(textarea.autocomplete, "");
}, "Unknown field");

test(() => {
  const hidden = document.createElement("input");
  hidden.type = "hidden";
  hidden.setAttribute("autocomplete", "on");
  assert_equals(hidden.autocomplete, "");
  hidden.setAttribute("autocomplete", "off");
  assert_equals(hidden.autocomplete, "");
}, "Test 'wearing the autofill anchor mantle' with off/on");

test(() => {
  const textarea = document.createElement("textarea");

  textarea.setAttribute("autocomplete", " HOME\ntel");
  assert_equals(textarea.autocomplete, "home tel");

  textarea.setAttribute("autocomplete", "shipping   country");
  assert_equals(textarea.autocomplete, "shipping country");

  textarea.setAttribute("autocomplete", "billing  work  email");
  assert_equals(textarea.autocomplete, "billing work email");

  textarea.setAttribute("autocomplete", "  section-FOO  bday");
  assert_equals(textarea.autocomplete, "section-foo bday");
}, "Serialize combinations of section, mode, contact, and field");

test(() => {
  const textarea = document.createElement("textarea");

  textarea.setAttribute("autocomplete", "\tusername webauthn");
  assert_equals(textarea.autocomplete, "username webauthn");

  textarea.setAttribute("autocomplete", "  section-LOGIN  shipping work tel webauthn ");
  assert_equals(textarea.autocomplete, "section-login shipping work tel webauthn");
}, "Serialize combinations of section, mode, contact, field, and credential");

</script>