В модульном тесте для простого создания (инстанцирования) компонента, имеющего зависимость DomSanitizer
, как можно имитировать / заглушить эту зависимость?
Поскольку DomSanitizer
- это класс Abstract
, я понятия не имею, как на самом деле выглядит сигнатура метода bypassSecurityTrustHtml
.
И если он не предназначен для имитации / заглушки DomSanitizer
, как следует приступить к внедрению фактической реализации из абстрактного класса?
фактическая инструкция в компоненте выглядит так:
this.trustedString = <string>this.domSanitizer.bypassSecurityTrustHtml(trustedHTML);
Настройка TestBed
выглядит так:
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [
BrowserModule,
// other modules
],
providers: [
{
provide: DomSanitizer,
useValue: {
bypassSecurityTrustHtml: () => 'safeString'
}
},
// more providers
],
declarations: [ TheComponent ],
schemas: [ NO_ERRORS_SCHEMA ]
})
.compileComponents();
}));
Конкретная ошибка, которую я получаю в Karma в Chrome (не без головы), такова:
TypeError: view.root.sanitizer.sanitize is not a function
error properties: Object({ ngDebugContext: DebugContext_({ view: Object({ def: Object({ factory: Function, nodeFlags: 16793601, rootNodeFlags: 1, nodeMatchedQueries: 0, flags: 0, nodes: [ Object({ nodeIndex: 0, parent: null, renderParent: null, bindingIndex: 0, outputIndex: 0, checkIndex: 0, flags: 1, childFlags: 16793601, directChildFlags: 16777217, childMatchedQueries: 0, matchedQueries: Object({ }), matchedQueryIds: 0, references: Object({ }), ngContentIndex: null, childCount: 5, bindings: [ ], bindingFlags: 0, outputs: [ ], element: Object({ ns: null, name: null, attrs: [ ], template: null, componentProvider: null, componentView: null, componentRendererType: null, publicProviders: null({ }), allProviders: null({ }), handleEvent: Function }), provider: null, text: null, query: null, ngContent: null }), Object({ nodeIndex: 1, parent: Object({ nodeIndex: 0, parent: null, renderParent: null, bindingIndex: 0, outputIndex: 0, checkIndex: 0, flags: 1, childFlags: 16793601, directChildFlags: 16777217 ... at at setElementProperty (webpack:///./node_modules/@angular/core/fesm5/core.js?:8237:61) at checkAndUpdateElementValue (webpack:///./node_modules/@angular/core/fesm5/core.js?:8189:13) at checkAndUpdateElementInline (webpack:///./node_modules/@angular/core/fesm5/core.js?:8136:24) at checkAndUpdateNodeInline (webpack:///./node_modules/@angular/core/fesm5/core.js?:10477:20) at checkAndUpdateNode (webpack:///./node_modules/@angular/core/fesm5/core.js?:10443:16) at debugCheckAndUpdateNode (webpack:///./node_modules/@angular/core/fesm5/core.js?:11076:38) at debugCheckRenderNodeFn (webpack:///./node_modules/@angular/core/fesm5/core.js?:11062:13) at Object.eval [as updateRenderer] (ng:///DynamicTestModule/ConversationMessageComponent.ngfactory.js:84:5) at Object.debugUpdateRenderer [as updateRenderer] (webpack:///./node_modules/@angular/core/fesm5/core.js?:11054:21) at checkAndUpdateView (webpack:///./node_modules/@angular/core/fesm5/core.js?:10430:14)
🤔 А знаете ли вы, что...
Angular предоставляет средства для работы с HTTP-запросами и взаимодействия с внешними API.
В качестве обходного пути попробуйте добавить sanitize: () => 'safeString',
...
useValue: {
sanitize: () => 'safeString',
bypassSecurityTrustHtml: () => 'safeString'
}
...