[object Object] displayName for React.forwardRef components

[g12i]

React.forwardRef creates an object with a rendering function moved to a .render property (see here).

function forwardRef(render) {
  return {
     $$typeof: REACT_FORWARD_REF_TYPE,
    render,
  };
}

I'd suggest to use react-is package and copy logic from React's shared/getComponentNameFromType.js

import { isForwardRef } from "react-is";

function getWrappedName(
  outerType: mixed,
  innerType: any,
): string {
  const displayName = (outerType: any).displayName;
  if (displayName) {
    return displayName;
  }
  return innerType.displayName || innerType.name || 'No Display Name';
}


const getReactElementDisplayName = (element: mixed): string => {
  if (isForwardRef(element)) {
    return getWrappedName(element, (element as any).type);
  }
  // .. .etc
};

[armandabric]

This should be fixed by #617. Let me know if this is not the case. Meanwhile I'm closing this issue.