import {mount} from '@vue/test-utils';
import {nextTick} from 'vue';

import {describe, expect, it} from 'vitest';

import ChatThinkingBlock from '../ChatThinkingBlock.vue';

describe('ChatThinkingBlock', () => {
  it('keeps local expanded state when the parent does not bind v-model', async () => {
    const wrapper = mount(ChatThinkingBlock, {
      props: {
        content: '思考内容',
        expanded: false,
        status: 'end',
      },
    });

    expect(wrapper.find('.chat-thinking-block__body').exists()).toBe(false);

    await wrapper.find('button').trigger('click');
    await nextTick();

    expect(wrapper.emitted('update:expanded')?.at(-1)).toEqual([true]);
    expect(wrapper.find('.chat-thinking-block__body').exists()).toBe(true);

    await wrapper.find('button').trigger('click');
    await nextTick();

    expect(wrapper.emitted('update:expanded')?.at(-1)).toEqual([false]);
    expect(wrapper.find('.chat-thinking-block__body').exists()).toBe(false);
  });

  it('syncs expanded state from prop changes', async () => {
    const wrapper = mount(ChatThinkingBlock, {
      props: {
        content: '思考内容',
        expanded: true,
        status: 'thinking',
      },
    });

    expect(wrapper.find('.chat-thinking-block__body').exists()).toBe(true);

    await wrapper.setProps({
      expanded: false,
      status: 'end',
    });
    await nextTick();

    expect(wrapper.find('.chat-thinking-block__body').exists()).toBe(false);
    expect(wrapper.classes()).toContain('is-end');
  });

  it('renders the label without a leading indicator dot', () => {
    const wrapper = mount(ChatThinkingBlock, {
      props: {
        content: '思考内容',
        expanded: false,
        status: 'thinking',
      },
    });

    expect(wrapper.find('.chat-event-label').exists()).toBe(true);
    expect(wrapper.find('.chat-shimmer-text').classes()).toContain('is-active');
    expect(wrapper.find('.chat-thinking-block__leading').exists()).toBe(false);
    expect(wrapper.find('.chat-thinking-block__indicator').exists()).toBe(
      false,
    );
  });
});
