Bird
0
0

Why does this test fail?

medium📝 Debug Q7 of 15
Angular - Testing
Why does this test fail?
component.title = 'Test';
const text = fixture.nativeElement.querySelector('h1').textContent;
expect(text).toBe('Test');

Template: <h1>{{ title }}</h1>

Afixture.detectChanges() was not called after setting title
BQuery selector is incorrect
Ctitle property is private
DtextContent cannot be used in tests
Step-by-Step Solution
Solution:
  1. Step 1: Check if template updates after property change

    Without calling fixture.detectChanges(), Angular does not update the template bindings.
  2. Step 2: Verify other options

    Query selector 'h1' is correct, title can be public/private but accessible in test, textContent is valid.
  3. Final Answer:

    fixture.detectChanges() was not called after setting title -> Option A
  4. Quick Check:

    Always call detectChanges() after changing component properties [OK]
Quick Trick: Call fixture.detectChanges() after changing component properties [OK]
Common Mistakes:
  • Forgetting detectChanges() causes stale template
  • Blaming query selectors or property visibility incorrectly

Want More Practice?

15+ quiz questions · All difficulty levels · Free

Free Signup - Practice All Questions
More Angular Quizzes