在已有的單元測試代碼，加了這個div標簽之后就報錯了：

報錯：this.service.findFirstFocusable is not a function:

at FocusDirective.get (http://localhost:9876/karma_webpack/src/layout/a11y/keyboard-focus/autofocus/auto-focus.directive.ts:91:25)

從調(diào)用棧能看出，FocusDirective實例調(diào)用get時，會將控制轉(zhuǎn)角給this.service的findFirstFocusable方法：

解決方法：

添加dummy方法：

通過下列代碼拿到Angular Test Bed，ATB注入好的Service：

待測試的Component源代碼：

@Component({selector: 'cx-host',template: ` <div id="a" cxFocus></div><div id="b" [cxFocus]="{autofocus: ':host'}"></div> `, }) class MockComponent {}

單元測試代碼：

it('should focus itself', () => {let service: KeyboardFocusService;service = TestBed.inject(KeyboardFocusService);const host = fixture.debugElement.query(By.css('#b'));const el = host.nativeElement;spyOn(service, 'findFirstFocusable').and.returnValue(el);spyOn(el, 'focus').and.callThrough();fixture.detectChanges();const event = {preventDefault: () => {},stopPropagation: () => {},};host.triggerEventHandler('focus', event);expect(el.focus).toHaveBeenCalled();expect(service.findFirstFocusable).toHaveBeenCalled();});

測試結(jié)果：

更多Jerry的原創(chuàng)文章，盡在：“汪子熙”:

總結(jié)

以上是生活随笔為你收集整理的自己动手开发SAP Spartacus focus Directive的单元测试的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。