fix: handle docblock on out-of-line forwardRef

src/handlers/__tests__/componentDocblockHandler-test.js

@@ -19,6 +19,11 @@ describe('componentDocblockHandler', () => {
  return programPath.get('body', programPath.node.body.length - 1);
  }
 
+ function beforeLastStatement(src) {
+ const programPath = parse(src);
+ return programPath.get('body', programPath.node.body.length - 2);
+ }
+
  beforeEach(() => {
  documentation = new (require('../../Documentation'))();
  componentDocblockHandler = require('../componentDocblockHandler').default;
@@ -228,4 +233,27 @@ describe('componentDocblockHandler', () => {
  });
  });
  });
+
+ describe('forwardRef', () => {
+ describe('inline implementation', () => {
+ test(
+ [
+ 'React.forwardRef((props, ref) => {});',
+ 'import React from "react";',
+ ].join('\n'),
+ src => beforeLastStatement(src).get('expression'),
+ );
+ });
+
+ describe('out of line implementation', () => {
+ test(
+ [
+ 'let Component = (props, ref) => {};',
+ 'React.forwardRef(Component);',
+ 'import React from "react";',
+ ].join('\n'),
+ src => beforeLastStatement(src).get('expression'),
+ );
+ });
+ });
 });

src/handlers/componentDocblockHandler.js

@@ -10,19 +10,15 @@
 import { namedTypes as t } from 'ast-types';
 import type Documentation from '../Documentation';
 import { getDocblock } from '../utils/docblock';
+import isReactForwardRefCall from '../utils/isReactForwardRefCall';
+import resolveToValue from '../utils/resolveToValue';
 
 function isClassDefinition(nodePath) {
  const node = nodePath.node;
  return t.ClassDeclaration.check(node) || t.ClassExpression.check(node);
 }
 
-/**
- * Finds the nearest block comment before the component definition.
- */
-export default function componentDocblockHandler(
- documentation: Documentation,
- path: NodePath,
-) {
+function getDocblockFromComponent(path) {
  let description = null;
 
  if (isClassDefinition(path)) {
@@ -52,5 +48,21 @@ export default function componentDocblockHandler(
  description = getDocblock(searchPath);
  }
  }
- documentation.set('description', description || '');
+ if (!description && isReactForwardRefCall(path)) {
+ const inner = resolveToValue(path.get('arguments', 0));
+ if (inner.node !== path.node) {
+ return getDocblockFromComponent(inner);
+ }
+ }
+ return description;
+}
+
+/**
+ * Finds the nearest block comment before the component definition.
+ */
+export default function componentDocblockHandler(
+ documentation: Documentation,
+ path: NodePath,
+) {
+ documentation.set('description', getDocblockFromComponent(path) || '');
 }