-
-
Notifications
You must be signed in to change notification settings - Fork 303
Adding @extends React.Component
support to isReactComponentClass
#269
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Good start. A few comments to tighten this up.
src/utils/isReactComponentClass.js
Outdated
@@ -44,6 +44,26 @@ export default function isReactComponentClass( | |||
return true; | |||
} | |||
|
|||
// check for @extends React.Component in docblock | |||
if (path.parentPath.value && path.parentPath.value) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Why the doubled-up check?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Whoops, should've been (path.parentPath&& path.parentPath.value)
src/utils/isReactComponentClass.js
Outdated
classDeclaration = path.parentPath.value; | ||
} | ||
|
||
if (classDeclaration.leadingComments && classDeclaration.leadingComments.length > 0) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Be more defensive and add a check for whether classDeclaration
is truthy:
if (classDeclaration && classDeclaration.leadingComments && classDeclaration.leadingComments.length) {
(Note that checking the truthiness of length
is sufficient rather than doing the explicit > 0
)
src/utils/isReactComponentClass.js
Outdated
} | ||
|
||
if (classDeclaration.leadingComments && classDeclaration.leadingComments.length > 0) { | ||
var matchedComments = classDeclaration.leadingComments.filter(function(comment) { return comment.value.match(/(@extends React.Component)/) }); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
A few issues:
- No need to wrap the inside of the
RegExp
with parentheses, since you're not using the capture for anything - The
.
character in yourRegExp
will match anything -- you need to escape it to check for a literal period. Also, some people might indent the JSDoc field and value differently, so best to be lenient for that:
/@extends\s+React\.Component/
- No need to check through all of the comment lines -- you just need to find one that matches. So you can use
Array.prototype.some
to your advantage:
if (classDeclaration.leadingComments.some(function (comment) {
return /@extends\s+React\.Component/.test(comment.value);
})) {
return true;
}
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Excellent points, getting all of that integrated.
src/utils/isReactComponentClass.js
Outdated
} | ||
if (classDeclaration && | ||
classDeclaration.leadingComments && | ||
classDeclaration.leadingComments.length && |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
No need for the length check, since some
will handle an empty array just fine.
src/utils/isReactComponentClass.js
Outdated
classDeclaration.leadingComments && | ||
classDeclaration.leadingComments.length && | ||
classDeclaration.leadingComments.some(function (comment) { | ||
return /@extends\s+React\.Component/.test(comment.value); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Indent this line.
src/utils/isReactComponentClass.js
Outdated
if (path.parentPath && path.parentPath.value) { | ||
var classDeclaration; | ||
if (Array.isArray(path.parentPath.value)) { | ||
var matches = path.parentPath.value.filter(function(declaration) { return declaration.type === 'ClassDeclaration' }); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Could use .find
here fwiw, which would let you make this a one liner
var classDeclaration = Array.isArray(path.parentPath.value)
? path.parentPath.value.find(function(declaration) { return declaration.type === 'ClassDeclaration' });
: path.parentPath.value
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Nice! So much cleaner.
src/utils/isReactComponentClass.js
Outdated
classDeclaration = path.parentPath.value; | ||
} | ||
|
||
if (classDeclaration && |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Could tighten this up a bit more:
if (!classDeclaration || !classDeclaration.leadingComments) {
return false;
}
return classDeclaration.leadingComments.some(function (comment) {
return /@extends\s+React\.Component/.test(comment.value);
});
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I don't think we could do this.
if (!classDeclaration || !classDeclaration.leadingComments) {
return false;
}
^ This would cause an early return. We still need to check to see if the component directly extends from React.Component
.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
lgtm, thank you
Certain react components may have multiple layers of inheritance and don't necessarily have a render function if it has a base class that handles rendering. In that case,
react-docgen
would fail to parse the file.This PR:
@extends React.Component
in the class-level JSDoc block