1

I am writing a unit test for the method in a component that opens a mat-dialog. Tried writing the following unit test to make sure if the dialog opens. But I am getting an error.

component.ts:

It has the onupload method.

    onUpload(event: FileUpload) {
        this.Service
            .get(event.id)
            .subscribe((data: Data[]) => {
                const dialogRef = this.dialog.open(
                    DialogComponent,
                    {data,}    
                );

                dialogRef.afterClosed().subscribe({
                    next: (Id: string) => {
                        if (Id === null {
                            this.reset();
                        }

unittest.spec.ts:

    describe('open()', () => {
        it('should open the dialog', () => {
            const testCases = [
                {
                    returnValue: 'Successfully opens a dialog',
                    isSuccess: true
                },
                {
                    returnValue: 'cancel',
                    isSuccess: false
                },
            ];

            testCases.forEach(testCase => {
                it(`should open the file upload matDialog `, () => {
                    const returnedVal = {
                        afterClosed: () => of(testCase.returnValue)
                    };
                    spyOn(component, 'reset');
                    spyOn(component['matDialog'], 'open').and.returnValue(returnedVal);
                    component.onUpload(new FileUpload(
                        'fid',
                        'oid',
                    ));

                    if (testCase.isSuccess) {
                        expect(component.reset).toHaveBeenCalled();
                    } else {
                        expect(component.reset).not.toHaveBeenCalled();
                    }

                    expect(component['matDialog'].open).not.toHaveBeenCalled();
                });
            });

I am getting an error " 'mat-grid-tile' is not a known element: 1. If 'mat-grid-tile' is an Angular component, then verify that it is part of this module.". Please help. Thanks.

Bwvolleyball
  • 2,593
  • 2
  • 19
  • 31
Mia
  • 41
  • 2
  • Make sure, you import `MatGridListModule` when configuring the testing module (`TestBed.configureTestingModule`). – uminder Oct 22 '19 at 04:16
  • @uminder imported MatGridListModule. Worked for that error. Now getting "Error: 'it' should only be used in 'describe' function" . Am I writing the test in the correct way (I mean as It is supposed to be in jasmine and also logic wise? – Mia Oct 22 '19 at 13:00
  • Possible duplicate of [MatDialog Service Unit Test Angular 6 Error](https://stackoverflow.com/questions/52993583/matdialog-service-unit-test-angular-6-error) – dmcgrandle Oct 24 '19 at 19:47

1 Answers1

1

"Error: 'it' should only be used in 'describe' function" is related to nested it function. If you remove the enclosing it statement, you should get rid of the error.

describe('open()', () => {
    // it('should open the dialog', () => { // get rid of this
    const testCases = [
    ...
uminder
  • 23,831
  • 5
  • 37
  • 72
  • Solved that issue. Thanks alot. Would you please let me know how to spyon a matdialog element? I am getting an "Error: : could not find an object to spy upon for open()" now. – Mia Oct 22 '19 at 13:44
  • @Mia would you mind upvoting my answer, that at least solved on of your issues? – uminder Oct 23 '19 at 04:05
  • I have no permission for that I think.:( – Mia Oct 28 '19 at 15:44