tomchentw/react-prop-types-element-of-type

View on GitHub
src/index.js

Summary

Maintainability
A
2 hrs
Test Coverage

Function createComponentTypeChecker has 28 lines of code (exceeds 25 allowed). Consider refactoring.
Open

export default function createComponentTypeChecker(expectedComponent) {
  function validate(isRequired, props, propName, componentName, location, propFullName = propName) {
    const locationName = ReactPropTypeLocationNames[location];
    if (props[propName] === null || props[propName] === undefined) {
      if (isRequired) {
Severity: Minor
Found in src/index.js - About 1 hr to fix

    Function createComponentTypeChecker has a Cognitive Complexity of 10 (exceeds 5 allowed). Consider refactoring.
    Open

    export default function createComponentTypeChecker(expectedComponent) {
      function validate(isRequired, props, propName, componentName, location, propFullName = propName) {
        const locationName = ReactPropTypeLocationNames[location];
        if (props[propName] === null || props[propName] === undefined) {
          if (isRequired) {
    Severity: Minor
    Found in src/index.js - About 1 hr to fix

    Cognitive Complexity

    Cognitive Complexity is a measure of how difficult a unit of code is to intuitively understand. Unlike Cyclomatic Complexity, which determines how difficult your code will be to test, Cognitive Complexity tells you how difficult your code will be to read and comprehend.

    A method's cognitive complexity is based on a few simple rules:

    • Code is not considered more complex when it uses shorthand that the language provides for collapsing multiple statements into one
    • Code is considered more complex for each "break in the linear flow of the code"
    • Code is considered more complex when "flow breaking structures are nested"

    Further reading

    Function validate has 6 arguments (exceeds 4 allowed). Consider refactoring.
    Open

      function validate(isRequired, props, propName, componentName, location, propFullName = propName) {
    Severity: Minor
    Found in src/index.js - About 45 mins to fix

      Unexpected mix of '&&' and '||'.
      Open

        return componentClass && componentClass.name || ANONYMOUS;
      Severity: Minor
      Found in src/index.js by eslint

      Disallow mixes of different operators (no-mixed-operators)

      Enclosing complex expressions by parentheses clarifies the developer's intention, which makes the code more readable. This rule warns when different operators are used consecutively without parentheses in an expression.

      var foo = a && b || c || d;    /*BAD: Unexpected mix of '&&' and '||'.*/
      var foo = (a && b) || c || d;  /*GOOD*/
      var foo = a && (b || c || d);  /*GOOD*/

      Rule Details

      This rule checks BinaryExpression and LogicalExpression.

      This rule may conflict with [no-extra-parens](no-extra-parens.md) rule. If you use both this and [no-extra-parens](no-extra-parens.md) rule together, you need to use the nestedBinaryExpressions option of [no-extra-parens](no-extra-parens.md) rule.

      Examples of incorrect code for this rule:

      /*eslint no-mixed-operators: "error"*/
      
      var foo = a && b < 0 || c > 0 || d + 1 === 0;
      var foo = a + b * c;

      Examples of correct code for this rule:

      /*eslint no-mixed-operators: "error"*/
      
      var foo = a || b || c;
      var foo = a && b && c;
      var foo = (a && b < 0) || c > 0 || d + 1 === 0;
      var foo = a && (b < 0 || c > 0 || d + 1 === 0);
      var foo = a + (b * c);
      var foo = (a + b) * c;

      Options

      {
          "no-mixed-operators": [
              "error",
              {
                  "groups": [
                      ["+", "-", "*", "/", "%", "**"],
                      ["&", "|", "^", "~", "<<", ">>", ">>>"],
                      ["==", "!=", "===", "!==", ">", ">=", "<", "<="],
                      ["&&", "||"],
                      ["in", "instanceof"]
                  ],
                  "allowSamePrecedence": true
              }
          ]
      }

      This rule has 2 options.

      • groups (string[][]) - specifies groups to compare operators. When this rule compares two operators, if both operators are included in a same group, this rule checks it. Otherwise, this rule ignores it. This value is a list of groups. The group is a list of binary operators. Default is the groups for each kind of operators.
      • allowSamePrecedence (boolean) - specifies to allow mix of 2 operators if those have the same precedence. Default is true.

      groups

      The following operators can be used in groups option:

      • Arithmetic Operators: "+", "-", "*", "/", "%", "**"
      • Bitwise Operators: "&", "|", "^", "~", "<<", ">>", ">>>"
      • Comparison Operators: "==", "!=", "===", "!==", ">", ">=", "<", "<="
      • Logical Operators: "&&", "||"
      • Relational Operators: "in", "instanceof"

      Now, considers about {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]} configure. This configure has 2 groups: bitwise operators and logical operators. This rule checks only if both operators are included in a same group. So, in this case, this rule comes to check between bitwise operators and between logical operators. This rule ignores other operators.

      Examples of incorrect code for this rule with {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]} option:

      /*eslint no-mixed-operators: ["error", {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}]*/
      
      var foo = a && b < 0 || c > 0 || d + 1 === 0;
      var foo = a & b | c;

      Examples of correct code for this rule with {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]} option:

      /*eslint no-mixed-operators: ["error", {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}]*/
      
      var foo = a || b > 0 || c + 1 === 0;
      var foo = a && b > 0 && c + 1 === 0;
      var foo = (a && b < 0) || c > 0 || d + 1 === 0;
      var foo = a && (b < 0 ||  c > 0 || d + 1 === 0);
      var foo = (a & b) | c;
      var foo = a & (b | c);
      var foo = a + b * c;
      var foo = a + (b * c);
      var foo = (a + b) * c;

      allowSamePrecedence

      Examples of correct code for this rule with {"allowSamePrecedence": true} option:

      /*eslint no-mixed-operators: ["error", {"allowSamePrecedence": true}]*/
      
      // + and - have the same precedence.
      var foo = a + b - c;

      Examples of incorrect code for this rule with {"allowSamePrecedence": false} option:

      /*eslint no-mixed-operators: ["error", {"allowSamePrecedence": false}]*/
      
      // + and - have the same precedence.
      var foo = a + b - c;

      When Not To Use It

      If you don't want to be notified about mixed operators, then it's safe to disable this rule.

      Related Rules

      Unexpected mix of '&&' and '||'.
      Open

        return componentClass && componentClass.name || ANONYMOUS;
      Severity: Minor
      Found in src/index.js by eslint

      Disallow mixes of different operators (no-mixed-operators)

      Enclosing complex expressions by parentheses clarifies the developer's intention, which makes the code more readable. This rule warns when different operators are used consecutively without parentheses in an expression.

      var foo = a && b || c || d;    /*BAD: Unexpected mix of '&&' and '||'.*/
      var foo = (a && b) || c || d;  /*GOOD*/
      var foo = a && (b || c || d);  /*GOOD*/

      Rule Details

      This rule checks BinaryExpression and LogicalExpression.

      This rule may conflict with [no-extra-parens](no-extra-parens.md) rule. If you use both this and [no-extra-parens](no-extra-parens.md) rule together, you need to use the nestedBinaryExpressions option of [no-extra-parens](no-extra-parens.md) rule.

      Examples of incorrect code for this rule:

      /*eslint no-mixed-operators: "error"*/
      
      var foo = a && b < 0 || c > 0 || d + 1 === 0;
      var foo = a + b * c;

      Examples of correct code for this rule:

      /*eslint no-mixed-operators: "error"*/
      
      var foo = a || b || c;
      var foo = a && b && c;
      var foo = (a && b < 0) || c > 0 || d + 1 === 0;
      var foo = a && (b < 0 || c > 0 || d + 1 === 0);
      var foo = a + (b * c);
      var foo = (a + b) * c;

      Options

      {
          "no-mixed-operators": [
              "error",
              {
                  "groups": [
                      ["+", "-", "*", "/", "%", "**"],
                      ["&", "|", "^", "~", "<<", ">>", ">>>"],
                      ["==", "!=", "===", "!==", ">", ">=", "<", "<="],
                      ["&&", "||"],
                      ["in", "instanceof"]
                  ],
                  "allowSamePrecedence": true
              }
          ]
      }

      This rule has 2 options.

      • groups (string[][]) - specifies groups to compare operators. When this rule compares two operators, if both operators are included in a same group, this rule checks it. Otherwise, this rule ignores it. This value is a list of groups. The group is a list of binary operators. Default is the groups for each kind of operators.
      • allowSamePrecedence (boolean) - specifies to allow mix of 2 operators if those have the same precedence. Default is true.

      groups

      The following operators can be used in groups option:

      • Arithmetic Operators: "+", "-", "*", "/", "%", "**"
      • Bitwise Operators: "&", "|", "^", "~", "<<", ">>", ">>>"
      • Comparison Operators: "==", "!=", "===", "!==", ">", ">=", "<", "<="
      • Logical Operators: "&&", "||"
      • Relational Operators: "in", "instanceof"

      Now, considers about {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]} configure. This configure has 2 groups: bitwise operators and logical operators. This rule checks only if both operators are included in a same group. So, in this case, this rule comes to check between bitwise operators and between logical operators. This rule ignores other operators.

      Examples of incorrect code for this rule with {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]} option:

      /*eslint no-mixed-operators: ["error", {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}]*/
      
      var foo = a && b < 0 || c > 0 || d + 1 === 0;
      var foo = a & b | c;

      Examples of correct code for this rule with {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]} option:

      /*eslint no-mixed-operators: ["error", {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}]*/
      
      var foo = a || b > 0 || c + 1 === 0;
      var foo = a && b > 0 && c + 1 === 0;
      var foo = (a && b < 0) || c > 0 || d + 1 === 0;
      var foo = a && (b < 0 ||  c > 0 || d + 1 === 0);
      var foo = (a & b) | c;
      var foo = a & (b | c);
      var foo = a + b * c;
      var foo = a + (b * c);
      var foo = (a + b) * c;

      allowSamePrecedence

      Examples of correct code for this rule with {"allowSamePrecedence": true} option:

      /*eslint no-mixed-operators: ["error", {"allowSamePrecedence": true}]*/
      
      // + and - have the same precedence.
      var foo = a + b - c;

      Examples of incorrect code for this rule with {"allowSamePrecedence": false} option:

      /*eslint no-mixed-operators: ["error", {"allowSamePrecedence": false}]*/
      
      // + and - have the same precedence.
      var foo = a + b - c;

      When Not To Use It

      If you don't want to be notified about mixed operators, then it's safe to disable this rule.

      Related Rules

      Do not access Object.prototype method 'isPrototypeOf' from target object.
      Open

        if (expectedComponent.prototype.isPrototypeOf(actualComponent.prototype)) {
      Severity: Minor
      Found in src/index.js by eslint

      Disallow use of Object.prototypes builtins directly (no-prototype-builtins)

      In ECMAScript 5.1, Object.create was added, which enables the creation of objects with a specified [[Prototype]]. Object.create(null) is a common pattern used to create objects that will be used as a Map. This can lead to errors when it is assumed that objects will have properties from Object.prototype. This rule prevents calling Object.prototype methods directly from an object.

      Rule Details

      This rule disallows calling some Object.prototype methods directly on object instances.

      Examples of incorrect code for this rule:

      /*eslint no-prototype-builtins: "error"*/
      
      var hasBarProperty = foo.hasOwnProperty("bar");
      
      var isPrototypeOfBar = foo.isPrototypeOf(bar);
      
      var barIsEnumerable = foo.propertyIsEnumerable("bar");

      Examples of correct code for this rule:

      /*eslint no-prototype-builtins: "error"*/
      
      var hasBarProperty = Object.prototype.hasOwnProperty.call(foo, "bar");
      
      var isPrototypeOfBar = Object.prototype.isPrototypeOf.call(foo, bar);
      
      var barIsEnumerable = {}.propertyIsEnumerable.call(foo, "bar");

      When Not To Use It

      You may want to turn this rule off if you will never use an object that shadows an Object.prototype method or which does not inherit from Object.prototype. Source: http://eslint.org/docs/rules/

      Use default import syntax to import 'ReactPropTypeLocationNames'.
      Open

        default as ReactPropTypeLocationNames,
      Severity: Minor
      Found in src/index.js by eslint

      For more information visit Source: http://eslint.org/docs/rules/

      Use default import syntax to import 'ReactElement'.
      Open

        default as ReactElement,
      Severity: Minor
      Found in src/index.js by eslint

      For more information visit Source: http://eslint.org/docs/rules/

      There are no issues that match your filters.

      Category
      Status