JavaScript

JavaScript

Made by DeepSource
Use for-of loop for array JS-0361
Anti-pattern
Minor

A for-of loop is recommended when the loop index is only used to read from the collection.

Invalid custom TypeScript modules declaration JS-0364
Anti-pattern
Minor
Autofix

In an effort to prevent further confusion between custom TypeScript modules and the new ES2015 modules, starting with TypeScript v1.5 the keyword namespace is now the preferred way to declare custom TypeScript modules. Use the namespace keyword instead of the module keyword to declare custom TypeScript modules.

Require a name property in Vue components JS-0720
Anti-pattern
Minor

Name property in a SFC module is mostly a convenience for debugging. It's also helpful for recursion.

Disallow unnecessary v-bind directives JS-0717
Anti-pattern
Minor

The v-bind with a string literal value can be changed to a static attribute definition.

Comparisons found where both the sides are exactly the same JS-0089
Anti-pattern
Major

Comparing a variable against itself is usually an error, either a typo or refactoring error. It is confusing to the reader and may potentially introduce a runtime error. The only time you would compare a variable against itself is when you are testing for NaN.

Detected empty functions JS-0321
Anti-pattern
Minor

Having empty functions hurts readability, and is considered a code-smell. There's almost always a way to avoid using them. If you must use one, consider adding a comment to inform the reader of its purpose.

Forbid certain props on DOM Nodes JS-0395
Anti-pattern
Major

This rule prevents passing of props to elements. This rule only applies to DOM Nodes (e.g. <div />) and not Components (e.g. <Component />). The list of forbidden props can be customized with the forbid option.

Prefer event handler naming conventions in JSX JS-0411
Anti-pattern
Minor

Ensures that any component or prop methods used to handle events are correctly prefixed.

Found $FlowFixMe comments JS-0485
Anti-pattern
Major

The usage of $FlowFixMe is not preferred. This is especially useful as a warning to ensure instances of $FlowFixMe in your codebase get fixed over time.

Found unnecessary escape characters JS-0097
Anti-pattern
Minor

Escaping non-special characters in strings, template literals, and regular expressions doesn't have any effect.

Inconsistent font-display for Google Fonts JS-W1009
Anti-pattern
Minor
Autofix

The display descriptor for the Google font is either not assigned or set to auto, fallback, or block. A recommended way to resolve this is to set display as optional. Specifying display=optional minimizes the risk of invisible text or layout shift. If it is essential to swap to a custom font after it has loaded, use display=swap instead.

Found division operators explicitly at the beginning of regular expressions JS-0055
Anti-pattern
Minor
Autofix

Regex literals should escape division operators.

Require $on and $watch deregistration callbacks to be saved in a variable JS-0529
Anti-pattern
Minor

Watch and On methods on the scope object should be assigned to a variable, in order to be deleted in a $destroy event handler Rule based on Angular 1.x

Disallow unnecessary mustache interpolations JS-0716
Anti-pattern
Minor

The mustache interpolation with a string literal value can be changed to a static contents.

Prefer not to declare variables in global scope JS-0067
Anti-pattern
Minor

It is considered a best practice to avoid 'polluting' the global scope with variables that are intended to be local to the script. Global variables created from a script can produce name collisions with global variables created from another script, which will usually lead to runtime errors or unexpected behavior. It is mostly useful for browser scripts.

Prefer not to extend native types JS-0061
Anti-pattern
Minor

In JavaScript, you can extend any object, including builtin or "native" objects. Sometimes people change the behavior of these native objects in ways that break the assumptions made about them in other parts of the code.

Avoid using promises in places not designed to handle them JS-0336
Anti-pattern
Major

Using promises is forbidden in places where the TypeScript compiler allows them but they are not handled properly. These situations can often arise due to a missing await keyword or just a misunderstanding of the way async functions are handled/awaited.

Prevent usage of wrong DOM property JS-0455
Anti-pattern
Minor

React components use JSX, not HTML. So we need to use JSX attributes and React replicate the respective HTML property/attribute while rendering. Use of HTML property in JSX can sometimes lead to errors. For example, class is a keyword in JavaScript (JSX is an extension of JavaScript), so it will throw an error. However, in HTML it is a valid attribute.

Note: If you use React with Web Components, use the class attribute instead.

Validation of JSX maximum depth JS-0415
Anti-pattern
Minor

Nesting JSX elements too deeply can confuse developers reading the code. To make maintenance and refactoring easier, DeepSource recommends limiting the maximum JSX tree depth to 4.

Unnecessary non-null assertion JS-0324
Anti-pattern
Minor
Autofix

Multiple non-null assertion operators (!s) are redundant, and may confuse the reader. Moreover, foo?.bar should always be preferred over foo!?.bar.