import React from 'react';
import { shallow } from 'enzyme';
import LinkWithArrow from './link-with-arrow';

describe('<LinkWithArrow />', () => {
  const url = 'www.test.com';

  it('should render the correct default props', () => {
    const component = shallow(<LinkWithArrow href={url} />);
    expect(component.find('a').props().className).toEqual(
      'ds-link-with-arrow ds-link-with-arrow--text-right',
    );
    expect(component.find('span').text()).toEqual('');
  });

  it('should apply the correct classname when passed minor as a prop', () => {
    const component = shallow(<LinkWithArrow href={url} minor />);

    expect(component.find('a').props().className).toEqual(
      'ds-link-with-arrow ds-link-with-arrow--minor ds-link-with-arrow--text-right',
    );
  });

  it('should apply the correct classname when passed serif as a prop', () => {
    const component = shallow(<LinkWithArrow href={url} serif />);

    expect(component.find('a').props().className).toEqual(
      'ds-link-with-arrow ds-link-with-arrow--serif ds-link-with-arrow--text-right',
    );
  });

  it('should apply the correct classname when passed minor and serif as a prop', () => {
    const component = shallow(<LinkWithArrow href={url} serif minor />);

    expect(component.find('a').props().className).toEqual(
      'ds-link-with-arrow ds-link-with-arrow--minor ds-link-with-arrow--serif ds-link-with-arrow--text-right',
    );
  });

  it('should apply the correct classname when passed selected as a prop', () => {
    const component = shallow(<LinkWithArrow href={url} selected />);

    expect(component.find('a').props().className).toEqual(
      'ds-link-with-arrow ds-link-with-arrow--selected ds-link-with-arrow--text-right',
    );
  });

  it('should render the text', () => {
    const component = shallow(<LinkWithArrow href={url} text='test' />);

    expect(component.find('span').text()).toEqual('test');
  });

  it('should render the link', () => {
    const component = shallow(<LinkWithArrow href={url} />);

    expect(component.find('a').props().href).toEqual(url);
  });

  it('should pass onClick functions to the link', () => {
    const fn = () => {};
    const component = shallow(<LinkWithArrow href={url} onClick={fn} />);

    expect(component.find('a').props().onClick).toEqual(fn);
  });

  it('should apply a custom className to the link', () => {
    const component = shallow(
      <LinkWithArrow href={url} className='custom-class' />,
    );

    expect(component.find('a').props().className).toEqual(
      expect.stringContaining('custom-class'),
    );
  });

  it(`should apply the correct classname when passed 'left' as the value of the direction prop`, () => {
    const component = shallow(<LinkWithArrow direction='left' />);

    expect(component.find('a').props().className).toEqual(
      'ds-link-with-arrow ds-link-with-arrow--left ds-link-with-arrow--text-right',
    );
  });

  it(`should apply the correct classname when passed 'left' as the value of the textPosition prop`, () => {
    const component = shallow(<LinkWithArrow textPosition='left' />);

    expect(component.find('a').props().className).toEqual(
      'ds-link-with-arrow ds-link-with-arrow--text-left',
    );
  });

  it(`should apply the correct classname when passed 'right' as the value of the textPosition prop`, () => {
    const component = shallow(<LinkWithArrow textPosition='right' />);

    expect(component.find('a').props().className).toEqual(
      'ds-link-with-arrow ds-link-with-arrow--text-right',
    );
  });
});
