Angular unit testing click event which executes only navigatebyurl & opening matdialog using jasmin & karma

   **1. How to write unit test case for below click event in angular using Jasmin & Karma.**

     onClickCancel(): any {
        this.router.navigateByUrl('login');
      }

**2. How to write unit test case for below click event which open material dialog in angular using Jasmin & Karma. I am new to Angular**

  addNewRole(): any {
    const dialogRef = this.dialog.open(AddNewRoleComponent, {
      width: '450px', disableClose: true
    });
    dialogRef.afterClosed().subscribe(() => {
      this.getRoles();
    });
  }

  editRole(roleData): any {
    const dialogRef = this.dialog.open(AddNewRoleComponent, {
      width: '450px', disableClose: true, data: roleData
    });
    dialogRef.afterClosed().subscribe(() => {
      this.getRoles();
    });
  }

**Below was my approach for unit testing of opening dialog** 

  it('should open the add role component on click of addNewRole', () => {
    component.addNewRole();
    expect(dialog.open.calls.count()).toBe(1);
  });

**Below was my approach for unit testing of opening dialog** 

  it('should open the add role component on click of addNewRole', () => {
    component.addNewRole();
    expect(dialog.open.calls.count()).toBe(1);
  });

My approach of opening dialog works properly for other component test cases. But here - TypeError: Cannot read property 'count' of undefined error is thrown.