Angular модульное тестирование - Использование провайдера по сравнению с объектом - PullRequest
Новая
       60

Angular модульное тестирование - Использование провайдера по сравнению с объектом

0 голосов
/ 18 июня 2020

Я пытаюсь провести модульное тестирование своего приложения angular. Я новичок в модульном тестировании с Karma. Я издеваюсь над зависимостями, и здесь возникает проблема. Я читал некоторые документы, в которых обсуждались просто насмешки над ними с помощью объектов. Однако в некоторых случаях это приводит к приведенной ниже ошибке, а не в других. Это почему? Как правильно поступить в приведенной ниже ситуации и почему? Как определить, какой внедренный элемент является проблемой?

Вот файл spe c. 

import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { FuseTranslationLoaderService } from '@fuse/services/translation-loader.service';
import { ProfileComponent } from './profile.component';
import { RouterModule, Routes, ActivatedRoute } from '@angular/router';
import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { CommonModule } from '@angular/common';
import { MatTooltipModule } from '@angular/material/tooltip';
import { MatSnackBar } from '@angular/material/snack-bar';

// The dialog component
import { EditBioDialog } from './edit-dialog/edit-dialog.component';

// Services
import { UserService } from 'app/main/services/user-service.service';
import { AuthService } from 'app/main/services/auth.service';
import { FirebaseService } from 'app/main/services/firebase.service';
import { AngularFireStorage } from '@angular/fire/storage';
import { MarketplaceService } from 'app/main/services/marketplace.service';
import { AngularFirestore, AngularFirestoreDocument } from '@angular/fire/firestore';

import { mockItems } from 'app/main/services/mockItems';





describe('ProfileComponent', () => {
    let component: ProfileComponent;
    let fixture: ComponentFixture<ProfileComponent>;


    // Mock items unique to this page
    let MarketplaceServiceStub : MarketplaceService;
    let UserService : UserService;
    let AuthServiceStub : AuthService;
    let FirebaseServiceStub :FirebaseService;
    let SnackBarStub : MatSnackBar;
    let FuseTrans : FuseTranslationLoaderService;
    let AngularStorageStub : AngularFireStorage;
    let mockDialog : MatDialog;


    // Mock Items pulled from external mock file
    let MockGroup = new mockItems();
    const AngularFireStub = MockGroup.AngularFireStub();
    const mockDialogRef = MockGroup.mockDialogRef();
    //const mockDialog = MockGroup.mockDialog();
    //const mockSnackBar = MockGroup.mockSnackBar();
    const ActivatedRouteStub = MockGroup.ActivatedRouteStub();

    beforeEach(async(() => {
        TestBed.configureTestingModule({
            declarations: [ ProfileComponent ]
        })
        .compileComponents();
    }));

    beforeEach(() => {

        TestBed.configureTestingModule({
            declarations: [ ProfileComponent ],
            providers: [ { provide: FuseTrans },
                         { provide: ActivatedRoute, useValue : ActivatedRouteStub },
                         { provide: MatDialog, useValue : mockDialog },
                         { provide: UserService, useValue : UserService },
                         { provide: AuthService, useValue : AuthServiceStub },
                         { provide: FirebaseService, useValue : FirebaseServiceStub },
                         { provide: MatSnackBar, useValue : SnackBarStub },
                         { provide: AngularFireStorage, useValue : AngularStorageStub } ]

        });

        fixture = TestBed.createComponent(ProfileComponent);
        component = fixture.componentInstance;
        fixture.detectChanges();
    });

    it('should create main profile component', () => {
        expect(component).toBeTruthy();
    });
});

В коде функции из файла MockItems просто возвращают объекты. Это работает для случаев, когда я передаю данные, и, похоже, работает для других случаев.

...