// @flow
import React from 'react';
import { mountWrappedComponent, renderSnapshot } from '../../../../utils/tests';

import type { TertiaryButtonProps } from './tertiary-button.proptypes';
import { TertiaryButton } from './index';

const DEFAULT_PROPS: TertiaryButtonProps = {
  disabled: false,
  hideBorder: false,
};

const ACTUAL_BUTTON_PROPS: TertiaryButtonProps = {
  ...DEFAULT_PROPS,
  type: 'button',
  onClick: () => {},
};

const LINK_BUTTON_PROPS: TertiaryButtonProps = {
  ...DEFAULT_PROPS,
  href: 'https://google.com',
};

describe('TertiaryButton', () => {
  describe('snapshot', () => {
    it('matches the previous snapshot', () => {
      const tertiaryButton = renderSnapshot(
        <TertiaryButton {...DEFAULT_PROPS} />,
      );

      expect(tertiaryButton).toMatchSnapshot();
    });
  });
  it('renders a button element if given an onClick', () => {
    const button = mountWrappedComponent(
      <TertiaryButton {...ACTUAL_BUTTON_PROPS} />,
    );
    expect(button.exists('button')).toBe(true);
    expect(button.exists('a')).toBe(false);
  });

  it('renders an anchor element if given an href', () => {
    const button = mountWrappedComponent(
      <TertiaryButton {...LINK_BUTTON_PROPS} />,
    );
    expect(button.exists('button')).toBe(false);
    expect(button.exists('a')).toBe(true);
  });
});
