Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

297
Views
How to write test case for @viewchild element referenced for input type checkbox in angular 8?

I am new to angular test case. I have a input type checkbox which has element ref id of #checkbox. Below is code snippet. How to write test case for masterToggle function in below code? If anyone know please help to find the solution.

app.component.ts:

@ViewChild('checkbox') checkbox;

function masterToggle(){
this.checkbox.nativeElement.checked = false;
this.checkbox.nativeElement.indeterminate = false;
}

HTML :

<input type="checkbox" class="nodecheckbox" #checkbox [disabled]="isCheckboxDisabledForSelectAll()" (change)="masterToggle(data)" >
about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

The purpose of testing is to verify, if a functionality is behaving accordingly to the dev expectation. Starting from here we should test if masterToggle method sets checked property to false and indeterminate to false.

Inside a test file in Angular you have access to all public methods, and eventually by using bracket notation(Mycomponent[privateMethodOrPropertyName]). So this actually allows you for easy testing.

it('should be ok', async(() => {
    let fixture = TestBed.createComponent(TestComponent);
    fixture.detectChanges();
    fixture.whenStable().then(() => {
      let checkbox = fixture.debugElement.query(/*you should locate yourcheckbox*/);

      component.masterToggle();
      // if model doesn't update use fixture.detectChanges();

      expect(checkbox.nativeElement.checked).toBe(False);
      expect(checkbox.nativeElement.indeterminate).toBe(False);
    });
about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!