import React from 'react';
import { mount } from 'enzyme';
import Navigation from './Navigation';

describe('Navigation', () => {
  it('should match the snapshot', () => {
    const component = mount(<Navigation />);
    expect(component.getElement()).toMatchSnapshot();
  });

  describe('Navigation passing custom logo', () => {
    it('should pass a custom logo to Logo Link', () => {
      const component = mount(<Navigation customLogo="https://doodle.com/graphics/mails0/doodleLogo.png" />);
      expect(component.find('LogoLink').props().logoUrl).toBe('https://doodle.com/graphics/mails0/doodleLogo.png');
    });

    it('should show Doodle logo if customLogo is not passed', () => {
      const component = mount(<Navigation />);
      expect(component.find('DoodleLogo').length).toBe(1);
    });
  });

  describe('Navigation redirects', () => {
    const userProp = {
      data: {
        name: 'Tom Tom',
        email: 'tom@example.com',
        avatarSmallUrl:
          'https://6a5edc300520d4037dd6-0732807511066685711db213ddc1d2df.ssl.cf2.rackcdn.com/snw8ceng29ch3zbs4pvro3t2jxswf8yk',
        accessToken: 'abc123',
      },
      loading: false,
      isEligibleForFreeTrial: true,
    };

    it('should call the function passed into onClickLogin', () => {
      const mockFunction = jest.fn();
      const component = mount(<Navigation onClickLogin={mockFunction} />);
      const loginButton = component.find('.HeaderWidget > .HeaderWidget-loginButton');
      loginButton.simulate('click');
      expect(mockFunction).toHaveBeenCalled();
    });

    it('should call the function passed into onClickSignup', () => {
      const mockFunction = jest.fn();
      const component = mount(<Navigation onClickSignup={mockFunction} />);
      const signupButton = component.find('.HeaderWidget > .HeaderWidget-signupButton');
      signupButton.simulate('click');
      expect(mockFunction).toHaveBeenCalled();
    });

    it('should call the function passed into onClickLogout', () => {
      const mockFunction = jest.fn();
      const component = mount(<Navigation onClickLogout={mockFunction} user={userProp} />);
      const userMenu = component.find('.UserMenu span.Button');
      userMenu.simulate('click');

      const logoutButton = component.find('span.Menu-item');
      logoutButton.simulate('click');
      expect(mockFunction).toHaveBeenCalled();
    });
  });
});