DocSpace-buildtools/web/ASC.Web.Components/src/components/password-input/password-input.test.js

import React from 'react';
import { mount, shallow } from 'enzyme';
import PasswordInput from '.';

const basePasswordSettings = {
  minLength: 6,
  upperCase: false,
  digits: false,
  specSymbols: false
};

const baseProps = {
  inputName: 'demoPasswordInput',
  emailInputName: 'demoEmailInput',
  inputValue: '',
  clipActionResource: 'Copy e-mail and password',
  clipEmailResource: 'E-mail: ',
  clipPasswordResource: 'Password: ',
  tooltipPasswordTitle: 'Password must contain:',
  tooltipPasswordLength: 'from 6 to 30 characters',
  tooltipPasswordDigits: 'digits',
  tooltipPasswordCapital: 'capital letters',
  tooltipPasswordSpecial: 'special characters (!@#$%^&*)',
  generatorSpecial: '!@#$%^&*',
  passwordSettings: basePasswordSettings,
  isDisabled: false,
  placeholder: 'password',
  onChange: () => jest.fn(),
  onValidateInput: () => jest.fn(),
  onCopyToClipboard: () => jest.fn()
}

describe('<PasswordInput />', () => {
  it('renders without error', () => {
    const wrapper = mount(<PasswordInput {...baseProps} />);

    expect(wrapper).toExist();
  });

  it('render password input', () => {
    const wrapper = mount(<PasswordInput {...baseProps} />);

    expect(wrapper.find('input').prop('type')).toEqual('password');
  });

  it('have an HTML name', () => {
    const wrapper = mount(<PasswordInput {...baseProps} />);

    expect(wrapper.find('input').prop('name')).toEqual('demoPasswordInput');
  });

  it('forward passed value', () => {
    const wrapper = mount(<PasswordInput {...baseProps} inputValue='demo' />);

    expect(wrapper.props().inputValue).toEqual('demo');
  });

  it('call onChange when changing value', () => {
    const onChange = jest.fn(event => {
      expect(event.target.id).toEqual('demoPasswordInput');
      expect(event.target.name).toEqual('demoPasswordInput');
      expect(event.target.value).toEqual('demo');
    });

    const wrapper = mount(<PasswordInput {...baseProps} id="demoPasswordInput" name="demoPasswordInput" onChange={onChange} />);

    const event = { target: { value: "demo" } };

    wrapper.simulate('change', event);
  });

  it('call onFocus when input is focused', () => {
    const onFocus = jest.fn(event => {
      expect(event.target.id).toEqual('demoPasswordInput');
      expect(event.target.name).toEqual('demoPasswordInput');
    });

    const wrapper = mount(<PasswordInput {...baseProps} id="demoPasswordInput" name="demoPasswordInput" onFocus={onFocus} />);

    wrapper.simulate('focus');
  });

  it('call onBlur when input loses focus', () => {
    const onBlur = jest.fn(event => {
      expect(event.target.id).toEqual('demoPasswordInput');
      expect(event.target.name).toEqual('demoPasswordInput');
    });

    const wrapper = mount(<PasswordInput {...baseProps} id="demoPasswordInput" name="demoPasswordInput" onBlur={onBlur} />);

    wrapper.simulate('blur');
  });

  it('disabled when isDisabled is passed', () => {
    const wrapper = mount(<PasswordInput {...baseProps} isDisabled={true} />);

    expect(wrapper.prop('isDisabled')).toEqual(true);
  });

  it('not re-render test', () => {
    const wrapper = shallow(<PasswordInput {...baseProps} />).instance();

    const shouldUpdate = wrapper.shouldComponentUpdate(wrapper.props, wrapper.state);

    expect(shouldUpdate).toBe(false);
  });

  it('re-render test', () => {
    const wrapper = shallow(<PasswordInput {...baseProps} />).instance();

    const shouldUpdate = wrapper.shouldComponentUpdate({
      inputName: 'demoPasswordInput',
      emailInputName: 'demoEmailInput',
      inputValue: '',
      clipActionResource: 'Copy e-mail and password',
      clipEmailResource: 'E-mail: ',
      clipPasswordResource: 'Password: ',
      tooltipPasswordTitle: 'Password must contain:',
      tooltipPasswordLength: 'from 6 to 30 characters',
      tooltipPasswordDigits: 'digits',
      tooltipPasswordCapital: 'capital letters',
      tooltipPasswordSpecial: 'special characters (!@#$%^&*)',
      generatorSpecial: '!@#$%^&*',
      passwordSettings: {
        minLength: 8,
        upperCase: false,
        digits: false,
        specSymbols: false
      },
      isDisabled: false,
      placeholder: 'password',
      onChange: () => jest.fn(),
      onValidateInput: () => jest.fn(),
      onCopyToClipboard: () => jest.fn()
    }, wrapper.state);

    expect(shouldUpdate).toBe(true);
  });

  it('generate password with props: 10 , false , false , false', () => {
    const newPasswordSettings = {
      minLength: 10,
      upperCase: false,
      digits: false,
      specSymbols: false
    };

    const wrapper = shallow(<PasswordInput {...baseProps} passwordSettings={newPasswordSettings} />);
    const instance = wrapper.instance();

    instance.onGeneratePassword();

    expect(wrapper.state('type')).toBe('text');
    expect(wrapper.state('progressWidth')).toBe(100);
  });

  it('generate password with props: 10 , true , false , false', () => {
    const newPasswordSettings = {
      minLength: 10,
      upperCase: true,
      digits: false,
      specSymbols: false
    };

    const wrapper = shallow(<PasswordInput {...baseProps} passwordSettings={newPasswordSettings} />);
    const instance = wrapper.instance();

    instance.onGeneratePassword();

    expect(wrapper.state('type')).toBe('text');
    expect(wrapper.state('progressWidth')).toBe(100);
  });

  it('generate password with props: 10 , true , true , false', () => {
    const newPasswordSettings = {
      minLength: 10,
      upperCase: true,
      digits: true,
      specSymbols: false
    };

    const wrapper = shallow(<PasswordInput {...baseProps} passwordSettings={newPasswordSettings} />);
    const instance = wrapper.instance();

    instance.onGeneratePassword();

    expect(wrapper.state('type')).toBe('text');
    expect(wrapper.state('progressWidth')).toBe(100);
  });

  it('generate password with props: 10 , true , true , true', () => {
    const newPasswordSettings = {
      minLength: 10,
      upperCase: true,
      digits: true,
      specSymbols: true
    };

    const wrapper = shallow(<PasswordInput {...baseProps} passwordSettings={newPasswordSettings} />);
    const instance = wrapper.instance();

    instance.onGeneratePassword();

    expect(wrapper.state('type')).toBe('text');
    expect(wrapper.state('progressWidth')).toBe(100);
  });
});