/* @vitest-environment jsdom */

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

import { PlatformInlineOptionButton } from './PlatformInlineOptionButton';

test('renders shared inline option button chrome', () => {
  const onClick = vi.fn();
  render(
    <PlatformInlineOptionButton
      aria-label="生成比例 1:1"
      className="local-option"
      trailingIcon={<ChevronDown className="h-3 w-3" />}
      onClick={onClick}
    >
      1:1
    </PlatformInlineOptionButton>,
  );

  const button = screen.getByRole('button', { name: '生成比例 1:1' });

  expect(button.className).toContain('platform-inline-option-button');
  expect(button.className).toContain('bg-transparent');
  expect(button.className).toContain('local-option');
  expect(button.textContent).toContain('1:1');

  fireEvent.click(button);

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

test('keeps disabled state and default button type', () => {
  render(
    <PlatformInlineOptionButton aria-label="模型" disabled>
      GPT Image
    </PlatformInlineOptionButton>,
  );

  const button = screen.getByRole('button', { name: '模型' });

  expect(button.getAttribute('type')).toBe('button');
  expect(button).toHaveProperty('disabled', true);
  expect(button.className).toContain('disabled:cursor-not-allowed');
});