Я пытаюсь запустить угловые тесты, используя карму и жасмин, и получаю следующую ошибку в одном из моих спецификационных файлов.Я вижу, что html-компоненты имеют компонент MessageViewer, на который ссылаются как на дочерний компонент.
Я создал фиктивный компонент для дочернего элемента, но что я должен сделать для свойства input.Как вы можете видеть, свойство input имеет тип MessageViewerModel.MessageViewerModel относится к типу класса. Нужно ли имитировать?
вот так
<div *ngIf="messageViewerModel.messages.length > 0" style="padding-top: 5px;">
<app-message-viewer [messageViewer]="messageViewerModel"></app-message-viewer>
</div>
При выполнении теста я получаю следующую ошибку.
Can't bind to 'messageViewer' since it isn't a known property of 'app-message-viewer'.
1. If 'app-message-viewer' is an Angular component and it has 'messageViewer' input, then verify that it is part of this module.
2. If 'app-message-viewer' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. ("messageViewerModel.messages.length > 0" style="padding-top: 5px;">
<app-message-viewer [ERROR ->][messageViewer]="messageViewerModel"></app-message-viewer>
</div>
</div>
Я пыталсяссылаться на MessageViewerComponent, который в основном является app-message-viewer в spec-файле, но все равно получает вышеуказанную ошибку
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { RouterTestingModule } from '@angular/router/testing';
import { TranslateModule, TranslateLoader } from "@ngx-translate/core";
import { HttpClientModule } from '@angular/common/http';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { AuthService } from '../../../services/auth.service';
import { AlertService, MessageSeverity, DialogType } from '../../../services/alert.service';
import { ConfigurationService } from '../../../services/configuration.service';
import { LocalStoreManager } from '../../../services/local-store-manager.service';
import { AppTitleService } from '../../../services/app-title.service';
import { AppTranslationService, TranslateLanguageLoader } from '../../../services/app-translation.service';
import { NotificationService } from '../../../services/notification.service';
import { NotificationEndpoint } from '../../../services/notification-endpoint.service';
import { EndpointFactory } from '../../../services/endpoint-factory.service';
import { TradeService } from '../../../services/trade/trade.service';
import { TradeEndpoint } from '../../../services/trade/trade-endpoint.service';
import { expand } from 'rxjs/operators';
import { StripOrderComponent } from './strip-order.component';
import { Order } from '../../../models/trade/order/order.model';
import { CurrencyComponent } from '../../../components/shared/currency/currency.component';
import { CurrencyFormatPipe } from '../../../pipes/currency-format/currency-format.pipe';
import { OrderService } from '../../../services/order/order.service';
import { OrderEndpoint } from '../../../services/order/order-endpoint.service';
import { DateService } from '../../../services/dates/dates.service';
import { ValidationService } from '../../../services/validation/validation.service';
import { ValueDateService } from '../../../services/dates/value-date.service';
import { OrderRow } from '../../../models/trade/order/order-row.model';
import { ConfirmModalComponent } from '../../shared/confirm-modal/confirm-modal.component';
import { ModalDirective } from 'ngx-bootstrap/modal';
import { ComponentLoaderFactory } from 'ngx-bootstrap/component-loader';
import { PositioningService } from 'ngx-bootstrap/positioning';
import { MessageViewerComponent } from '../../shared/message-viewer/message-viewer.component';
describe('StripOrderComponent', () => {
let component: StripOrderComponent;
let fixture: ComponentFixture<StripOrderComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [
HttpClientModule,
RouterTestingModule,
FormsModule,
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
useClass: TranslateLanguageLoader
}
})
],
declarations: [
MessageViewerComponent,
StripOrderComponent,
CurrencyComponent,
ConfirmModalComponent,
ModalDirective
],
providers: [
AuthService,
AlertService,
ConfigurationService,
LocalStoreManager,
AppTitleService,
AppTranslationService,
NotificationService,
NotificationEndpoint,
EndpointFactory,
TradeService,
TradeEndpoint,
OrderService,
OrderEndpoint,
CurrencyFormatPipe,
DateService,
ValidationService,
ValueDateService,
ComponentLoaderFactory,
PositioningService
]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(StripOrderComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should be created', () => {
expect(component).toBeTruthy();
});
Компонент MessageViewer
@Component({
selector: 'app-message-viewer',
template: ''
})
class MessageViewerComponent {
@Input messageViewer : MessageViewerModel
}
Класс Mock
class MockMessageViewerModel {
messages: string;
}
@Component({
selector: 'app-message-viewer',
template: ''
})
class MockMessageViewerComponent {
@Input messageViewer : MockMessageViewerModel
}