jsdoc/require-jsdoc false positive with react typescript (tsx) files #445
Description
Summary
I'm having some troubles trying to use eslint-plugin-jsdoc with react typescript files. I get a Missing JSDoc comment.eslint(jsdoc/require-jsdoc), even though there is a jsdoc there.
How to reproduce:
- Create a renderer method that returns a self closing tag
- Create a method right after the rendered method
Environment:
- node 12.13.1
- eslint 6.4.0
- eslint-plugin-jsdoc 18.4.3
Configuration:
const config = {
parserOptions: {
ecmaVersion: 2019,
sourceType: 'module',
ecmaFeatures: {
jsx: true,
impliedStrict: true
}
},
parser: '@typescript-eslint/parser',
plugins: [
'jsdoc'
],
rules: {
'jsdoc/require-jsdoc': [
'error',
{
require: {
FunctionDeclaration: true,
FunctionExpression: true,
ClassDeclaration: true,
ClassExpression: true,
MethodDefinition: true
}
}
]
}
};
Example:
import React from 'react';
import { View } from 'react-native';
/**
* Example component
*/
class Example {
/**
* Renders a single item
* @returns the item react element
*/
renderItem(): React.ReactElement {
return <View style={{ position: 'relative' }} />;
}
/**
* Renders a list of items
* @returns the list react element
*/
renderList(): React.ReactElement { // here complains "Missing JSDoc comment.eslint(jsdoc/require-jsdoc)"
return <View />;
}
}
Workaround
Transforming the tag into non-self-closing works.
import React from 'react';
import { View } from 'react-native';
/**
* Example component
*/
class Example {
/**
* Renders a single item
* @returns the item react element
*/
renderItem(): React.ReactElement {
return <View style={{ position: 'relative' }}></View>;
}
/**
* Renders a list of items
* @returns the list react element
*/
renderList(): React.ReactElement { // no more complains
return <View />;
}
}