import { field } from '@/plugins/field';
import BmsSearch, { Props } from './BmsSearch.vue';
import { mount } from '@vue/test-utils';
import { nextTick } from 'vue';

const factory = (props: Props) => {
  const wrapper = mount(BmsSearch, { props, global: { plugins: [field] } });
  const inputElement = wrapper.get('input');

  return { wrapper, inputElement };
};

describe('BmsSearch', () => {
  it('should display correct value on init', () => {
    const { inputElement } = factory({
      modelValue: 'toto',
      placeholder: 'placeholderrr',
    });

    expect(inputElement.element.value).toStrictEqual('toto');
    expect(inputElement.element.placeholder).toStrictEqual('placeholderrr');
  });
  it('should react correctly on input', async () => {
    const { wrapper, inputElement } = factory({ modelValue: 'toto' });

    inputElement.setValue('titi');
    await nextTick();
    expect(wrapper.emitted()['update:modelValue'][0]).toStrictEqual(['titi']);
  });

  it('should not update if disabled', async () => {
    const { wrapper, inputElement } = factory({
      modelValue: 'toto',
      disabled: true,
    });

    inputElement.setValue('titi');
    await nextTick();
    expect(wrapper.emitted()['update:modelValue']).toBeUndefined();
  });
});
