| <!DOCTYPE html> |
| <html> |
| <head> |
| <script src="../../resources/js-test-pre.js"></script> |
| </head> |
| <body> |
| <p id="description"></p> |
| <div id="console"></div> |
| <script> |
| description('Tests for valid autocomplete tokens on input, select, and textarea elements.'); |
| |
| var input = document.createElement('input'); |
| var textarea = document.createElement('textarea'); |
| var select = document.createElement('select'); |
| var button = document.createElement('button'); |
| var keygen = document.createElement('keygen'); |
| var autocompleteableControls = [ input, textarea, select ]; |
| |
| var keywords = [ "name", "honorific-prefix", "given-name", "additional-name", "family-name", "honorific-suffix", "nickname", "organization-title", "username", "new-password", "current-password", "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" ]; |
| |
| var modeTokens = [ "billing", "shipping" ]; |
| |
| debug('Valid keywords:'); |
| keywords.forEach(keyword => { |
| input.autocomplete = keyword; |
| shouldBeEqualToString('input.autocomplete', keyword); |
| if (window.internals) |
| shouldBeEqualToString('window.internals.autofillFieldName(input)', keyword); |
| }); |
| |
| debug(''); |
| debug('Contact scope:'); |
| var contactTokens = [ "tel", "tel-country-code", "tel-national", "tel-area-code", "tel-local", "tel-local-prefix", "tel-local-suffix", "tel-extension", "email", "impp" ]; |
| var contactScopeTokens = [ "home", "work", "mobile", "fax", "pager" ]; |
| contactScopeTokens.forEach(scopeToken => { |
| contactTokens.forEach(contactToken => { |
| input.autocomplete = scopeToken + " " + contactToken; |
| shouldBeEqualToString('input.autocomplete', scopeToken + " " + contactToken); |
| if (window.internals) |
| shouldBeEqualToString('window.internals.autofillFieldName(input)', contactToken); |
| }) |
| }); |
| |
| debug(''); |
| debug('Mode:'); |
| var addressTokens = [ "street-address", "address-line1", "address-line2", "address-line3", "address-level4", "address-level3", "address-level2", "address-level1", "country", "country-name", "postal-code" ]; |
| var modeTokens = [ "shipping", "billing" ]; |
| modeTokens.forEach(modeToken => { |
| addressTokens.forEach(addressToken => { |
| input.autocomplete = modeToken + " " + addressToken; |
| shouldBeEqualToString('input.autocomplete', modeToken + " " + addressToken); |
| if (window.internals) |
| shouldBeEqualToString('window.internals.autofillFieldName(input)', addressToken); |
| }) |
| }); |
| |
| debug(''); |
| debug('Section:'); |
| keywords.forEach(keyword => { |
| var value = "section-parent " + keyword; |
| input.autocomplete = value; |
| shouldBeEqualToString('input.autocomplete', value); |
| if (window.internals) |
| shouldBeEqualToString('window.internals.autofillFieldName(input)', keyword); |
| }); |
| |
| debug(''); |
| debug('Invalid combinations:'); |
| autocompleteableControls.forEach(control => { |
| control.autocomplete = 'invalid'; |
| shouldBeEmptyString('input.autocomplete'); |
| if (window.internals) |
| shouldBeEqualToString('window.internals.autofillFieldName(input)', "on"); |
| }); |
| // Two normal tokens |
| input.autocomplete = "name name"; |
| shouldBeEmptyString('input.autocomplete'); |
| if (window.internals) |
| shouldBeEqualToString('window.internals.autofillFieldName(input)', "on"); |
| |
| input.autocomplete = "name bday"; |
| shouldBeEmptyString('input.autocomplete'); |
| if (window.internals) |
| shouldBeEqualToString('window.internals.autofillFieldName(input)', "on"); |
| |
| // Contact scope token + non-contact token. |
| input.autocomplete = "pager bday"; |
| shouldBeEmptyString('input.autocomplete'); |
| if (window.internals) |
| shouldBeEqualToString('window.internals.autofillFieldName(input)', "on"); |
| |
| // Two contact scope tokens. |
| input.autocomplete = "home work tel"; |
| shouldBeEmptyString('input.autocomplete'); |
| if (window.internals) |
| shouldBeEqualToString('window.internals.autofillFieldName(input)', "on"); |
| |
| // Two mode tokens. |
| input.autocomplete = "shipping billing tel"; |
| shouldBeEmptyString('input.autocomplete'); |
| if (window.internals) |
| shouldBeEqualToString('window.internals.autofillFieldName(input)', "on"); |
| |
| // Two section tokens. |
| input.autocomplete = "section-a section-b tel"; |
| shouldBeEmptyString('input.autocomplete'); |
| if (window.internals) |
| shouldBeEqualToString('window.internals.autofillFieldName(input)', "on"); |
| |
| // Anything + on/off. |
| input.autocomplete = "tel on"; |
| shouldBeEmptyString('input.autocomplete'); |
| if (window.internals) |
| shouldBeEqualToString('window.internals.autofillFieldName(input)', "on"); |
| |
| input.autocomplete = "tel off"; |
| shouldBeEmptyString('input.autocomplete'); |
| if (window.internals) |
| shouldBeEqualToString('window.internals.autofillFieldName(input)', "on"); |
| |
| // Test dynamically changing the form owner's autocomplete attribute |
| // to ensure the field name correctly reflects it. |
| var form = document.createElement("form"); |
| var inputInAutocompleteOffForm = document.createElement("input"); |
| form.appendChild(inputInAutocompleteOffForm); |
| document.body.appendChild(form); |
| form.autocomplete = "off"; |
| inputInAutocompleteOffForm.autocomplete = ""; |
| shouldBeEmptyString('inputInAutocompleteOffForm.autocomplete'); |
| if (window.internals) |
| shouldBeEqualToString('window.internals.autofillFieldName(inputInAutocompleteOffForm)', "off"); |
| |
| form.autocomplete = "on"; |
| shouldBeEmptyString('inputInAutocompleteOffForm.autocomplete'); |
| if (window.internals) |
| shouldBeEqualToString('window.internals.autofillFieldName(inputInAutocompleteOffForm)', "on"); |
| |
| debug(''); |
| debug('Non-autocompleteable controls:'); |
| // Buttons and keygens are not autocompleteable, so their autocomplete attribute is not sanitized. |
| button.autocomplete = 'invalid'; |
| shouldBeEqualToString('button.autocomplete', 'invalid'); |
| keygen.autocomplete = 'invalid'; |
| shouldBeEqualToString('keygen.autocomplete', 'invalid'); |
| </script> |
| <script src="../../resources/js-test-post.js"></script> |
| </body> |
| </html> |
