import { describe, it, expect } from 'vitest';
import { mount } from '@vue/test-utils';
import ButtonFilled from '@/components/ButtonFilled.vue';

describe('ButtonFilled', () => {
  it('renders button text', () => {
    const wrapper = mount(ButtonFilled, {
      props: { buttonText: 'Save' },
    });
    expect(wrapper.text()).toBe('Save');
  });

  it('has filled background class', () => {
    const wrapper = mount(ButtonFilled, {
      props: { buttonText: 'Save' },
    });
    expect(wrapper.find('button').exists()).toBe(true);
  });

  it('adds ring on mousedown and removes on mouseup', async () => {
    const wrapper = mount(ButtonFilled, {
      props: { buttonText: 'Test' },
    });
    await wrapper.trigger('mousedown');
    expect(wrapper.classes()).toContain('ring');
    await wrapper.trigger('mouseup');
    expect(wrapper.classes()).not.toContain('ring');
  });
});