wip

Author: ljharb

.eslintrc

@@ -25,7 +25,7 @@
 			"ignoreConstructors": false,
 			"avoidQuotes": false, // this is the override vs airbnb
     }],
-    "max-len": [2, 140, {
+    "max-len": [0, 140, {
       "ignoreStrings": true,
       "ignoreTemplateLiterals": true,
       "ignoreComments": true,

lib/rules/boolean-prop-naming.js

@@ -149,7 +149,7 @@ module.exports = {
     /**
      * Returns the name of the given node (prop)
      * @param {RuleProp} node The node we're getting the name of
-     * @returns {string}
+     * @returns {string | undefined}
      */
     function getPropName(node) {
       // Due to this bug https://github.com/babel/babel-eslint/issues/307
@@ -185,7 +185,7 @@ module.exports = {
     function regularCheck(prop) {
       const propKey = getPropKey(prop);
       return (
-        propKey
+        !!propKey
         && propTypeNames.indexOf(propKey) >= 0
         && rule.test(getPropName(prop)) === false
       );
@@ -265,7 +265,7 @@ module.exports = {
       args.filter((arg) => arg.type === 'ObjectExpression').forEach((object) => validatePropNaming(node, object.properties));
     }
 
-    /** @type {(component: Components.Component) => GenericFlowNode} */
+    /** @type {(component: Components.Component) => (GenericFlowNode | undefined)} */
     function getComponentTypeAnnotation(component) {
       // If this is a functional component that uses a global type, check it
       if (

lib/rules/button-has-type.js

@@ -93,6 +93,7 @@ module.exports = {
       }
     }
 
+    /** @param {ASTNode} node @param {ASTNode} expression */
     function checkExpression(node, expression) {
       switch (expression.type) {
         case 'Literal':
@@ -115,8 +116,9 @@ module.exports = {
     }
 
     return {
+      /** @param {JSXElement} node */
       JSXElement(node) {
-        if (node.openingElement.name.name !== 'button') {
+        if ('name' in node.openingElement.name && node.openingElement.name.name !== 'button') {
           return;
         }
 
@@ -135,6 +137,8 @@ module.exports = {
         const propValue = getLiteralPropValue(typeProp);
         checkValue(node, propValue);
       },
+
+      /** @param {CallExpression} node */
       CallExpression(node) {
         if (!isCreateElement(context, node) || node.arguments.length < 1) {
           return;

lib/rules/checked-requires-onchange-or-readonly.js

@@ -5,23 +5,23 @@
 
 'use strict';
 
-const ASTUtils = require('jsx-ast-utils');
+const { elementType } = require('jsx-ast-utils');
 
 const isCreateElement = require('../util/isCreateElement');
 const report = require('../util/report');
 const docsUrl = require('../util/docsUrl');
 
-const messages = {
+const messages = /** @type {const} */ ({
   missingProperty: '`checked` should be used with either `onChange` or `readOnly`.',
   exclusiveCheckedAttribute: 'Use either `checked` or `defaultChecked`, but not both.',
-};
+});
 
 const targetPropSet = new Set(['checked', 'onChange', 'readOnly', 'defaultChecked']);
 
-const defaultOptions = {
+const defaultOptions = /** @type {const} */ ({
   ignoreMissingProperties: false,
   ignoreExclusiveCheckedAttribute: false,
-};
+});
 
 /**
  * @param {object[]} properties
@@ -63,6 +63,7 @@ module.exports = {
   create(context) {
     const options = { ...defaultOptions, ...context.options[0] };
 
+    /** @param {JSXOpeningElement | CallExpression} node */
     function reportMissingProperty(node) {
       report(
         context,
@@ -72,6 +73,7 @@ module.exports = {
       );
     }
 
+    /** @param {JSXOpeningElement | CallExpression} node */
     function reportExclusiveCheckedAttribute(node) {
       report(
         context,
@@ -82,11 +84,10 @@ module.exports = {
     }
 
     /**
-     * @param {ASTNode} node
+     * @param {JSXOpeningElement | CallExpression} node
      * @param {Set<string>} propSet
-     * @returns {void}
      */
-    const checkAttributesAndReport = (node, propSet) => {
+    function checkAttributesAndReport(node, propSet) {
       if (!propSet.has('checked')) {
         return;
       }
@@ -101,17 +102,19 @@ module.exports = {
       ) {
         reportMissingProperty(node);
       }
-    };
+    }
 
     return {
+      /** @param {JSXOpeningElement} node */
       JSXOpeningElement(node) {
-        if (ASTUtils.elementType(node) !== 'input') {
+        if (elementType(node) !== 'input') {
           return;
         }
 
         const propSet = extractTargetProps(node.attributes, 'name');
         checkAttributesAndReport(node, propSet);
       },
+
       CallExpression(node) {
         if (!isCreateElement(context, node)) {
           return;

lib/rules/forbid-dom-props.js

@@ -12,21 +12,24 @@ const report = require('../util/report');
 // Constants
 // ------------------------------------------------------------------------------
 
+/** @typedef {{ disallowList: null | string[], message: null | string }} ForbidConfig */
+
+/** @type {(string | { propName: string, disallowedFor: string[], message: string })[]} */
 const DEFAULTS = [];
 
 // ------------------------------------------------------------------------------
 // Rule Definition
 // ------------------------------------------------------------------------------
 
 /**
- * @param {Map<string, object>} forbidMap // { disallowList: null | string[], message: null | string }
- * @param {string} prop
+ * @param {Map<string, ForbidConfig>} forbidMap
+ * @param {string | JSXIdentifier} prop
  * @param {string} tagName
  * @returns {boolean}
  */
 function isForbidden(forbidMap, prop, tagName) {
-  const options = forbidMap.get(prop);
-  return options && (
+  const options = typeof prop === 'string' && forbidMap.get(prop);
+  return !!options && (
     typeof tagName === 'undefined'
     || !options.disallowList
     || options.disallowList.indexOf(tagName) !== -1
@@ -86,7 +89,8 @@ module.exports = {
 
   create(context) {
     const configuration = context.options[0] || {};
-    const forbid = new Map((configuration.forbid || DEFAULTS).map((value) => {
+    /** @type {Map<string, ForbidConfig>} */
+    const forbid = new Map(/** @type {typeof DEFAULTS} */ (configuration.forbid || DEFAULTS).map((value) => {
       const propName = typeof value === 'string' ? value : value.propName;
       return [propName, {
         disallowList: typeof value === 'string' ? null : (value.disallowedFor || null),
@@ -95,8 +99,9 @@ module.exports = {
     }));
 
     return {
+      /** @param {JSXAttribute} node */
       JSXAttribute(node) {
-        const tag = node.parent.name.name;
+        const tag = 'name' in node.parent.name && node.parent.name.name;
         if (!(tag && typeof tag === 'string' && tag[0] !== tag[0].toUpperCase())) {
           // This is a Component, not a DOM node, so exit.
           return;
@@ -108,9 +113,9 @@ module.exports = {
           return;
         }
 
-        const customMessage = forbid.get(prop).message;
+        const customMessage = typeof prop === 'string' && forbid.get(prop).message;
 
-        report(context, customMessage || messages.propIsForbidden, !customMessage && 'propIsForbidden', {
+        report(context, customMessage || messages.propIsForbidden, customMessage ? 'propIsForbidden' : '', {
           node,
           data: {
             prop,

lib/rules/forbid-prop-types.js

@@ -71,7 +71,9 @@ module.exports = {
     const configuration = context.options[0] || {};
     const checkContextTypes = configuration.checkContextTypes || false;
     const checkChildContextTypes = configuration.checkChildContextTypes || false;
+    /** @type {string | null} */
     let propTypesPackageName = null;
+    /** @type {string | null} */
     let reactPackageName = null;
     let isForeignPropTypesPackage = false;
 
@@ -223,6 +225,7 @@ module.exports = {
         }
       },
 
+      /** @param {ClassProperty | PropertyDefinition} node */
       'ClassProperty, PropertyDefinition'(node) {
         if (
           !isPropTypesDeclaration(node)

lib/rules/forward-ref-uses-ref.js

@@ -4,10 +4,13 @@
 
 'use strict';
 
-const { isMemberExpression } = require('../util/ast');
-const { isParenthesized } = require('../util/ast');
+const {
+  isMemberExpression,
+  isParenthesized,
+} = require('../util/ast');
 const docsUrl = require('../util/docsUrl');
 const report = require('../util/report');
+const { getText } = require('../util/eslint');
 
 // ------------------------------------------------------------------------------
 // Rule Definition
@@ -18,7 +21,7 @@ const report = require('../util/report');
  * @returns {boolean} If the node represents the identifier `forwardRef`.
  */
 function isForwardRefIdentifier(node) {
-  return node.type === 'Identifier' && node.name === 'forwardRef';
+  return node.type === 'Identifier' && 'name' in node && node.name === 'forwardRef';
 }
 
 /**
@@ -28,6 +31,7 @@ function isForwardRefIdentifier(node) {
 function isForwardRefCall(node) {
   return (
     node.type === 'CallExpression'
+    && 'callee' in node
     && (
       isForwardRefIdentifier(node.callee)
       || (isMemberExpression(node.callee) && isForwardRefIdentifier(node.callee.property))
@@ -57,9 +61,8 @@ module.exports = {
   },
 
   create(context) {
-    const sourceCode = context.getSourceCode();
-
     return {
+      /** @param {FunctionExpression | ArrowFunctionExpression} node */
       'FunctionExpression, ArrowFunctionExpression'(node) {
         if (!isForwardRefCall(node.parent)) {
           return;
@@ -70,7 +73,7 @@ module.exports = {
             node,
             suggest: [
               {
-                messageId: 'addRefParameter',
+                messageId: messages.addRefParameter,
                 fix(fixer) {
                   const param = node.params[0];
                   // If using shorthand arrow function syntax, add parentheses around the new parameter pair
@@ -82,9 +85,9 @@ module.exports = {
                 },
               },
               {
-                messageId: 'removeForwardRef',
+                messageId: messages.removeForwardRef,
                 fix(fixer) {
-                  return fixer.replaceText(node.parent, sourceCode.getText(node));
+                  return fixer.replaceText(node.parent, getText(context, node));
                 },
               },
             ],