it('onclickSelect username',  () =>{
    const spy = spyOn(component, "onClickSelect");

    const inputForm = fixture.debugElement.query(By.css('#username-input'));
    const mockClickEvent = new MouseEvent('click');
    inputForm.nativeElement.dispatchEvent(mockClickEvent);

    expect(spy).toHaveBeenCalledWith(mockClickEvent);
  });

  it('onclickSelect password',  () =>{
    const spy = spyOn(component, "onClickSelect").and.callThrough();

    const inputForm = fixture.debugElement.query(By.css('#password-input'));
    const mockClickEvent = new MouseEvent('click');
    inputForm.nativeElement.dispatchEvent(mockClickEvent);

    expect(spy).toHaveBeenCalledWith(mockClickEvent);
  });

  it('onclickSelect username real deal',  () =>{
    const inputForm = fixture.debugElement.query(By.css('#username-input'));
    const mockClickEvent = new MouseEvent('click', {relatedTarget: new EventTarget()});

    component.onClickSelect(mockClickEvent);

    expect(inputForm.nativeElement.isSelected).toBe(true);
  });

  it('onclickSelect password real deal',  () =>{
    const inputForm = fixture.debugElement.query(By.css('#password-input'));
    const mockClickEvent = new MouseEvent('click', {relatedTarget: new EventTarget()});

    component.onClickSelect(mockClickEvent);

    expect(inputForm.nativeElement.isSelected).toBe(true);
  });