Импорт по угловым тестам

Question

У меня есть угловой проект, и у меня есть компонент для тестирования. Теперь у этого компонента есть submodule.ts, и у проекта есть общий module.ts, а также есть test.module.ts. Пример каждого из них:

submodule.ts, который является модулем общего доступа для некоторых компонентов.

import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { RouterModule } from '@angular/router';

import { OncosupSharedModule } from '../../shared';
import {
    ProtocoloService,
    ProtocoloPopupService,
    ProtocoloComponent,
    ProtocoloDetailComponent,
    ProtocoloDialogComponent, //testing only this componnet
    ProtocoloPopupComponent,
    ProtocoloDeletePopupComponent,
    ProtocoloDeleteDialogComponent,
    protocoloRoute,
    protocoloPopupRoute,
    ProtocoloResolvePagingParams,
} from './';

const ENTITY_STATES = [
    ...protocoloRoute,
    ...protocoloPopupRoute,
];

@NgModule({
    imports: [
        OncosupSharedModule,
        RouterModule.forChild(ENTITY_STATES)
    ],
    declarations: [
        ProtocoloComponent,
        ProtocoloDetailComponent,
        ProtocoloDialogComponent,
        ProtocoloDeleteDialogComponent,
        ProtocoloPopupComponent,
        ProtocoloDeletePopupComponent,
    ],
    entryComponents: [
        ProtocoloComponent,
        ProtocoloDialogComponent,  //I am only testing this componnet
        ProtocoloPopupComponent,
        ProtocoloDeleteDialogComponent,
        ProtocoloDeletePopupComponent,
    ],
    providers: [
        ProtocoloService,
        ProtocoloPopupService,
        ProtocoloResolvePagingParams,
    ],
    schemas: [CUSTOM_ELEMENTS_SCHEMA]

мой general.module.ts для всего проекта

@NgModule({
    imports: [
        BrowserModule,
        OncosupAppRoutingModule,
        Ng2Webstorage.forRoot({ prefix: 'jhi', separator: '-'}),
        OncosupSharedModule,
        OncosupHomeModule,
        OncosupAdminModule,
        OncosupAccountModule,
        OncosupEntityModule,
        FormsModule,
        ReactiveFormsModule,
        // jhipster-needle-angular-add-module JHipster will add new module here
    ],
    declarations: [
        JhiMainComponent,
        NavbarComponent,
        ErrorComponent,
        PageRibbonComponent,
        ActiveMenuDirective,
        FooterComponent
    ],
    providers: [
        ProfileService,
        PaginationConfig,
        UserRouteAccessService,
        {
            provide: HTTP_INTERCEPTORS,
            useClass: AuthExpiredInterceptor,
            multi: true,
            deps: [
                StateStorageService,
                Injector
            ]
        },
        {
            provide: HTTP_INTERCEPTORS,
            useClass: ErrorHandlerInterceptor,
            multi: true,
            deps: [
                JhiEventManager
            ]
        },
        {
            provide: HTTP_INTERCEPTORS,
            useClass: NotificationInterceptor,
            multi: true,
            deps: [
                Injector
            ]
        }
    ],
    bootstrap: [ JhiMainComponent ],
    schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
export class OncosupAppModule {}

И мой test.module только для тестов:

@NgModule({
    providers: [
        DatePipe,
        JhiDataUtils,
        JhiDateUtils,
        JhiParseLinks,
        {
            provide: JhiLanguageService,
            useClass: MockLanguageService
        },
        {
            provide: JhiLanguageHelper,
            useClass: MockLanguageHelper
        },
        {
            provide: JhiEventManager,
            useClass:  MockEventManager
        },
        {
            provide: NgbActiveModal,
            useClass: MockActiveModal
        },
        {
            provide: ActivatedRoute,
            useValue: new MockActivatedRoute({id: 123})
        },
        {
            provide: Router,
            useClass: MockRouter
        },
        {
            provide: Principal,
            useClass: MockPrincipal
        },
        {
            provide: AccountService,
            useClass: MockAccountService
        },
        {
            provide: LoginModalService,
            useValue: null
        },
        {
            provide: ElementRef,
            useValue: null
        },
        {
            provide: Renderer,
            useValue: null
        },
        {
            provide: JhiAlertService,
            useValue: null
        },
        {
            provide: NgbModal,
            useValue: null
        },
    ],
    imports: [HttpClientTestingModule, FormsModule, ReactiveFormsModule, RouterModule, RouterTestingModule ],
    schemas: [
        CUSTOM_ELEMENTS_SCHEMA
    ]
})

Теперь я хочу протестировать только один из композитов, который использует submodule.ts. Поставщики, схемы и импорт могут быть импортированы, но, например, entryComponents дают ошибки. Мне было интересно, есть ли какое-либо правило о том, что должно быть импортировано и из какого модуля ??

Answer 1

В вашем подкомпоненте импортируйте только те модули, которые вы используете.

если вы импортируете свои большие модули, вы импортируете каждый объявленный в нем модуль, а также каждый компонент, поставщик, директиву, канал (и т. Д.), Которые в нем находятся . Представьте себе время, чтобы высмеивать все это ...

Для entryComponents существует специальный синтаксис. Я нашел его в модальном тесте Angualr Material, и, честно говоря, я не хочу сейчас искать источник, поэтому вам придется поверить мне на слово:

TestBed
  .configureTestingModule(...)
  .overrideModule(BrowserDynamicTestingModule, { set: { entryComponents: [UploadModalComponent] } })