Skip to solution
mediumFrontend

What is ComponentFixtureAutoDetect and how does it affect unit tests?

773 views
01

Understand the problem

Explain auto change detection in TestBed configuration.

testing
02

Attempt it yourself

Sketch your approach before reading the solution — that's what interviews test.

Nudge consolestandby

Stuck? Beam a request up — the console returns a conceptual nudge that guides your logic without spoiling the implementation.

03

Study the solution

ComponentFixtureAutoDetect is a DI token that configures TestBed to automatically run change detection when async actions complete. While helpful, it doesn't capture synchronous model modifications, so manual fixture.detectChanges() is still frequently needed.

Solution ready — 2 min read

Classified // press E to declassify

04

Read the code

Configuring ComponentFixtureAutoDetect inside TestBed providers
import { TestBed, ComponentFixtureAutoDetect } from '@angular/core/testing';
import { MyComponent } from './my.component';

describe('MyComponent AutoDetect', () => {
  beforeEach(() => {
    TestBed.configureTestingModule({
      imports: [MyComponent],
      providers: [
        { provide: ComponentFixtureAutoDetect, useValue: true }
      ]
    });
  });

  it('should process async clicks without manual detectChanges', () => {
    const fixture = TestBed.createComponent(MyComponent);
    const btn = fixture.nativeElement.querySelector('button');
    
    btn.click();
    expect(fixture.nativeElement.querySelector('.result').textContent).not.toBeEmpty();
  });
});
05

Join the discussion

Discussion (0)

Sign in to join the discussion.

No responses yet. Be the first to share what you think.

Transmission complete // awaiting log

KEEP THE
STREAK ALIVE.

Dossier 35 of 121 decoded in the Angular track. One more won't hurt.

Back to track