fix(label-content-name-mismatch): better dismiss and wysiwyg symbolic text characters

lib/commons/text/is-human-interpretable.js

@@ -13,28 +13,37 @@ import sanitize from './sanitize';
 function isHumanInterpretable(str) {
   /**
    * Steps:
-   * 1) Check for single character edge cases
+   * 1) Trim string to avoid whitespace
+   * 2) Check for symbolic text character edge cases
    * 		a) handle if character is alphanumeric & within the given icon mapping
-   * 					eg: x (close), i (info)
+   * 					eg: x (dismiss), i (info)
    *
-   * 3) handle unicode from astral  (non bilingual multi plane) unicode, emoji & punctuations
+   * 3) handle unicode from astral (non bilingual multi plane) unicode, emoji & punctuations
    * 					eg: Windings font
    * 					eg: '💪'
    * 					eg: I saw a shooting 💫
    * 					eg: ? (help), > (next arrow), < (back arrow), need help ?
    */
 
+  str = str.trim();
+
   if (!str.length) {
     return 0;
   }
 
   // Step 1
-  const alphaNumericIconMap = [
-    'x', // close
-    'i' // info
-  ];
+  const symbolicTextCharactersSet = new Set([
+    // dismiss
+    'x',
+    '×',
+    // wysiwyg
+    'i', // or, info
+    'b',
+    'aa', // toggle capitalization (aA)
+    'abc' // spelling
+  ]);
   // Step 1a
-  if (alphaNumericIconMap.includes(str)) {
+  if (symbolicTextCharactersSet.has(str)) {
     return 0;
   }
 

package.json

@@ -32,6 +32,11 @@
       "name": "Marcy Sutton",
       "organization": "Deque Systems, Inc.",
       "url": "http://deque.com/"
+    },
+    {
+      "name": "Ava Gaiety Wroten",
+      "organization": "Deque Systems, Inc.",
+      "url": "http://deque.com/"
     }
   ],
   "homepage": "https://www.deque.com/axe/",

test/integration/rules/label-content-name-mismatch/label-content-name-mismatch.html

@@ -35,6 +35,11 @@
 <button id="incomplete9" aria-label="help">?</button>
 <button id="incomplete10" aria-label="&#x1F354;">&#x1F354;</button>
 <button id="incomplete11" aria-label="close">&#10060;</button>
+<button id="incomplete12" aria-label="close">×</button>
+<button id="incomplete13" aria-label="close">i</button>
+<button id="incomplete14" aria-label="close">B</button>
+<button id="incomplete15" aria-label="close">ABC</button>
+<button id="incomplete16" aria-label="close">aA</button>
 
 <!-- inapplicable -->
 <a id="inapplicable1" aria-label="OK">Next</a>

test/integration/rules/label-content-name-mismatch/label-content-name-mismatch.json

@@ -22,6 +22,11 @@
     ["#incomplete8"],
     ["#incomplete9"],
     ["#incomplete10"],
-    ["#incomplete11"]
+    ["#incomplete11"],
+    ["#incomplete12"],
+    ["#incomplete13"],
+    ["#incomplete14"],
+    ["#incomplete15"],
+    ["#incomplete16"]
   ]
 }