how to get HTML element and bypass *ngIf in angular testing

Question

I'm trying to get the the div element, but it's always null in [element variable in spec], I tried detect changes , autodetect changes,fake async , nothing works ,I know that ngIf is the reason cuz when I use the [hidden] it works, but i need to bypass ngIf, did I need to add projectServiceMock to the provider ? Thanks for Help

    <div *ngIf="project" class="test1">
       <p>Welcme</p>
    </div>

and spec code is

  it('test1',()=>{
    fixture.detectChanges();
    const element: ElementRef = fixture.debugElement.query(By.css('.test1'));
    fixture.detectChanges();
  });

Answer 1

I think project is falsy.

Try to see if the following works:

 it('test1',()=>{
    component.project = {};
    fixture.detectChanges();
    const element: ElementRef = fixture.debugElement.query(By.css('.test1'));
    fixture.detectChanges();
    expect(element).toBeTruthy();
  });