fix: handle circular TypeScript types (#1140)

Author: danez

.changeset/fuzzy-tools-smile.md

@@ -0,0 +1,7 @@
+---
+'react-docgen': patch
+---
+
+Prevent stack overflows caused by circular interface inheritance and type
+aliases. Thanks [@router0mail](https://github.com/router0mail) for reporting
+this issue.

packages/react-docgen/src/handlers/__tests__/codeTypeHandler-test.ts

@@ -249,6 +249,20 @@ describe('codeTypeHandler', () => {
     expect(documentation.descriptors).toMatchSnapshot();
   });
 
+  test('handles circular interface inheritance', () => {
+    const definition = parseTypescript
+      .statement(
+        `(props: A) => null;
+         interface A extends B { a: number }
+         interface B extends A { b: number }`,
+      )
+      .get('expression') as NodePath<ArrowFunctionExpression>;
+
+    codeTypeHandler(documentation, definition);
+
+    expect(Object.keys(documentation.descriptors)).toEqual(['b', 'a']);
+  });
+
   test('does support utility types inline', () => {
     const definition = parse
       .statement(

packages/react-docgen/src/utils/__tests__/resolveGenericTypeAnnotations-test.ts

@@ -20,4 +20,23 @@ describe('resolveGenericTypeAnnotation', () => {
       ),
     ).toMatchSnapshot();
   });
+
+  test('does not resolve circular type aliases', () => {
+    const code = `
+      type Foo<T> = Bar<T>;
+      type Bar<T> = Foo<T>;
+      var x: Foo<string>;
+    `;
+
+    expect(
+      resolveGenericTypeAnnotation(
+        parse
+          .statement(code, -1)
+          .get('declarations')[0]
+          .get('id')
+          .get('typeAnnotation')
+          .get('typeAnnotation'),
+      ),
+    ).toBeUndefined();
+  });
 });

packages/react-docgen/src/utils/getTypeFromReactComponent.ts

@@ -158,7 +158,11 @@ export function applyToTypeProperties(
   path: NodePath,
   callback: (propertyPath: NodePath, params: TypeParameters | null) => void,
   typeParams: TypeParameters | null,
+  visited = new WeakSet<object>(),
 ): void {
+  if (visited.has(path.node)) return;
+  visited.add(path.node);
+
   if (path.isObjectTypeAnnotation()) {
     path
       .get('properties')
@@ -168,14 +172,14 @@ export function applyToTypeProperties(
       .get('members')
       .forEach((propertyPath) => callback(propertyPath, typeParams));
   } else if (path.isInterfaceDeclaration()) {
-    applyExtends(documentation, path, callback, typeParams);
+    applyExtends(documentation, path, callback, typeParams, visited);
 
     path
       .get('body')
       .get('properties')
       .forEach((propertyPath) => callback(propertyPath, typeParams));
   } else if (path.isTSInterfaceDeclaration()) {
-    applyExtends(documentation, path, callback, typeParams);
+    applyExtends(documentation, path, callback, typeParams, visited);
 
     path
       .get('body')
@@ -187,15 +191,27 @@ export function applyToTypeProperties(
   ) {
     (path.get('types') as Array<NodePath<FlowType | TSType>>).forEach(
       (typesPath) =>
-        applyToTypeProperties(documentation, typesPath, callback, typeParams),
+        applyToTypeProperties(
+          documentation,
+          typesPath,
+          callback,
+          typeParams,
+          visited,
+        ),
     );
   } else if (!path.isUnionTypeAnnotation()) {
     // The react-docgen output format does not currently allow
     // for the expression of union types
     const typePath = resolveGenericTypeAnnotation(path);
 
     if (typePath) {
-      applyToTypeProperties(documentation, typePath, callback, typeParams);
+      applyToTypeProperties(
+        documentation,
+        typePath,
+        callback,
+        typeParams,
+        visited,
+      );
     }
   }
 }
@@ -205,6 +221,7 @@ function applyExtends(
   path: NodePath<InterfaceDeclaration | TSInterfaceDeclaration>,
   callback: (propertyPath: NodePath, params: TypeParameters | null) => void,
   typeParams: TypeParameters | null,
+  visited: WeakSet<object>,
 ): void {
   const classExtends = path.get('extends');
 
@@ -238,6 +255,7 @@ function applyExtends(
           resolvedPath,
           callback,
           typeParams,
+          visited,
         );
       } else {
         const idPath = getTypeIdentifier(extendsPath);

packages/react-docgen/src/utils/resolveGenericTypeAnnotation.ts

@@ -4,20 +4,28 @@ import resolveToValue from '../utils/resolveToValue.js';
 import { unwrapUtilityType } from './flowUtilityTypes.js';
 import getTypeIdentifier from './getTypeIdentifier.js';
 
-function tryResolveGenericTypeAnnotation(path: NodePath): NodePath | undefined {
+function tryResolveGenericTypeAnnotation(
+  path: NodePath,
+  seen = new WeakSet<object>(),
+): NodePath | undefined {
   let typePath = unwrapUtilityType(path);
   const idPath = getTypeIdentifier(typePath);
 
   if (idPath) {
     typePath = resolveToValue(idPath);
-    if (isUnreachableFlowType(typePath)) {
+    if (isUnreachableFlowType(typePath) || seen.has(typePath.node)) {
       return;
     }
 
+    seen.add(typePath.node);
+
     if (typePath.isTypeAlias()) {
-      return tryResolveGenericTypeAnnotation(typePath.get('right'));
+      return tryResolveGenericTypeAnnotation(typePath.get('right'), seen);
     } else if (typePath.isTSTypeAliasDeclaration()) {
-      return tryResolveGenericTypeAnnotation(typePath.get('typeAnnotation'));
+      return tryResolveGenericTypeAnnotation(
+        typePath.get('typeAnnotation'),
+        seen,
+      );
     }
 
     return typePath;