Rules

DeepScan provides precise rules for JavaScript code quality.

Rules have been developed by finding best practices from various sources like CWE, FindBugs, PMD, open sources and papers. And DeepScan provides the rules by the following category:

  • Error: Code which might throw an exception at runtime
  • Code Quality: Code which should be more readable, reusable and refactorable

All rules are enabled by default.

Error

The following rules relate to code which might throw an exception at runtime:

ACCESS_THIS_BEFORE_SUPER_CALL

this should be accessed after calling super in constructor of inherited class

ARRAY_INDEX_NEGATIVE

Negative index should not be used on arrays

ARROW_FUNC_RETURN_OBJECT_MISSING

Arrow function should use parentheses to return an object literal

ASSIGN_TO_PROPERTY_OF_PRIMITIVE

Assignment should not be made to property of primitive value

BAD_ASSIGN_IN_CONDITION

An equality operator should be used instead of an assignment operator in a conditional statement

BAD_ASSIGN_TO_CONST

Reassignment should not be made to a variable that is declared using const keyword

BAD_BITWISE_OPERATOR

Bitwise operators should not be used where logical operators are expected

BAD_CHAR_AT_COMPARISON

String.prototype.charAt() result should not be compared with a string of length 2 or more

BAD_CONDITIONAL_OPERATOR

The conditional operator should be used in correct order

BAD_FINALLY_CONTROL_FLOW

finally block should not execute return or throw after try-catch block already executes return or throw

BAD_MIN_MAX_FUNC

Math.min and Math.max functions should be combined in correct order

BAD_NEGATION_OPERATOR

The logical negation operator (!) should be used in correct order

BAD_NUMBER_FUNC

String functions should not be used on number values

BAD_NUMBER_PROPERTY

Non-existent properties of number value should not be accessed

BAD_OPERAND_TYPE

in and instanceof should have a right operand of proper type

BAD_REGEXP

Empty character classes should not be used in regular expressions

BAD_STRING_CASE_COMPARISON

Result of String.prototype.toLowerCase() and String.prototype.toUpperCase() should be compared with a lower and upper case string

BAD_TYPE_COERCION

Suspicious type coercion should be avoided

BAD_TYPEOF_COMPARISON

Result of typeof should be compared with correct value

BAD_USE_STRICT

Strict mode should be declared properly

CALL_NON_CONSTRUCTOR

Non-constructor function should not be called with new operator as a constructor

CALL_NON_FUNC

Non-function object should not be called as a function

COMPARE_INCOMPATIBLE_TYPE_STRICTLY

Strict equality should not be used for two values with different types

COMPARE_NAN

Comparing NaN directly should be avoided

DUPLICATE_CASE

switch statement should not have duplicate case clauses

DUPLICATE_PROPERTY

Property should not be redeclared in object literals or classes

INSUFFICIENT_NULL_CHECK

null or undefined check should be consistent for all accesses of a variable

MISMATCHED_COUNT_OF_ARGS

Built-in API should be called with the correct number of arguments

MISMATCHED_TYPE_OF_ARG

Built-in API should be called with arguments of correct types

MISSING_RETURN_VALUE

Return value of function without any return statement should not be used

MISSING_SUPER_CALL

Constructor of inherited class should call super

MISSING_THROW

throw should be used to actually throw an exception

NO_EFFECT_CALL

Result of built-in API call should not be ignored when it has no side effect

NON_REFERENCE_LHS

Value should not be assigned to LHS which is not a reference

NULL_POINTER

Properties of variables with null or undefined values should not be accessed

NUMBER_ARG_OUT_OF_RANGE

Radix or precision arguments of Number-related functions should not exceed the limit

REACT_API_TYPO

React's APIs should not have typo

REACT_BAD_API_OVERRIDDEN

React component method only supported in createReactClass() API should not be overridden in ES6 class component

REACT_BAD_API_RETURN_VALUE

Return value of a React lifecycle method should be a valid type

REACT_BAD_DANGER_FORMAT

dangerouslySetInnerHTML prop for a React DOM element should be in the form of {__html: ...}

REACT_BAD_DANGER_WITH_CHILDREN

When using dangerouslySetInnerHTML prop for a React DOM element, children should not be specified

REACT_BAD_DOM_ATTRIBUTE_VALUE

React DOM element's attribute should not have a value of the wrong type

REACT_BAD_EVENT_HANDLER

Event handler of a React element should not be a string

REACT_BAD_EVENT_HANDLER_RETURN_FALSE

return false should not be used in a React event handler

REACT_BAD_INITIAL_STATE_TYPE

The initial state of React component should be set to an object or null

REACT_BAD_LENGTH_CHECK

length property itself should not be checked in the code for React child element

REACT_BAD_SPECIAL_PROPS

React special props should not be accessed

REACT_BAD_STYLE_OBJ_PROPERTY

React DOM element's style property name or value should not be wrong

REACT_BAD_STYLE_PROP

style property of a React DOM element should be an object

REACT_BAD_UNKNOWN_PROP

React property name in React DOM element should be pre-defined one

REACT_BAD_UPDATE_STATE

Updating the state inside the specific lifecycle methods of a React component should be avoided

REACT_DIRECT_ASSIGN_TO_STATE

Assignment should not be made to this.state in the React component's specific methods

REACT_EVENT_HANDLER_INVALID_THIS

React event handler should have proper this object binding

REACT_JSX_BAD_COMMENT

The content of a JSX text node should not be in the form of JavaScript comment

REACT_MISMATCHED_TYPE_OF_ARG

React API should be called with arguments of correct types

REACT_MISUSED_API_IN_RENDER

Using specific APIs inside React.render() should be avoided

REACT_MISUSED_CONTROLLED_COMPONENT

Form elements should be either controlled or uncontrolled

REACT_MISUSED_CREATOR_IN_PROP_TYPES

React type checker creator itself should not be used as a prop type

REACT_MISUSED_INNER_HTML

innerHTML prop for a React DOM element should not be used

REACT_STATIC_PROPERTY_IN_INSTANCE

React static property should not be defined as an instance property

REACT_UNINITIALIZED_PROPS

Properties of the uninitialized this.props should not be accessed

REACT_VOID_ELEMENT_WITH_CHILDREN

Void elements should neither have children nor dangerouslySetInnerHTML prop

REDUNDANT_COMPOUND_ASSIGN

A reference is used on both sides of compound assignment operator

REFERENCE_BEFORE_LEXICAL_DECL

Lexical variables (let, const and class) must be declared before they are used

STRAY_SEMICOLON

An extraneous semicolon should be avoided to prevent an unintentional logic change

STRICT_MODE_ARGS_CALLER_CALLEE

caller and callee properties should not be accessed on arguments object for strict mode function

STRICT_MODE_ASSIGN_TO_READONLY_VAR

In strict mode, read-only variables cannot be assigned

STRICT_MODE_FUNC_PROPERTY

caller and arguments properties should not be accessed on strict mode function

STRICT_MODE_INVALID_THIS

Strict mode function should not be called with invalid this access

SWITCH_CASE_INCOMPATIBLE_TYPE

switch and its cases should be compared with equal types

SYNTAX_ERROR

JavaScript syntax error

UNINITIALIZED_LOCAL_VAR

Uninitialized local variables should not be accessed

UNREACHABLE_CODE

Unreachable code should not be used

Code Quality

The following rules relate to code which should be more readable, reusable and refactorable:

ARRAY_CALLBACK_RETURN_MISSING

Callback function argument of Array functions should have return statement

ASSIGN_BEFORE_DECL

Variables should be declared before they are assigned

ASSIGN_SAME_VALUE

The same value is assigned to the variable again

BAD_WITH_STATEMENT

with statement should not be used

CONSTANT_CONDITION

Constant expression should not be used in the conditional statements

DUPLICATE_DECL

Functions or variables should not be redeclared

EMPTY_BLOCK

Empty block statements should not be used in conditional statements

FORIN_ARRAY

for-in loop should not be used on arrays

IDENTICAL_BRANCHES

Branches in the conditional statements should not have the same implementation

MISSING_COMMA

Comma (,) should not be missing between function arguments or array elements

REACT_ASYNC_RENDER_RETURN_VALUE

Using the return value of ReactDOM.render() should be avoided

REACT_DEPRECATED_DOM_ELEMENT_PROP

Deprecated prop for a React DOM element should not be used

REACT_MISSING_KEY_PROP

key prop should be defined at each element inside the children of a React element

REACT_MISUSED_UPDATE_IN_SET_STATE

this.state value may not be directly used when updating the state in React component

REACT_INEFFICIENT_PURE_COMPONENT_PROP

React.PureComponent prop should not be specified with a newly created object

REACT_REDUNDANT_SHOULD_COMPONENT_UPDATE

A component extending React.PureComponent should not override shouldComponentUpdate() lifecycle method

REACT_USELESS_PROP_TYPES

Useless PropTypes declaration should be removed

REACT_USELESS_SHOULD_COMPONENT_UPDATE

Overridden shouldComponentUpdate() should not always return a truthy value

SAME_OPERAND_VALUE

Operands always having the same value should be avoided

SWITCH_CASE_FALL_THROUGH

Cases in switch statement should not fall through to the next one

TOO_MANY_ARGS

Functions should not be called with extra arguments

UNEXPECTED_GLOBAL_DECL

Unexpected global variable declaration should be avoided

UNUSED_DECL

Unused local variables and functions should be removed

UNUSED_EXPR

Result of expressions should be used

UNUSED_IMPORT

Unused imported bindings should be removed

UNUSED_LABEL

Unused label should be removed

UNUSED_REQUIRE

Unused require() should be removed

UNUSED_VAR_ASSIGN

Dead variables should not be used

ES6 Rules

The following rules also relate to ECMAScript 6:

ACCESS_THIS_BEFORE_SUPER_CALL

this should be accessed after calling super in constructor of inherited class

ARROW_FUNC_RETURN_OBJECT_MISSING

Arrow function should use parentheses to return an object literal

BAD_ASSIGN_TO_CONST

Reassignment should not be made to a variable that is declared using const keyword

CALL_NON_CONSTRUCTOR

Non-constructor function should not be called with new operator as a constructor

REFERENCE_BEFORE_LEXICAL_DECL

Lexical variables (let, const and class) must be declared before they are used

UNUSED_IMPORT

Unused imported bindings should be removed

React Rules

We try to support fast-changing web frameworks. One of the results is the following React specific rules.

REACT_API_TYPO

React's APIs should not have typo

REACT_ASYNC_RENDER_RETURN_VALUE

Using the return value of ReactDOM.render() should be avoided

REACT_BAD_API_OVERRIDDEN

React component method only supported in createReactClass() API should not be overridden in ES6 class component

REACT_BAD_API_RETURN_VALUE

Return value of a React lifecycle method should be a valid type

REACT_BAD_DANGER_FORMAT

dangerouslySetInnerHTML prop for a React DOM element should be in the form of {__html: ...}

REACT_BAD_DANGER_WITH_CHILDREN

When using dangerouslySetInnerHTML prop for a React DOM element, children should not be specified

REACT_BAD_DOM_ATTRIBUTE_VALUE

React DOM element's attribute should not have a value of the wrong type

REACT_BAD_EVENT_HANDLER

Event handler of a React element should not be a string

REACT_BAD_EVENT_HANDLER_RETURN_FALSE

return false should not be used in a React event handler

REACT_BAD_INITIAL_STATE_TYPE

The initial state of React component should be set to an object or null

REACT_BAD_LENGTH_CHECK

length property itself should not be checked in the code for React child element

REACT_BAD_SPECIAL_PROPS

React special props should not be accessed

REACT_BAD_STYLE_OBJ_PROPERTY

React DOM element's style property name or value should not be wrong

REACT_BAD_STYLE_PROP

style property of a React DOM element should be an object

REACT_BAD_UNKNOWN_PROP

React property name in React DOM element should be pre-defined one

REACT_BAD_UPDATE_STATE

Updating the state inside the specific lifecycle methods of a React component should be avoided

REACT_DEPRECATED_DOM_ELEMENT_PROP

Deprecated prop for a React DOM element should not be used

REACT_DIRECT_ASSIGN_TO_STATE

Assignment should not be made to this.state in the React component's specific methods

REACT_EVENT_HANDLER_INVALID_THIS

React event handler should have proper this object binding

REACT_INEFFICIENT_PURE_COMPONENT_PROP

React.PureComponent prop should not be specified with a newly created object

REACT_JSX_BAD_COMMENT

The content of a JSX text node should not be in the form of JavaScript comment

REACT_MISMATCHED_TYPE_OF_ARG

React API should be called with arguments of correct types

REACT_MISSING_KEY_PROP

key prop should be defined at each element inside the children of a React element

REACT_MISUSED_API_IN_RENDER

Using specific APIs inside React.render() should be avoided

REACT_MISUSED_CONTROLLED_COMPONENT

Form elements should be either controlled or uncontrolled

REACT_MISUSED_CREATOR_IN_PROP_TYPES

React type checker creator itself should not be used as a prop type

REACT_MISUSED_INNER_HTML

innerHTML prop for a React DOM element should not be used

REACT_MISUSED_UPDATE_IN_SET_STATE

this.state value may not be directly used when updating the state in React component

REACT_REDUNDANT_SHOULD_COMPONENT_UPDATE

A component extending React.PureComponent should not override shouldComponentUpdate() lifecycle method

REACT_STATIC_PROPERTY_IN_INSTANCE

React static property should not be defined as an instance property

REACT_UNINITIALIZED_PROPS

Properties of the uninitialized this.props should not be accessed

REACT_USELESS_PROP_TYPES

Useless PropTypes declaration should be removed

REACT_USELESS_SHOULD_COMPONENT_UPDATE

Overridden shouldComponentUpdate() should not always return a truthy value

REACT_VOID_ELEMENT_WITH_CHILDREN

Void elements should neither have children nor dangerouslySetInnerHTML prop

What's the difference with ESLint React plugin?

DeepScan supports unique rules that require the understanding of the execution flow.

EVENT_HANDLER_INVALID_THIS

In the below, DeepScan detects this.handleClick as invalid because this.handleClick is not bound with this object.

class Hello extends React.Component {
    constructor(props) {
        super(props);
        this.state = { name: "John" };
    }
    handleClick() {
        this.setState({ name: "Mary" }); // 'this' has undefined value.
    }
    render() {
        return (<div onClick={this.handleClick}>{this.state.name}</div>);
    }
}

At line 10, DeepScan reports like:

Function 'this.handleClick' is used as a React event handler without 'this' binding. But 'this' object is accessed in the function body at line 10.

MISSING_KEY_PROP

In the below, DeepScan supports the object spread syntax by tracing the involved object.

class Hello extends React.Component {
    render() {
        let childs = members.map((member) => {
            let props = { className: "style1" };
            return (<li {...props}></li>);
        });
        return (<ul>{childs}</ul>);
    }
}

At line 5, DeepScan reports like:

Each child React element in a collection should have a 'key' prop.

BAD_RENDER_RETURN_VALUE

In the below, DeepScan detects missing return statement in if block while ESLint just finds whether return statement is in function body.

class Hello extends React.Component {
    render() {
        let someErrorFlag = true;
        if (someErrorFlag) {
            <div>Error</div>;
        } else {
            return <div>Success!</div>;
        }
    }
}

At line 5, DeepScan reports like:

The 'render()' function of React component 'Hello' returns an undefined value at this point. Consider adding 'return' keyword before JSX expression.

CWE Rules

DeepScan covers the following Common Weakness Enumeration (CWE) rules.
CWECWE NameRule
CWE-129Improper Validation of Array IndexARRAY_INDEX_NEGATIVE
CWE-398Indicator of Poor Code QualityNO_EFFECT_CALL
CWE-398Indicator of Poor Code QualityIDENTICAL_BRANCHES
CWE-398Indicator of Poor Code QualityUNUSED_EXPR
CWE-476NULL Pointer DereferenceNULL_POINTER
CWE-480Use of Incorrect OperatorBAD_ASSIGN_IN_CONDITION
CWE-480Use of Incorrect OperatorBAD_BITWISE_OPERATOR
CWE-481Assigning instead of ComparingBAD_ASSIGN_IN_CONDITION
CWE-482Comparing instead of AssigningUNUSED_EXPR
CWE-484Omitted Break Statement in SwitchSWITCH_CASE_FALL_THROUGH
CWE-489Leftover Debug CodeCONSTANT_CONDITION
CWE-561Dead CodeUNREACHABLE_CODE
CWE-563Assignment to Variable without Use ('Unused Variable')UNUSED_VAR_ASSIGN
CWE-569Expression IssuesBAD_NEGATION_OPERATOR
CWE-569Expression IssuesCONSTANT_CONDITION
CWE-570Expression is Always FalseBAD_NEGATION_OPERATOR
CWE-570Expression is Always FalseCONSTANT_CONDITION
CWE-571Expression is Always TrueCONSTANT_CONDITION
CWE-628Function Call with Incorrectly Specified ArgumentsMISMATCHED_COUNT_OF_ARGS
CWE-628Function Call with Incorrectly Specified ArgumentsMISMATCHED_TYPE_OF_ARG
CWE-628Function Call with Incorrectly Specified ArgumentsNUMBER_ARG_OUT_OF_RANGE
CWE-628Function Call with Incorrectly Specified ArgumentsREACT_MISMATCHED_TYPE_OF_ARG
CWE-628Function Call with Incorrectly Specified ArgumentsTOO_MANY_ARGS
CWE-665Improper InitializationUNUSED_EXPR
CWE-670Always-Incorrect Control Flow ImplementationSTRAY_SEMICOLON
CWE-685Function Call With Incorrect Number of ArgumentsMISMATCHED_COUNT_OF_ARGS
CWE-685Function Call With Incorrect Number of ArgumentsTOO_MANY_ARGS
CWE-843Access of Resource Using Incompatible Type ('Type Confusion')BAD_TYPE_COERCION