如何在使用材料步进器的角度组件上编写单元测试

Question

Angular app use material stepper that is defined in template. The component access the stepper by using the @ViewChild('stepper') stepper: MatStepper; In the component, many method set the selected index based on click event. Unit test fail since it say "Cannot set properties of undefined (setting 'selectedIndex')".

I think stepper is defined in template(ie html), the unit test is on component(.ts) and used viewchild to access it so on unit test could not access stepper since it is not defined in component.

How do I write unit test component that has material stepper.

Answer 1

You need to make sure that you have configured the TestBed correctly, and imported all relevant dependencies. Without seeing your code, try to import the MatStepperModule using:

import {MatStepperModule} from '@angular/material/stepper';

and then add it to you TestBed:

TestBed.configureTestingModule({
  imports: [
    ..., MatStepperModule
  ]
});

Hope this helps.