chore: enable eslint:no-shadow (#4089)

* chore: enable eslint:no-shadow

* moar

* finalize

* fix

* Apply suggestions from code review

Co-authored-by: Stephen Mathieson <571265+stephenmathieson@users.noreply.github.com>

* Apply suggestions from code review

Co-authored-by: Wilco Fiers <WilcoFiers@users.noreply.github.com>

* 🤖 Automated formatting fixes

---------

Co-authored-by: Stephen Mathieson <571265+stephenmathieson@users.noreply.github.com>
Co-authored-by: Wilco Fiers <WilcoFiers@users.noreply.github.com>
Co-authored-by: straker <straker@users.noreply.github.com>

.eslintrc.js

@@ -52,6 +52,7 @@ module.exports = {
     'dot-notation': 2,
     'no-new-func': 0,
     'no-new-wrappers': 0,
+    'no-shadow': 2,
     'no-restricted-syntax': [
       'error',
       {

build/configure.js

@@ -41,7 +41,7 @@ function buildRules(grunt, options, commons, callback) {
   var axeImpact = Object.freeze(['minor', 'moderate', 'serious', 'critical']); // TODO: require('../axe') does not work if grunt configure is moved after uglify, npm test breaks with undefined. Complicated grunt concurrency issue.
   var locale = getLocale(grunt, options);
   options.getFiles = false;
-  buildManual(grunt, options, commons, function (result) {
+  buildManual(grunt, options, commons, function (build) {
     var metadata = {
       rules: {},
       checks: {}
@@ -96,8 +96,8 @@ function buildRules(grunt, options, commons, callback) {
       .join('\n');
 
     var tags = options.tags ? options.tags.split(/\s*,\s*/) : [];
-    var rules = result.rules;
-    var checks = result.checks;
+    var rules = build.rules;
+    var checks = build.checks;
 
     // Translate checks before parsing them so that translations
     // get applied to the metadata object
@@ -113,9 +113,9 @@ function buildRules(grunt, options, commons, callback) {
 
     function parseMetaData(source, propType) {
       var data = source.metadata;
-      var key = source.id || source.type;
-      if (key && locale && locale[propType] && propType !== 'checks') {
-        data = locale[propType][key] || data;
+      var id = source.id || source.type;
+      if (id && locale && locale[propType] && propType !== 'checks') {
+        data = locale[propType][id] || data;
       }
       var result = clone(data) || {};
 
@@ -151,8 +151,8 @@ function buildRules(grunt, options, commons, callback) {
     }
 
     function getIncompleteMsg(summaries) {
-      var summary = summaries.find(function (summary) {
-        return typeof summary.incompleteFallbackMessage === 'string';
+      var summary = summaries.find(function (element) {
+        return typeof element.incompleteFallbackMessage === 'string';
       });
       return summary ? summary.incompleteFallbackMessage : '';
     }
@@ -184,8 +184,8 @@ function buildRules(grunt, options, commons, callback) {
       });
     }
 
-    function findCheck(checks, id) {
-      return checks.filter(function (check) {
+    function findCheck(checkCollection, id) {
+      return checkCollection.filter(function (check) {
         if (check.id === id) {
           return true;
         }
@@ -336,21 +336,21 @@ function buildRules(grunt, options, commons, callback) {
         metadata.rules[rule.id] = parseMetaData(rule, 'rules'); // Translate rules
       }
 
-      var rules;
+      var result;
       if (rule.tags.includes('deprecated')) {
-        rules = descriptions.deprecated.rules;
+        result = descriptions.deprecated.rules;
       } else if (rule.tags.includes('experimental')) {
-        rules = descriptions.experimental.rules;
+        result = descriptions.experimental.rules;
       } else if (rule.tags.find(tag => tag.includes('aaa'))) {
-        rules = descriptions.wcag2aaa.rules;
+        result = descriptions.wcag2aaa.rules;
       } else if (rule.tags.includes('best-practice')) {
-        rules = descriptions.bestPractice.rules;
+        result = descriptions.bestPractice.rules;
       } else if (rule.tags.find(tag => tag.startsWith('wcag2a'))) {
-        rules = descriptions.wcag20.rules;
+        result = descriptions.wcag20.rules;
       } else if (rule.tags.find(tag => tag.startsWith('wcag21a'))) {
-        rules = descriptions.wcag21.rules;
+        result = descriptions.wcag21.rules;
       } else {
-        rules = descriptions.wcag22.rules;
+        result = descriptions.wcag22.rules;
       }
 
       var issueType = [];
@@ -363,7 +363,7 @@ function buildRules(grunt, options, commons, callback) {
 
       var actLinks = createActLinksForRule(rule);
 
-      rules.push([
+      result.push([
         `[${rule.id}](https://dequeuniversity.com/rules/axe/${axeVersion}/${rule.id}?application=RuleDescription)`,
         entities.encode(rule.metadata.description),
         impact,
@@ -408,8 +408,8 @@ ${TOC}
 ${ruleTables}`;
 
     // Translate failureSummaries
-    metadata.failureSummaries = createFailureSummaryObject(result.misc);
-    metadata.incompleteFallbackMessage = getIncompleteMsg(result.misc);
+    metadata.failureSummaries = createFailureSummaryObject(build.misc);
+    metadata.incompleteFallbackMessage = getIncompleteMsg(build.misc);
 
     callback({
       auto: replaceFunctions(

build/tasks/add-locale.js

@@ -45,7 +45,7 @@ module.exports = function (grunt) {
         var commons = file.src[0];
 
         buildManual(grunt, options, commons, function (result) {
-          var out = {
+          var locale = {
             lang: options.lang,
             rules: result.rules.reduce(function (out, rule) {
               out[rule.id] = rule.metadata;
@@ -74,10 +74,10 @@ module.exports = function (grunt) {
             var oldMessages = grunt.file.readJSON(localeFile);
 
             // mergeMessages mutates out
-            mergeMessages(out, oldMessages);
+            mergeMessages(locale, oldMessages);
           }
 
-          grunt.file.write(file.dest, JSON.stringify(out, null, '  '));
+          grunt.file.write(file.dest, JSON.stringify(locale, null, '  '));
           console.log('created file at', file.dest);
         });
       });

doc/examples/chrome-debugging-protocol/axe-cdp.js

@@ -39,7 +39,7 @@ const example = async url => {
           // its value (`results.result.value` is undefined). By
           // `JSON.stringify()`ing it, we can `JSON.parse()` it later on
           // and return a valid results set.
-          .then(results => JSON.stringify(results))
+          .then(res => JSON.stringify(res))
           .then(resolve)
           .catch(reject);
       });

doc/examples/puppeteer/axe-puppeteer.js

@@ -9,11 +9,11 @@ const isValidURL = input => {
   return u.protocol && u.host;
 };
 
-// node axe-puppeteer.js <url>
-const url = process.argv[2];
-assert(isValidURL(url), 'Invalid URL');
+(async () => {
+  // node axe-puppeteer.js <url>
+  const url = process.argv[2];
+  assert(isValidURL(url), 'Invalid URL');
 
-const main = async url => {
   let browser;
   let results;
   try {
@@ -34,6 +34,8 @@ const main = async url => {
 
     // Get the results from `axe.run()`.
     results = await handle.jsonValue();
+    console.log(results);
+
     // Destroy the handle & return axe results.
     await handle.dispose();
   } catch (err) {
@@ -42,19 +44,9 @@ const main = async url => {
       await browser.close();
     }
 
-    // Re-throw
-    throw err;
+    console.error('Error running axe-core:', err.message);
+    process.exit(1);
   }
 
   await browser.close();
-  return results;
-};
-
-main(url)
-  .then(results => {
-    console.log(results);
-  })
-  .catch(err => {
-    console.error('Error running axe-core:', err.message);
-    process.exit(1);
-  });
+})();

lib/checks/aria/aria-errormessage-evaluate.js

@@ -24,10 +24,10 @@ import { isVisibleToScreenReaders } from '../../commons/dom';
  * @memberof checks
  * @return {Mixed} True if aria-errormessage references an existing element that uses a supported technique. Undefined if it does not reference an existing element. False otherwise.
  */
-function ariaErrormessageEvaluate(node, options, virtualNode) {
+export default function ariaErrormessageEvaluate(node, options, virtualNode) {
   options = Array.isArray(options) ? options : [];
 
-  const attr = virtualNode.attr('aria-errormessage');
+  const errorMessageAttr = virtualNode.attr('aria-errormessage');
   const hasAttr = virtualNode.hasAttr('aria-errormessage');
   const invaid = virtualNode.attr('aria-invalid');
   const hasInvallid = virtualNode.hasAttr('aria-invalid');
@@ -74,12 +74,10 @@ function ariaErrormessageEvaluate(node, options, virtualNode) {
   }
 
   // limit results to elements that actually have this attribute
-  if (options.indexOf(attr) === -1 && hasAttr) {
-    this.data(tokenList(attr));
-    return validateAttrValue.call(this, attr);
+  if (options.indexOf(errorMessageAttr) === -1 && hasAttr) {
+    this.data(tokenList(errorMessageAttr));
+    return validateAttrValue.call(this, errorMessageAttr);
   }
 
   return true;
 }
-
-export default ariaErrormessageEvaluate;

lib/checks/aria/aria-required-children-evaluate.js

@@ -28,8 +28,8 @@ export default function ariaRequiredChildrenEvaluate(
 ) {
   const reviewEmpty =
     options && Array.isArray(options.reviewEmpty) ? options.reviewEmpty : [];
-  const role = getExplicitRole(virtualNode, { dpub: true });
-  const required = requiredOwned(role);
+  const explicitRole = getExplicitRole(virtualNode, { dpub: true });
+  const required = requiredOwned(explicitRole);
   if (required === null) {
     return true;
   }
@@ -51,20 +51,15 @@ export default function ariaRequiredChildrenEvaluate(
     return false;
   }
 
-  const missing = missingRequiredChildren(
-    virtualNode,
-    role,
-    required,
-    ownedRoles
-  );
+  const missing = missingRequiredChildren(virtualNode, required, ownedRoles);
   if (!missing) {
     return true;
   }
 
   this.data(missing);
 
   // Only review empty nodes when a node is both empty and does not have an aria-owns relationship
-  if (reviewEmpty.includes(role) && !ownedElements.some(isContent)) {
+  if (reviewEmpty.includes(explicitRole) && !ownedElements.some(isContent)) {
     return undefined;
   }
 
@@ -117,7 +112,7 @@ function getOwnedRoles(virtualNode, required) {
 /**
  * Get missing children roles
  */
-function missingRequiredChildren(virtualNode, role, required, ownedRoles) {
+function missingRequiredChildren(virtualNode, required, ownedRoles) {
   for (let i = 0; i < ownedRoles.length; i++) {
     const { role } = ownedRoles[i];
 

lib/checks/lists/only-dlitems-evaluate.js

@@ -4,22 +4,22 @@ import { getRole, getExplicitRole } from '../../commons/aria';
 /**
  * @deprecated
  */
-function onlyDlitemsEvaluate(node, options, virtualNode) {
+export default function onlyDlitemsEvaluate(node, options, virtualNode) {
   const ALLOWED_ROLES = ['definition', 'term', 'list'];
   const base = {
     badNodes: [],
     hasNonEmptyTextNode: false
   };
 
-  const content = virtualNode.children.reduce((content, child) => {
+  const content = virtualNode.children.reduce((vNodes, child) => {
     const { actualNode } = child;
     if (
       actualNode.nodeName.toUpperCase() === 'DIV' &&
       getRole(actualNode) === null
     ) {
-      return content.concat(child.children);
+      return vNodes.concat(child.children);
     }
-    return content.concat(child);
+    return vNodes.concat(child);
   }, []);
 
   const result = content.reduce((out, childNode) => {
@@ -50,5 +50,3 @@ function onlyDlitemsEvaluate(node, options, virtualNode) {
 
   return !!result.badNodes.length || result.hasNonEmptyTextNode;
 }
-
-export default onlyDlitemsEvaluate;

lib/checks/tables/td-headers-attr-evaluate.js

@@ -1,7 +1,7 @@
 import { tokenList } from '../../core/utils';
 import { isVisibleToScreenReaders } from '../../commons/dom';
 
-function tdHeadersAttrEvaluate(node) {
+export default function tdHeadersAttrEvaluate(node) {
   const cells = [];
   const reviewCells = [];
   const badCells = [];
@@ -14,12 +14,9 @@ function tdHeadersAttrEvaluate(node) {
     }
   }
 
-  const ids = cells.reduce((ids, cell) => {
-    if (cell.getAttribute('id')) {
-      ids.push(cell.getAttribute('id'));
-    }
-    return ids;
-  }, []);
+  const ids = cells
+    .filter(cell => cell.getAttribute('id'))
+    .map(cell => cell.getAttribute('id'));
 
   cells.forEach(cell => {
     let isSelf = false;
@@ -64,5 +61,3 @@ function tdHeadersAttrEvaluate(node) {
 
   return true;
 }
-
-export default tdHeadersAttrEvaluate;

lib/commons/color/stacking-context.js

@@ -60,9 +60,9 @@ import flattenColors from './flatten-colors';
  * @return {Object}
  */
 export function getStackingContext(elm, elmStack) {
-  const vNode = getNodeFromTree(elm);
-  if (vNode._stackingContext) {
-    return vNode._stackingContext;
+  const virtualNode = getNodeFromTree(elm);
+  if (virtualNode._stackingContext) {
+    return virtualNode._stackingContext;
   }
 
   const stackingContext = [];
@@ -108,7 +108,7 @@ export function getStackingContext(elm, elmStack) {
     context.bgColor = bgColor;
   });
 
-  vNode._stackingContext = stackingContext;
+  virtualNode._stackingContext = stackingContext;
   return stackingContext;
 }
 

lib/commons/dom/create-grid.js

@@ -381,7 +381,7 @@ function findScrollRegionParent(vNode, parentVNode) {
   // cache result of parent scroll region so we don't have to look up the entire
   // tree again for a child node
   checkedNodes.forEach(
-    vNode => (vNode._scrollRegionParent = scrollRegionParent)
+    virtualNode => (virtualNode._scrollRegionParent = scrollRegionParent)
   );
   return scrollRegionParent;
 }

lib/commons/matches/condition.js

@@ -10,11 +10,9 @@
  * ```
  *
  * @param {any} argument
- * @param {Function|Null|undefined} condition
+ * @param {Function|Null|undefined} matcher
  * @returns {Boolean}
  */
-function condition(arg, condition) {
-  return !!condition(arg);
+export default function condition(arg, matcher) {
+  return !!matcher(arg);
 }
-
-export default condition;

lib/commons/math/split-rects.js

@@ -10,8 +10,8 @@
 export default function splitRects(outerRect, overlapRects) {
   let uniqueRects = [outerRect];
   for (const overlapRect of overlapRects) {
-    uniqueRects = uniqueRects.reduce((uniqueRects, inputRect) => {
-      return uniqueRects.concat(splitRect(inputRect, overlapRect));
+    uniqueRects = uniqueRects.reduce((rects, inputRect) => {
+      return rects.concat(splitRect(inputRect, overlapRect));
     }, []);
   }
   return uniqueRects;