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 or cause unintended execution
- 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 or cause unintended execution:
ACCESS_INNER_FUNC_FROM_DEFAULT_PARAM | Inner functions should not be accessed at default parameter declaration |
ACCESS_THIS_BEFORE_SUPER_CALL |
|
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_ARRAY_METHOD_ON_ARGUMENTS | Array methods should not be called on the |
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 |
BAD_ASSIGN_TO_PROTO | The |
BAD_BACK_REFERENCE_IN_REGEXP | Back reference in a regular expression should be used after the referred group |
BAD_BITWISE_OPERATOR | Bitwise operators should not be used where logical operators are expected |
BAD_CHAR_AT_COMPARISON | The result of |
BAD_COMPARISON_SEQUENCE | The comparison operator should not be applied 2 or more times in a row |
BAD_COMPARISON_WITH_FLOAT | The result of integer-returning built-in API should not be compared with a float number |
BAD_CONDITIONAL_OPERATOR | The conditional operator should be used in correct order |
BAD_ESCAPE_AT_REGEXP_CONSTRUCTOR | Character escapes should be used properly when constructing a regular expression from string literal |
BAD_EVENT_LISTENER_CALL | The handler function itself should be used at |
BAD_FINALLY_CONTROL_FLOW |
|
BAD_FOR_STATEMENT | The index variable of |
BAD_MATCH_ALL_ARG |
|
BAD_MONTH_ARG | The month argument of |
BAD_MIN_MAX_FUNC |
|
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_OBJECT_LITERAL_COMPARISON | Object literal should not be used for comparison |
BAD_OPERAND_TYPE |
|
BAD_PROPERTY_DESCRIPTOR | Property descriptors should be defined properly |
BAD_RANGE_IN_CHARACTER_CLASS | A character range from an uppercase to a lowercase should not be used in a regular expression |
BAD_REGEXP | Empty character classes should not be used in regular expressions |
BAD_REGEXP_LITERAL_IN_STRING | Regular expression should not be wrapped as a string at |
BAD_REMOVE_EVENT_LISTENER |
|
BAD_REPLACE_ALL_ARG |
|
BAD_RETURN_IN_FOREACH | The callback function of |
BAD_STRING_CASE_COMPARISON | Result of |
BAD_TEST_WITH_GLOBAL_REGEXP | The |
BAD_TYPE_COERCION | Suspicious type coercion should be avoided |
BAD_TYPEOF_COMPARISON | Result of |
BAD_USE_STRICT | Strict mode should be declared properly |
CALL_NON_CONSTRUCTOR | Non-constructor function should not be called with the |
CALL_NON_FUNC | Non-function object should not be called as a function |
CALL_REQUIRE_AS_CONSTRUCTOR |
|
COMPARE_INCOMPATIBLE_TYPE_STRICTLY | Strict equality should not be used for two values with different types |
COMPARE_NAN | Comparing |
DUPLICATE_CASE |
|
DUPLICATE_PARAM | Function should not have duplicate parameter names |
DUPLICATE_PROPERTY | Property should not be redeclared in object literals or classes |
FUTILE_REGEXP_TEST |
|
FUTILE_STRING_REPLACE | The search and the replace strings of |
GETTER_SETTER_RECURSION | Getter or setter functions should avoid an infinite call by accessing themselves |
INCOMPLETE_STRING_ESCAPE | All occurrences should be replaced when escaping a special character |
INHERIT_NON_CONSTRUCTOR | Class should inherit from a constructor |
INSUFFICIENT_NULL_CHECK |
|
INVALID_PRIVATE_FIELD_ACCESS | Read or write-only private fields should be accessed properly |
ITERATE_NON_ITERABLE | Non-iterable values should not be iterated |
JSX_BAD_COMMENT | The content of a JSX text node should not be in the form of JavaScript comment |
LENGTH_PROPERTY_TYPO | The |
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 |
MISMATCHED_TYPE_OF_DEFAULT_VALUE | Default values should be of expected types |
MISPLACED_ALTERNATIVE_IN_REGEXP | Regular expression alternatives that are prefixes should be placed in proper order |
MISPLACED_ANCHOR_IN_REGEXP |
|
MISPLACED_COMPARISON_AT_INDEX_OF | Comparison expressions should not be placed as |
MISSING_AWAIT |
|
MISSING_ELSE_KEYWORD |
|
MISSING_LENGTH_IN_LOOP_CONDITION |
|
MISSING_RETURN_VALUE | Return value of function without any |
MISSING_SUPER_CALL | Constructor of inherited class should call |
MISSING_THROW |
|
MISUSED_EXPORTS_VAR | Assignments to |
MISUSED_ITERATOR | Iterator objects should not be misused as arrays |
MULTIPLE_RESOLVE_IN_PROMISE_EXECUTOR | The |
MULTIPLE_SUPER_CALL |
|
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 |
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 |
REACT_BAD_API_RETURN_VALUE | Return values of React lifecycle methods and API callback functions should have valid types |
REACT_BAD_CHILD_GENERATOR |
|
REACT_BAD_CONTEXT_CONSUMER_CHILD | The child node of a React context consumer should be specified properly |
REACT_BAD_CONTEXT_TYPE |
|
REACT_BAD_DANGER_FORMAT |
|
REACT_BAD_DANGER_WITH_CHILDREN | When using |
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 |
|
REACT_BAD_INITIAL_STATE_TYPE | The initial state of React component should be set to an object or |
REACT_BAD_LENGTH_CHECK |
|
REACT_BAD_SPECIAL_PROPS | React special props should not be accessed |
REACT_BAD_STYLE_OBJ_PROPERTY | React DOM element's |
REACT_BAD_STYLE_PROP |
|
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 |
REACT_EVENT_HANDLER_INVALID_THIS | React event handler should have proper |
REACT_FUNC_COMPONENT_INVALID_REF_PROP |
|
REACT_FUNC_COMPONENT_INVALID_THIS |
|
REACT_MISMATCHED_COUNT_OF_ARGS | React API should be called with the correct number of arguments |
REACT_MISMATCHED_TYPE_OF_ARG | React API should be called with arguments of correct types |
REACT_MISMATCHED_TYPE_OF_PROP | React component should receive prop values of correct |
REACT_MISSING_CLEANUP_IN_EFFECT_HOOK | Global event handlers added at React Effect Hooks should be properly removed at the cleanup function |
REACT_MISSING_CLEANUP_IN_LIFECYCLE | Global event handlers should be properly removed during React component lifecycle |
REACT_MISSING_EVENT_PERSIST |
|
REACT_MISUSED_API_IN_RENDER | Using specific APIs inside |
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 |
|
REACT_STATIC_LIFECYCLE_INVALID_THIS |
|
REACT_STATIC_PROPERTY_IN_INSTANCE | React static property should not be defined as an instance property |
REACT_UNINITIALIZED_PROPS | Properties of the uninitialized |
REACT_UNINVOKED_UNSAFE_LIFECYCLE | Unsafe legacy lifecycle methods should not be defined together with newly added replacements |
REACT_VOID_ELEMENT_WITH_CHILDREN | Void elements should neither have children nor |
REDUCE_EMPTY_ARRAY_WITHOUT_INIT | An initial value should be provided at |
REDUNDANT_COMPOUND_ASSIGN | A reference is used on both sides of compound assignment operator |
REFERENCE_BEFORE_LEXICAL_DECL | Lexical variables ( |
STRAY_SEMICOLON | An extraneous semicolon should be avoided to prevent an unintentional logic change |
STRICT_MODE_ARGS_CALLER_CALLEE |
|
STRICT_MODE_ASSIGN_TO_READONLY_VAR | In strict mode, read-only variables cannot be assigned |
STRICT_MODE_FUNC_PROPERTY |
|
STRICT_MODE_INVALID_THIS | Strict mode function should not be called with invalid |
SWITCH_CASE_INCOMPATIBLE_TYPE |
|
SYNTAX_ERROR | JavaScript syntax error |
UNDEFINED_IMPORT | Imported bindings should be defined and exported from the requested module |
UNINITIALIZED_LOCAL_VAR | Uninitialized local variables should not be accessed |
UNINVOKED_ARRAY_CALLBACK |
|
UNREACHABLE_CODE | Unreachable code should not be used |
VUE_ASSIGN_TO_READONLY_PROPERTY | Read-only property of Vue should not be assigned |
VUE_BAD_API_RETURN_VALUE | Return value of function-typed Vue options should be a valid type |
VUE_BAD_ARROW_FUNC | Arrow function with |
VUE_BAD_COMPONENT_NAME | Vue component name should be defined with valid string |
VUE_BAD_DIRECTIVE_FORMAT | Vue directive should be defined with a right format |
VUE_BAD_DIRECTIVE_VALUE | Vue directive should be defined with values of correct types |
VUE_BAD_DYNAMIC_COMPONENT | Vue dynamic component should have a dynamically bound |
VUE_BAD_EVENT_HANDLER_RETURN_FALSE |
|
VUE_BAD_HTML_SYNTAX | HTML syntax error in Vue template |
VUE_BAD_MOUNT_ELEMENT | Vue instance should be mounted on a proper element |
VUE_BAD_PROP_DECL | Vue prop should be declared properly |
VUE_BAD_PROPERTY_SET_DELETE | Vue's global API |
VUE_BAD_TRANSITION_GROUP |
|
VUE_DEPRECATED_FEATURE | Deprecated features of Vue should not be used |
VUE_DUPLICATE_ATTRIBUTE | Each attribute of a Vue element should be unique |
VUE_DUPLICATE_PROPERTY_IN_OPTION | Property should be unique between Vue options |
VUE_DUPLICATE_SLOT | Each slot passed to a component should have unique name |
VUE_FIXED_TRANSITION_CHILD | The child of a |
VUE_INVALID_COMPUTED_PROPERTY_ACCESS | Computed properties should be accessed properly according to the existence of getter or setter |
VUE_INVALID_REF_ACCESS | Properties of |
VUE_INVALID_V_ELSE |
|
VUE_MISMATCHED_COUNT_OF_ARGS | Vue API should be called with the correct number of arguments |
VUE_MISMATCHED_TYPE_OF_ARG | Vue API should be called with arguments of correct types |
VUE_MISMATCHED_TYPE_OF_OPTION | Vue option should be defined with a valid type |
VUE_MISMATCHED_TYPE_OF_PROP | Vue component should receive prop values of correct prop types |
VUE_MISPLACED_OPTION | Vue options should be used in proper place |
VUE_MISSING_CLEANUP_IN_LIFECYCLE | Global event handlers should be properly removed during Vue component lifecycle |
VUE_MISSING_REF_UNWRAP | Ref objects should be used after unwrapping |
VUE_MISSING_RETURN_VALUE_IN_VALIDATOR | Validator functions for Vue prop and event should have return values |
VUE_MISUSED_API_AFTER_AWAIT | Lifecycle hooks and watchers should not be registered after |
VUE_MISUSED_PROPERTY_IN_DATA | Computed and data properties should not be used inside the |
VUE_MISUSED_V_FOR_VAR | The first variable of |
VUE_MISUSED_V_SLOT |
|
VUE_MULTIPLE_TEMPLATE_ROOT | Vue template should have a single root element |
VUE_OPTION_TYPO | Vue option should not have typo |
VUE_PASSIVE_WITH_PREVENT |
|
VUE_REDUNDANT_REF_ATTRIBUTE |
|
VUE_REDUNDANT_TEMPLATE | Template should not be defined redundantly for a Vue component |
VUE_RESERVED_PROPERTY_IN_OPTION | Vue option's property name should not be a reserved name of Vue |
VUE_SETUP_INVALID_THIS |
|
VUE_SHARED_DATA | The |
VUE_STATIC_KEY_ATTRIBUTE | Element iterated with |
VUE_TEMPLATE_WITH_V_SHOW | Vue |
VUE_UNINITIALIZED_INSTANCE_PROPERTY | Uninitialized properties of a Vue instance should not be accessed |
VUE_USELESS_V_ONCE |
|
VUE_V_BIND_ON_DIRECTIVE |
|
Code Quality
The following rules relate to code which should be more readable, reusable and refactorable:
AMBIGUOUS_BRANCH_BODY |
|
AMBIGUOUS_ELSE_BRANCH | The indentation of |
ARRAY_CALLBACK_RETURN_MISSING | Callback function argument of |
ASSIGN_BEFORE_DECL | Variables should be declared before they are assigned |
ASSIGN_SAME_VALUE | The same value is assigned to the variable again |
AWAIT_NON_PROMISE |
|
BAD_WITH_STATEMENT |
|
CONSTANT_CONDITION | Constant expression should not be used in the conditional statements |
DUPLICATE_DECL | Functions or variables should not be redeclared |
DUPLICATE_PARENS | Parentheses should not be used for an already parenthesized expression |
DUPLICATES_IN_CHARACTER_CLASS | Character classes in a regular expression should not have duplicate characters |
EMPTY_BLOCK | Empty block statements should not be used in conditional statements |
FORIN_ARRAY |
|
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 |
PREFER_INEQUALITY_OPERATOR | The inequality operator should be preferred over negating the equality comparison result |
PROMISE_REJECT_FALL_THROUGH | Execution should not fall through after |
REACT_ASYNC_RENDER_RETURN_VALUE | Using the return value of |
REACT_DEPRECATED_DOM_ELEMENT_PROP | Deprecated prop for a React DOM element should not be used |
REACT_INEFFICIENT_PURE_COMPONENT_PROP |
|
REACT_INVALID_DOM_NESTING | React DOM elements should be nested properly |
REACT_MISSING_KEY_PROP |
|
REACT_MISUSED_UPDATE_IN_SET_STATE |
|
REACT_REDUNDANT_SHOULD_COMPONENT_UPDATE | A component extending |
REACT_REDUX_UNUSED_OWN_PROPS_PARAM | Unused |
REACT_UNUSED_SNAPSHOT | Return value of |
REACT_USELESS_DEPENDENCY_OF_HOOK | The dependency of a React Hook should not be specified with a newly created object |
REACT_USELESS_FORWARD_REF | The argument function of |
REACT_USELESS_MEMOIZE_HOOK | React Memoize Hooks should not be used fruitlessly |
REACT_USELESS_PROP_TYPES | Useless |
REACT_USELESS_SHOULD_COMPONENT_UPDATE | Overridden |
SAME_OPERAND_VALUE | Operands always having the same value should be avoided |
SETTER_RETURN_VALUE | Setter functions should not return values |
SKIPPED_ITERATION_AFTER_SPLICE | Loop iteration should not be skipped after removing an element with |
SWITCH_CASE_FALL_THROUGH | Cases in |
TOO_MANY_ARGS | Functions should not be called with extra arguments |
TRIPLE_NEGATION_OPERATOR | The logical negation operator should not be applied 3 or more times in a row |
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_PARAM | Unused parameters of local function should be removed |
UNUSED_PRIVATE_FIELD | Unused private fields in a class should be removed |
UNUSED_REQUIRE | Unused |
UNUSED_VAR_ASSIGN | Dead variables should not be used |
USELESS_ARRAY | Elements added to an array should be used |
USELESS_ARROW_FUNC_BIND | Arrow functions cannot be bound |
USELESS_CALL |
|
USELESS_CATCH | A |
USELESS_LOCAL_VAR_DELETE |
|
USELESS_LOOP | Loop should not be used when only a single iteration is needed |
VUE_IDENTICAL_BRANCHES_IN_TEMPLATE | Branches of |
VUE_MISSING_KEY_ATTRIBUTE | The Vue component iterated with |
VUE_MISSING_RETURN_VALUE_IN_COMPUTED | Getter function of computed property should have return values |
VUE_MUTATED_PROP | Props of a Vue component should not be mutated |
VUE_REDUNDANT_INLINE_EVENT_HANDLER | Vue inline event handlers should not be redundantly used |
VUE_TEXTAREA_WITH_USELESS_CHILDREN |
|
VUE_UNUSED_DECL_IN_TEMPLATE | Variables declared in a Vue template should be used |
VUE_UNUSED_LOCAL_COMPONENT | Local components declared in a Vue component should be used |
VUE_V_IF_WITH_V_FOR |
|
ES6+ Rules
The following rules also relate to the latest ECMAScript specifications:
ACCESS_INNER_FUNC_FROM_DEFAULT_PARAM | Inner functions should not be accessed at default parameter declaration |
ACCESS_THIS_BEFORE_SUPER_CALL |
|
ARROW_FUNC_RETURN_OBJECT_MISSING | Arrow function should use parentheses to return an object literal |
AWAIT_NON_PROMISE |
|
BAD_ASSIGN_TO_CONST | Reassignment should not be made to a variable that is declared using |
BAD_MATCH_ALL_ARG |
|
BAD_REPLACE_ALL_ARG |
|
CALL_NON_CONSTRUCTOR | Non-constructor function should not be called with the |
INHERIT_NON_CONSTRUCTOR | Class should inherit from a constructor |
INVALID_PRIVATE_FIELD_ACCESS | Read or write-only private fields should be accessed properly |
ITERATE_NON_ITERABLE | Non-iterable values should not be iterated |
MISSING_AWAIT |
|
MISSING_SUPER_CALL | Constructor of inherited class should call |
MULTIPLE_RESOLVE_IN_PROMISE_EXECUTOR | The |
MULTIPLE_SUPER_CALL |
|
PROMISE_REJECT_FALL_THROUGH | Execution should not fall through after |
REACT_BAD_CHILD_GENERATOR |
|
REFERENCE_BEFORE_LEXICAL_DECL | Lexical variables ( |
STRICT_MODE_INVALID_THIS | Strict mode function should not be called with invalid |
UNDEFINED_IMPORT | Imported bindings should be defined and exported from the requested module |
UNUSED_IMPORT | Unused imported bindings should be removed |
UNUSED_PRIVATE_FIELD | Unused private fields in a class should be removed |
USELESS_ARROW_FUNC_BIND | Arrow functions cannot be bound |
React Rules
We try to support fast-changing web frameworks. One of the results is the following React specific rules.
JSX_BAD_COMMENT | The content of a JSX text node should not be in the form of JavaScript comment |
REACT_API_TYPO | React's APIs should not have typo |
REACT_ASYNC_RENDER_RETURN_VALUE | Using the return value of |
REACT_BAD_API_OVERRIDDEN | React component method only supported in |
REACT_BAD_API_RETURN_VALUE | Return values of React lifecycle methods and API callback functions should have valid types |
REACT_BAD_CHILD_GENERATOR |
|
REACT_BAD_CONTEXT_CONSUMER_CHILD | The child node of a React context consumer should be specified properly |
REACT_BAD_CONTEXT_TYPE |
|
REACT_BAD_DANGER_FORMAT |
|
REACT_BAD_DANGER_WITH_CHILDREN | When using |
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 |
|
REACT_BAD_INITIAL_STATE_TYPE | The initial state of React component should be set to an object or |
REACT_BAD_LENGTH_CHECK |
|
REACT_BAD_SPECIAL_PROPS | React special props should not be accessed |
REACT_BAD_STYLE_OBJ_PROPERTY | React DOM element's |
REACT_BAD_STYLE_PROP |
|
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 |
REACT_EVENT_HANDLER_INVALID_THIS | React event handler should have proper |
REACT_FUNC_COMPONENT_INVALID_REF_PROP |
|
REACT_FUNC_COMPONENT_INVALID_THIS |
|
REACT_INEFFICIENT_PURE_COMPONENT_PROP |
|
REACT_INVALID_DOM_NESTING | React DOM elements should be nested properly |
REACT_MISMATCHED_COUNT_OF_ARGS | React API should be called with the correct number of arguments |
REACT_MISMATCHED_TYPE_OF_ARG | React API should be called with arguments of correct types |
REACT_MISMATCHED_TYPE_OF_PROP | React component should receive prop values of correct |
REACT_MISSING_CLEANUP_IN_EFFECT_HOOK | Global event handlers added at React Effect Hooks should be properly removed at the cleanup function |
REACT_MISSING_CLEANUP_IN_LIFECYCLE | Global event handlers should be properly removed during React component lifecycle |
REACT_MISSING_EVENT_PERSIST |
|
REACT_MISSING_KEY_PROP |
|
REACT_MISUSED_API_IN_RENDER | Using specific APIs inside |
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 |
|
REACT_MISUSED_UPDATE_IN_SET_STATE |
|
REACT_REDUNDANT_SHOULD_COMPONENT_UPDATE | A component extending |
REACT_REDUX_UNUSED_OWN_PROPS_PARAM | Unused |
REACT_STATIC_LIFECYCLE_INVALID_THIS |
|
REACT_STATIC_PROPERTY_IN_INSTANCE | React static property should not be defined as an instance property |
REACT_UNINITIALIZED_PROPS | Properties of the uninitialized |
REACT_UNINVOKED_UNSAFE_LIFECYCLE | Unsafe legacy lifecycle methods should not be defined together with newly added replacements |
REACT_UNUSED_SNAPSHOT | Return value of |
REACT_USELESS_DEPENDENCY_OF_HOOK | The dependency of a React Hook should not be specified with a newly created object |
REACT_USELESS_FORWARD_REF | The argument function of |
REACT_USELESS_MEMOIZE_HOOK | React Memoize Hooks should not be used fruitlessly |
REACT_USELESS_PROP_TYPES | Useless |
REACT_USELESS_SHOULD_COMPONENT_UPDATE | Overridden |
REACT_VOID_ELEMENT_WITH_CHILDREN | Void elements should neither have children nor |
What's the difference with ESLint React plugin?
DeepScan supports unique rules that require the understanding of the execution flow.
REACT_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.REACT_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.REACT_BAD_API_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.
Vue Rules
DeepScan now supports Vue.js! The followings are our Vue specific rules:
VUE_ASSIGN_TO_READONLY_PROPERTY | Read-only property of Vue should not be assigned |
VUE_BAD_API_RETURN_VALUE | Return value of function-typed Vue options should be a valid type |
VUE_BAD_ARROW_FUNC | Arrow function with |
VUE_BAD_COMPONENT_NAME | Vue component name should be defined with valid string |
VUE_BAD_DIRECTIVE_FORMAT | Vue directive should be defined with a right format |
VUE_BAD_DIRECTIVE_VALUE | Vue directive should be defined with values of correct types |
VUE_BAD_DYNAMIC_COMPONENT | Vue dynamic component should have a dynamically bound |
VUE_BAD_EVENT_HANDLER_RETURN_FALSE |
|
VUE_BAD_HTML_SYNTAX | HTML syntax error in Vue template |
VUE_BAD_MOUNT_ELEMENT | Vue instance should be mounted on a proper element |
VUE_BAD_PROPERTY_SET_DELETE | Vue's global API |
VUE_BAD_PROP_DECL | Vue prop should be declared properly |
VUE_BAD_TRANSITION_GROUP |
|
VUE_DEPRECATED_FEATURE | Deprecated features of Vue should not be used |
VUE_DUPLICATE_ATTRIBUTE | Each attribute of a Vue element should be unique |
VUE_DUPLICATE_PROPERTY_IN_OPTION | Property should be unique between Vue options |
VUE_DUPLICATE_SLOT | Each slot passed to a component should have unique name |
VUE_FIXED_TRANSITION_CHILD | The child of a |
VUE_IDENTICAL_BRANCHES_IN_TEMPLATE | Branches of |
VUE_INVALID_COMPUTED_PROPERTY_ACCESS | Computed properties should be accessed properly according to the existence of getter or setter |
VUE_INVALID_REF_ACCESS | Properties of |
VUE_INVALID_V_ELSE |
|
VUE_MISMATCHED_COUNT_OF_ARGS | Vue API should be called with the correct number of arguments |
VUE_MISMATCHED_TYPE_OF_ARG | Vue API should be called with arguments of correct types |
VUE_MISMATCHED_TYPE_OF_OPTION | Vue option should be defined with a valid type |
VUE_MISMATCHED_TYPE_OF_PROP | Vue component should receive prop values of correct prop types |
VUE_MISPLACED_OPTION | Vue options should be used in proper place |
VUE_MISSING_CLEANUP_IN_LIFECYCLE | Global event handlers should be properly removed during Vue component lifecycle |
VUE_MISSING_KEY_ATTRIBUTE | The Vue component iterated with |
VUE_MISSING_REF_UNWRAP | Ref objects should be used after unwrapping |
VUE_MISSING_RETURN_VALUE_IN_COMPUTED | Getter function of computed property should have return values |
VUE_MISSING_RETURN_VALUE_IN_VALIDATOR | Validator functions for Vue prop and event should have return values |
VUE_MISUSED_API_AFTER_AWAIT | Lifecycle hooks and watchers should not be registered after |
VUE_MISUSED_PROPERTY_IN_DATA | Computed and data properties should not be used inside the |
VUE_MISUSED_V_FOR_VAR | The first variable of |
VUE_MISUSED_V_SLOT |
|
VUE_MULTIPLE_TEMPLATE_ROOT | Vue template should have a single root element |
VUE_MUTATED_PROP | Props of a Vue component should not be mutated |
VUE_OPTION_TYPO | Vue option should not have typo |
VUE_PASSIVE_WITH_PREVENT |
|
VUE_REDUNDANT_INLINE_EVENT_HANDLER | Vue inline event handlers should not be redundantly used |
VUE_REDUNDANT_REF_ATTRIBUTE |
|
VUE_REDUNDANT_TEMPLATE | Template should not be defined redundantly for a Vue component |
VUE_RESERVED_PROPERTY_IN_OPTION | Vue option's property name should not be a reserved name of Vue |
VUE_SETUP_INVALID_THIS |
|
VUE_SHARED_DATA | The |
VUE_STATIC_KEY_ATTRIBUTE | Element iterated with |
VUE_TEMPLATE_WITH_V_SHOW | Vue |
VUE_TEXTAREA_WITH_USELESS_CHILDREN |
|
VUE_UNINITIALIZED_INSTANCE_PROPERTY | Uninitialized properties of a Vue instance should not be accessed |
VUE_UNUSED_DECL_IN_TEMPLATE | Variables declared in a Vue template should be used |
VUE_UNUSED_LOCAL_COMPONENT | Local components declared in a Vue component should be used |
VUE_USELESS_V_ONCE |
|
VUE_V_BIND_ON_DIRECTIVE |
|
VUE_V_IF_WITH_V_FOR |
|
Node.js Rules
Check out our Node.js specific rules:
CALL_REQUIRE_AS_CONSTRUCTOR |
|
MISUSED_EXPORTS_VAR | Assignments to |
UNUSED_REQUIRE | Unused |
CWE Rules
DeepScan covers the following Common Weakness Enumeration (CWE) rules.CWE | CWE Name | Rule |
---|---|---|
CWE-129 | Improper Validation of Array Index | ARRAY_INDEX_NEGATIVE |
CWE-398 | Indicator of Poor Code Quality | NO_EFFECT_CALL |
CWE-398 | Indicator of Poor Code Quality | IDENTICAL_BRANCHES |
CWE-398 | Indicator of Poor Code Quality | UNUSED_EXPR |
CWE-398 | Indicator of Poor Code Quality | VUE_IDENTICAL_BRANCHES_IN_TEMPLATE |
CWE-476 | NULL Pointer Dereference | NULL_POINTER |
CWE-480 | Use of Incorrect Operator | BAD_ASSIGN_IN_CONDITION |
CWE-480 | Use of Incorrect Operator | BAD_BITWISE_OPERATOR |
CWE-481 | Assigning instead of Comparing | BAD_ASSIGN_IN_CONDITION |
CWE-482 | Comparing instead of Assigning | UNUSED_EXPR |
CWE-483 | Incorrect Block Delimitation | AMBIGUOUS_BRANCH_BODY |
CWE-484 | Omitted Break Statement in Switch | SWITCH_CASE_FALL_THROUGH |
CWE-489 | Leftover Debug Code | CONSTANT_CONDITION |
CWE-561 | Dead Code | UNREACHABLE_CODE |
CWE-563 | Assignment to Variable without Use ('Unused Variable') | UNUSED_VAR_ASSIGN |
CWE-569 | Expression Issues | BAD_NEGATION_OPERATOR |
CWE-569 | Expression Issues | CONSTANT_CONDITION |
CWE-570 | Expression is Always False | BAD_NEGATION_OPERATOR |
CWE-570 | Expression is Always False | CONSTANT_CONDITION |
CWE-571 | Expression is Always True | CONSTANT_CONDITION |
CWE-628 | Function Call with Incorrectly Specified Arguments | MISMATCHED_COUNT_OF_ARGS |
CWE-628 | Function Call with Incorrectly Specified Arguments | MISMATCHED_TYPE_OF_ARG |
CWE-628 | Function Call with Incorrectly Specified Arguments | NUMBER_ARG_OUT_OF_RANGE |
CWE-628 | Function Call with Incorrectly Specified Arguments | REACT_MISMATCHED_COUNT_OF_ARGS |
CWE-628 | Function Call with Incorrectly Specified Arguments | REACT_MISMATCHED_TYPE_OF_ARG |
CWE-628 | Function Call with Incorrectly Specified Arguments | VUE_MISMATCHED_COUNT_OF_ARGS |
CWE-628 | Function Call with Incorrectly Specified Arguments | VUE_MISMATCHED_TYPE_OF_ARG |
CWE-628 | Function Call with Incorrectly Specified Arguments | TOO_MANY_ARGS |
CWE-665 | Improper Initialization | UNUSED_EXPR |
CWE-670 | Always-Incorrect Control Flow Implementation | STRAY_SEMICOLON |
CWE-670 | Always-Incorrect Control Flow Implementation | AMBIGUOUS_ELSE_BRANCH |
CWE-685 | Function Call With Incorrect Number of Arguments | MISMATCHED_COUNT_OF_ARGS |
CWE-685 | Function Call With Incorrect Number of Arguments | REACT_MISMATCHED_COUNT_OF_ARGS |
CWE-685 | Function Call With Incorrect Number of Arguments | VUE_MISMATCHED_COUNT_OF_ARGS |
CWE-685 | Function Call With Incorrect Number of Arguments | TOO_MANY_ARGS |
CWE-843 | Access of Resource Using Incompatible Type ('Type Confusion') | BAD_TYPE_COERCION |