Repository: facebook/react
File: packages/react-devtools-shared/src/backend/fiber/renderer.js (JavaScript)

Code before:
      // TODO: We won't have any information here if the child is filtered.
      return null;
    }

    // If we have the debug stack (the creation stack of the JSX) for any owned child of this
    // component, then at the bottom of that stack will be a stack frame that is somewhere within
    // the component's function body. Typically it would be the callsite of the JSX unless there's
    // any intermediate utility functions. This won't point to the top of the component function
    // but it's at least somewhere within it.
    if (isError(unresolvedSource)) {
      return (instance.source = parseSourceFromOwnerStack(
        (unresolvedSource: any),
      ));
    }
    if (typeof unresolvedSource === 'string') {
      const idx = unresolvedSource.lastIndexOf('\n');
      const lastLine =
        idx === -1 ? unresolvedSource : unresolvedSource.slice(idx + 1);
      return (instance.source = parseSourceFromComponentStack(lastLine));
    }

    // $FlowFixMe: refined.
    return unresolvedSource;
  }

  function internal_only_getComponentTree(): string {
    let treeString = '';

    function buildTreeString(
      instance: DevToolsInstance,
      prefix: string = '',
      isLastChild: boolean = true,
    ): void {
      if (!instance) return;

      const name =
        (instance.kind !== VIRTUAL_INSTANCE
          ? getDisplayNameForFiber(instance.data)
          : instance.data.name) || 'Unknown';

      const id = instance.id !== undefined ? instance.id : 'unknown';

      if (name !== 'createRoot()') {
        treeString +=
          prefix +
          (isLastChild ? '└── ' : '├── ') +
          name +
          ' (id: ' +
          id +
          ')\n';
      }

Review comment (suggestion):
```suggestion
  function __internal_only_getComponentTree(): string {
```

Code after:
      // TODO: We won't have any information here if the child is filtered.
      return null;
    }

    // If we have the debug stack (the creation stack of the JSX) for any owned child of this
    // component, then at the bottom of that stack will be a stack frame that is somewhere within
    // the component's function body. Typically it would be the callsite of the JSX unless there's
    // any intermediate utility functions. This won't point to the top of the component function
    // but it's at least somewhere within it.
    if (isError(unresolvedSource)) {
      return (instance.source = parseSourceFromOwnerStack(
        (unresolvedSource: any),
      ));
    }
    if (typeof unresolvedSource === 'string') {
      const idx = unresolvedSource.lastIndexOf('\n');
      const lastLine =
        idx === -1 ? unresolvedSource : unresolvedSource.slice(idx + 1);
      return (instance.source = parseSourceFromComponentStack(lastLine));
    }

    // $FlowFixMe: refined.
    return unresolvedSource;
  }

  type InternalMcpFunctions = {
    __internal_only_getComponentTree?: Function,
  };

  const internalMcpFunctions: InternalMcpFunctions = {};
  if (__IS_INTERNAL_MCP_BUILD__) {
    // eslint-disable-next-line no-inner-declarations
    function __internal_only_getComponentTree(): string {
      let treeString = '';

      function buildTreeString(
        instance: DevToolsInstance,
        prefix: string = '',
        isLastChild: boolean = true,
      ): void {
        if (!instance) return;

        const name =
          (instance.kind !== VIRTUAL_INSTANCE
            ? getDisplayNameForFiber(instance.data)
            : instance.data.name) || 'Unknown';

        const id = instance.id !== undefined ? instance.id : 'unknown';

        if (name !== 'createRoot()') {
          treeString +=