How to mock formControl value getTime() in unit tests

Question

I am trying to unit test a formControl's getTime(). I am getting an error

.getTime is not a function.

A snippet of the component file looks like:

import {FormControl} from @angular/forms;
@component({ 
  selector: 'lorem-ipsum',
  templateUrl: './lorem-ipsum.html'
})

export class LoremIpsumComponent implements OnInIt {
  .....
  ...
  ..
  .
  magazineSubscriptionFrom = new FormControl({value: '', disabled: true});
  magazineSubscriptionTo = new FormControl({value: '', disabled: true});

  constructor (
    ....
  ) {}

  ngOnInit() {}

  verifySubscription() {
    let test1 = this.magazineSubscriptionFrom.value.getTime();
    ...
    ..
    .
  }

Answer 1

The reason for your error is that the initial value of magazineSubscriptionFrom is '' since your are setting it in your constructor using line:

magazineSubscriptionFrom = new FormControl({value: '', disabled: true});

When you try to call getTime() on it, it will give you the error because getTime() is a function for Date. So you need a Date value in in your form control. You also need to convert the string value of your form control to Date in order for getTime() to work

You need to change line:

let test1 = this.magazineSubscriptionFrom.value.getTime();

to

let test1 = new Date(this.magazineSubscriptionFrom.value).getTime();

Now in your test you need to set the valid date using setValue

It is as below : It(‘should verifySubscription , () => { 
  Component.magazineSubscription.setValue(new Date()); <- set valid date here
  
  fixture.DetectChanges(); 
  
  Component.verifySubscription();
  Expect(somevalue in verifySubscription fn).toBeTruthy;
}

Also change it for magazineSubscriptionTo control.