// @vitest-environment jsdom

import { act } from 'react';
import { createRoot } from 'react-dom/client';
import { afterEach, describe, expect, it } from 'vitest';

import { TreeRoot } from '../TreeRoot';

(globalThis as Record<string, unknown>).IS_REACT_ACT_ENVIRONMENT = true;

describe('TreeRoot empty semantics', () => {
  const mounted: Array<ReturnType<typeof createRoot>> = [];

  afterEach(() => {
    act(() => mounted.splice(0).forEach((root) => root.unmount()));
  });

  it('announces the empty state without exposing an invalid empty tree', () => {
    const container = document.createElement('div');
    const root = createRoot(container);
    mounted.push(root);

    act(() => {
      root.render(
        <TreeRoot<{ name: string }>
          data={[]}
          getItemName={(node) => node.data.name}
        />,
      );
    });

    expect(container.querySelector('[role="tree"]')).toBeNull();
    expect(container.querySelector('[data-tree-root]')?.hasAttribute('tabindex')).toBe(false);
    expect(container.querySelector('[role="status"]')?.textContent).toBe('Nothing to show');
  });
});
