В чем разница между fixture.componentInstance и fixture.debugElement.componentInstance в Angular?

Question

При выполнении модульных тестов с Angular вы обычно используете ComponentFixture, чтобы получить ссылку на компонент. Автоматически сгенерированные модульные тесты из Angular CLI дают вам что-то вроде следующего:

const fixture = TestBed.createComponent(TestComponent);
const component = fixture.debugElement.componentInstance;

Однако я также могу использовать свойство componentInstance непосредственно на fixture, например так:

const fixture = TestBed.createComponent(TestComponent);
const component = fixture.componentInstance; // note that I don't reference `debugElement` here

В чем разница между двумя и когда я должен использовать один над другим?

Answer 1

Это даст вам более ясную картину: https://angular.io/guide/testing#debugelement

Итак, короткий ответ будет, если вы запускаете тесты на небраузерной платформе, у которой нет DOM или чья DOM-эмуляцияне поддерживает полный HTMLElement API, тогда вы ДОЛЖНЫ использовать fixture.debugElement.componentInstance, иначе ваши тесты не пройдут. Иначе, это не имеет значения, вы можете использовать любой из них, если вы используете браузер.

Также: fixture.debugElement.componentInstance дает componentInstance типа any, тогда как fixture.componentInstanceдает вам componentInstance типа T.