/* @vitest-environment jsdom */

import { fireEvent, render, screen } from '@testing-library/react';
import { expect, test, vi } from 'vitest';

import { PlatformDetailTopbar } from './PlatformDetailTopbar';

test('renders pill back action with trailing slot', () => {
  const onBack = vi.fn();

  render(
    <PlatformDetailTopbar
      onBack={onBack}
      className="grid-cols-[auto,minmax(0,1fr),auto]"
      backButtonClassName="px-3"
      trailing={<span>已发布</span>}
    />,
  );

  const button = screen.getByRole('button', { name: '返回' });

  expect(button.className).toContain('platform-button--ghost');
  expect(button.className).toContain('px-3');
  expect(screen.getByText('已发布')).toBeTruthy();

  fireEvent.click(button);

  expect(onBack).toHaveBeenCalledTimes(1);
});

test('renders icon back action and centered title', () => {
  render(
    <PlatformDetailTopbar
      onBack={vi.fn()}
      backVariant="icon"
      backButtonClassName="detail-icon-back"
      title="详情"
      titleClassName="detail-topbar-title"
      trailing={<span className="invisible">占位</span>}
    />,
  );

  const button = screen.getByRole('button', { name: '返回' });
  const title = screen.getByText('详情');

  expect(button.className).toContain('platform-icon-button');
  expect(button.className).toContain('detail-icon-back');
  expect(title.className).toContain('detail-topbar-title');
});