import React from 'react';
import { shallow } from 'enzyme';
import Option from '../../MultiEmailSelect/Option';

describe('MultiEmailSelect Option', () => {
  let component;
  const selectProps = {
    alreadyInListText: 'already in list',
    addDomainText: 'Add entire domain or subdomain',
    newOptionText: 'just use',
  };
  let data = {};

  it('matches a snapshot', () => {
    component = shallow(
      <Option label="Test User" value="test@test.de" isDisabled={false} selectProps={selectProps} data={data} />
    );
    expect(component.getElement()).toMatchSnapshot();
  });

  it('it shows the addDomainText if the input value is a domain', () => {
    component = shallow(
      <Option label="Test User" value="@test.de" isDisabled={false} selectProps={selectProps} data={data} />
    );
    expect(component.find('.MultiEmailSelect__option-label').text()).toBe('Add entire domain or subdomain');
  });

  it('it shows the newOptionText if the input value is a new option', () => {
    data = {
      __isNew__: true,
    };
    component = shallow(
      <Option label="Test User" value="test@test.de" isDisabled={false} selectProps={selectProps} data={data} />
    );
    expect(component.contains(' just use ')).toBe(true);
  });

  it('it shows the alreadyInListText if the input value is already in the selected list', () => {
    data = {
      __isNew__: false,
    };
    component = shallow(
      <Option label="Test User" value="test@test.de" isDisabled selectProps={selectProps} data={data} />
    );
    expect(component.contains(' already in list')).toBe(true);
  });
});