April 2018 (version 1.13.0-beta)

1.13.0 Update

Hello!

We are going to unveil new features like a team support and a new plan next release. But this update also has some improvements for you.

Please kindly go ahead with the highlights for this release.

Release Summary

This version includes a number of updates that we hope you’ve found some of them helpful.
The key highlights are:

• React v16.3 support - Now we support React to the latest v16.3!
• New rules - New rules for common pitfalls and improved rules.
• Analysis improvements - Inter-module analysis supporting non-relative paths of dependent modules.

React v16.3 Support

React v16.3 was just released so we have introduced new rules and aligned existing React rules to support newly added APIs in it.
Also, the UNSAFE_ prefixed versions of the existing lifecycle methods are supported.

Regarding newly added APIs and/or changes in React v16.3, 3 new rules were added. Check those out here.

Support for the newly added React.forwardRef() - An issue is detected on the below code because the first argument of React.forwardRef() should be a function.

let obj = {};
// The first argument of 'React.forwardRef()' should be a function, but a non-function object value is passed here.
// The value of the argument is originated from the object created at line 1.
let Hello = React.forwardRef(obj);

We support the newly added getDerivedStateFromProps() and getSnapshotBeforeUpdate(). Also, the render function passed as the first argument of React.forwardRef() is checked for its return value.
An issue is detected on the below code because the return keyword is missing.

React.forwardRef((props, ref) => {
    // The render function passed as the first argument of 'React.forwardRef()' returns an undefined value at this point.
    // Consider adding 'return' keyword before JSX expression.
    <Hello forwardedRef={ref} />;
});

Support for the newly added static getDerivedStateFromProps() - An issue is detected on the below code because getDerivedStateFromProps() is defined as an instance method.

class Foo extends React.Component {
    // 'getDerivedStateFromProps()' is defined as an instance method of React component 'Foo'.
    // Consider defining it as a static method instead.
    getDerivedStateFromProps(nextProps, prevState) {
        return null;
    }
}

Support for the newly added lifecycle methods - An issue is detected on the below code because the final s is missing.

class Foo extends React.Component {
    // 'getDerivedStateFromProp' could be a typo. Did you mean 'getDerivedStateFromProps' instead?
    static getDerivedStateFromProp(nextProps, prevState) {
    }
}

New Rules

To date, we have been hard at work detecting more code issues and providing much more rules.

• BAD_RETURN_IN_FOREACH - Do not return a value in the callback of forEach
• REACT_STATIC_LIFECYCLE_INVALID_THIS - Do not use an unbound this in React static lifecycle methods
• REACT_UNINVOKED_UNSAFE_LIFECYCLE - Do not define an unsafe legacy lifecycle method together with its new replacement
• REACT_UNUSED_SNAPSHOT - Use getSnapshotBeforeUpdate() together with a componentDidUpdate() definition

Improved Rules

We have applied inter-procedural analysis technique so the alarm like the following can be newly detected:

let _rtl = getRTL();

export function setRTL(isRTL: boolean): void {
  _rtl = isRTL;
}
export function getRTL(): boolean {
  if (_rtl === undefined) {
    _rtl = (
      typeof document !== 'undefined' &&
      !!document.documentElement &&
      document.documentElement.getAttribute('dir') === 'rtl'
    );
  }
  return _rtl;
}

A ReferenceError occurs at line 7 in getRTL() because _rtl is not defined.

Analysis Improvements

Non-relative path support at inter-module analysis

To improve inter-module analysis to be aware of non-relative paths of dependent modules, we have added support for resolving the paths using the project configuration files. The following configuration file types are supported:

• Node.js: package.json
• Webpack configuration JavaScript file (partial support)
• TypeScript: tsconfig.json
• VS Code: jsconfig.json

Miscellaneous

• Visual Studio Code extension supports inline decorators regarding high and medium-impact problems. It gives real-time and visual feedback for your code problems in the code window.

  

Bug Fixes

• A false alarm may occur for the exported variable of TypeScript namespace module
• A false alarm for UNUSED_IMPORT may occur when the imported variable is used at Flow implements clause
• A SYNTAX_ERROR may occur for the Flow generic type with an arrow function

Thank You

Thank you to the following folks who help to make DeepScan better:

• Stian Håklev (@houshuang): A SYNTAX_ERROR may occur for the Flow generic type with an arrow function