アングル4のユニットテストで要素がフォーカスされているかどうかを確認するにはどうすればよいですか？

Question

私はユニットテストに以下の機能を持っています。私はコンポーネント内のビューの子を持つテキストボックスである要素を取得し、テストでは、setTimeout()が呼び出された後に、テキストボックスにフォーカスがあるかどうかをテストする必要があります。ここで

@ViewChild('searchInput') searchInput: ElementRef; 
function A(show) { 
     const self = this; 
     if (show) { 
      this.xyz= true; 
      setTimeout(function() { 
       self.searchInput.nativeElement.focus(); 
      }, 0); 
     } else { 
      self.xyz= false; 
      self.abc = ''; 
     } 
    } 

は私がしようとしている私のテストケースである：

it('textbox get focus toggleSearch', async(() => { 
     let el: DebugElement; 

     component.toggleSearch(true); 
     el = fixture.debugElement.query(By.css('#search-input-theme')); 
     let native: HTMLElement = el.nativeElement; 
     spyOn(native,'focus'); 
     fixture.whenStable().then(() => { 
      expect(native.focus).toHaveBeenCalled(); 
     }); 
    })); 

Answer 1

このような

多分何か：

const input = de.query(By.css("your_field_selector")).nativeElement; 
const focusElement = de.query(By.css(":focus")).nativeElement; 
expect(focusElement).toBe(nomeInput); 

ルイス・ルイス・アブレウの答えは私のために働いた

Answer 2

としてだけではなく、私は、フォーカスメソッドが呼び出されたが、フォーカスはビューの右側の要素に設定されていることを偵察したかった。ここに例があります：

describe('Email input focus',() => { 
    beforeEach(() => { 
    spyOn(comp.emailField.nativeElement, 'focus'); 
    comp.ngAfterViewInit(); 
    }); 

    it('Should call the focus event',() => { 
    expect(comp.emailField.nativeElement.focus).toHaveBeenCalled(); 
    }); 

    it('Should be focused on the view',() => { 
    fixture.detectChanges(); 
    const emailInput = de.query(By.css('#email')).nativeElement; 
    const focusedElement = de.query(By.css(':focus')).nativeElement; 
    expect(focusedElement).toBe(emailInput); 
    }); 
});