import { describe, it, expect } from 'vitest';
import { render, screen } from '@testing-library/react';
import ModuleInfo from './module-info';

const labels = {
  emptyMessage: '未選択',
  globalLabel: 'グローバル',
  duplicateLabel: '複製',
  settingsLabel: '設定',
  selectLabel: '反映',
  previewLabel: 'プレビュー',
  previewScaleLabel: '75%',
  defaultTpl: 'default.html',
};

const module = {
  mid: 1,
  moduleID: 'js-module_1',
  module: 'Entry_Summary',
  name: 'テストモジュール',
  template: 'summary.html',
  scope: 'local',
  preview: '<p>preview</p>',
  tpl_list: [
    { tpl: 'default.html', label: 'デフォルト', selected: '1' },
    { tpl: 'other.html', label: 'その他' },
  ],
};

describe('ModuleInfo', () => {
  it('複製・設定・反映ボタンが acms-admin-btn-admin 系クラスのまま描画される', () => {
    render(<ModuleInfo module={module} labels={labels} />);

    const duplicateButton = screen.getByRole('button', { name: labels.duplicateLabel });
    expect(duplicateButton).toHaveClass('js-acms_layout_dup_module', 'acms-admin-btn-admin');

    const settingsButton = screen.getByRole('button', { name: labels.settingsLabel });
    expect(settingsButton).toHaveClass('js-acms_layout_edit_module', 'acms-admin-btn-admin');

    const submitButton = screen.getByRole('button', { name: labels.selectLabel });
    expect(submitButton).toHaveClass('acms-admin-btn-admin', 'acms-admin-btn-admin-primary');
    expect(submitButton).toHaveAttribute('type', 'submit');
  });

  it('テンプレート選択の select が data 属性・選択状態を保ったまま描画される', () => {
    render(<ModuleInfo module={module} labels={labels} />);

    const select = screen.getByRole('combobox') as HTMLSelectElement;
    expect(select).toHaveClass('js-acms_layout_select_template', 'js-select2');
    expect(select).toHaveAttribute('data-mid', '1');
    expect(select).toHaveAttribute('data-default-tpl', labels.defaultTpl);
    expect(select).toHaveAttribute('form', 'module-template-form');
    expect(select.value).toBe('default.html');
    expect(screen.getAllByRole('option')).toHaveLength(2);
  });

  it('mid が空の場合は空メッセージのみ表示する', () => {
    render(<ModuleInfo module={{ ...module, mid: '' }} labels={labels} />);

    expect(screen.getByText(labels.emptyMessage)).toBeInTheDocument();
    expect(screen.queryByRole('combobox')).not.toBeInTheDocument();
  });
});
