fix(autocomplete-valid): incomplete for invalid but safe values

autocomplete="text" incompletes Refs: #4492
dequelabs · Jun 11, 2024 · 1515f72 · 1515f72
1 parent 2481379
commit 1515f72
Show file tree

Hide file tree

Showing 7 changed files with 21 additions and 4 deletions.
diff --git a/lib/checks/forms/autocomplete-valid-evaluate.js b/lib/checks/forms/autocomplete-valid-evaluate.js
@@ -1,6 +1,6 @@
 import { isValidAutocomplete } from '../../commons/text';
 
-function autocompleteValidEvaluate(node, options, virtualNode) {
+function autocompleteValidEvaluate(_node, options, virtualNode) {
   const autocomplete = virtualNode.attr('autocomplete') || '';
   return isValidAutocomplete(autocomplete, options);
 }

diff --git a/lib/checks/forms/autocomplete-valid.json b/lib/checks/forms/autocomplete-valid.json
@@ -5,7 +5,8 @@
     "impact": "serious",
     "messages": {
       "pass": "the autocomplete attribute is correctly formatted",
-      "fail": "the autocomplete attribute is incorrectly formatted"
+      "fail": "the autocomplete attribute is incorrectly formatted",
+      "incomplete": "the autocomplete attribute is incorrect but safe to use"
     }
   },
   "options": {

diff --git a/lib/commons/text/is-valid-autocomplete.js b/lib/commons/text/is-valid-autocomplete.js
@@ -59,7 +59,8 @@ export const autocomplete = {
     'email',
     'impp'
   ],
-  locations: ['billing', 'shipping']
+  locations: ['billing', 'shipping'],
+  invalidButSafe: ['text']
 };
 
 function isValidAutocomplete(
@@ -117,6 +118,11 @@ function isValidAutocomplete(
   }
 
   const purposeTerm = autocompleteTerms[autocompleteTerms.length - 1];
+
+  if (autocomplete.invalidButSafe.includes(purposeTerm)) {
+    return undefined;
+  }
+
   return (
     standaloneTerms.includes(purposeTerm) ||
     qualifiedTerms.includes(purposeTerm)

diff --git a/locales/_template.json b/locales/_template.json
@@ -683,7 +683,8 @@
     },
     "autocomplete-valid": {
       "pass": "the autocomplete attribute is correctly formatted",
-      "fail": "the autocomplete attribute is incorrectly formatted"
+      "fail": "the autocomplete attribute is incorrectly formatted",
+      "incomplete": "the autocomplete attribute is incorrect but safe to use"
     },
     "accesskeys": {
       "pass": "Accesskey attribute value is unique",

diff --git a/test/checks/forms/autocomplete-valid.js b/test/checks/forms/autocomplete-valid.js
@@ -21,6 +21,11 @@ describe('autocomplete-valid', function () {
     assert.isFalse(evaluate.apply(checkContext, params));
   });
 
+  it('returns undefined (incomplete) if autocomplete is not valid but safe', function () {
+    var params = checkSetup('<input autocomplete="text" id="target" />');
+    assert.isUndefined(evaluate.apply(checkContext, params));
+  });
+
   it('uses options to change what is valid autocomplete', function () {
     var options = { stateTerms: ['foo'] };
     var params = checkSetup(

diff --git a/test/integration/rules/autocomplete-valid/autocomplete-valid.html b/test/integration/rules/autocomplete-valid/autocomplete-valid.html
@@ -170,3 +170,6 @@
 <input autocomplete="section-foo email webauthn" id="pass92" />
 <input autocomplete="section-foo work email webauthn" id="pass93" />
 <input autocomplete="section-foo billing work email webauthn" id="pass94" />
+
+<!-- Incomplete, invalid but safe values -->
+<input autocomplete="text" id="incomplete1" />
diff --git a/test/integration/rules/autocomplete-valid/autocomplete-valid.json b/test/integration/rules/autocomplete-valid/autocomplete-valid.json
@@ -2,6 +2,7 @@
   "description": "autocomplete-valid tests",
   "rule": "autocomplete-valid",
   "violations": [["#fail1"], ["#fail2"], ["#fail3"], ["#fail4"], ["#fail5"]],
+  "incomplete": [["#incomplete1"]],
   "passes": [
     ["#pass1"],
     ["#pass2"],