Блог

Я пытаюсь модульно протестировать компонент, в котором я получаю данные «Групп», используя класс распознавателя данных. вот код для этого.

 export class GroupsComponent implements OnInit, OnDestroy {
  group: IGroup;
  groups: IGroup[];

  constructor(
    private activatedRoute: ActivatedRoute,
    private titleService: Title,
    private userService: GroupsService
  ){
     this.titleService.setTitle('Home | Groups');
     this.groups = [];

     this.groupsComponentDataSubscription = this.activatedRoute
        .data
        .subscribe(
       data => {

        if(data['groupsResponse']){
           this.groupsResponse = data['groupsResponse'] as IGroupsResponse;
           this.groups = this.groupsResponse.groups;
       }
      })
    }
  }
 

Для тестирования я использую фиктивные данные для «группового ответа», как показано ниже:

 
let mockGroups: IGroup[] = [{
  groupName: "testGroup1",
  description : "group1 detail",
  apiRoles: ["foo", "bar", "monitoring"],
  kafkaClusters: [{
     clusterId: "cluster1",
     topics: ["foo", "bar"],
     connectClusters:[{
       clusteId: "testCluster1",
       connectorNames: ["foo", "bar"]
     }]
  }]
 },
groupName: "testGroup2",
  description : "group2 detail",
  apiRoles: ["foo", "bar", "foobar"],
  kafkaClusters: [{
     clusterId: "cluster2",
     topics: ["foo", "bar"],
     connectClusters:[{
       clusteId: "testCluster2",
       connectorNames: ["foo", "bar"]
     }]
  }]
 }
]

let mockGroupsResponse: IGroupsResponse = {
   groups: mockGroups
}
 

Затем я передаю это фиктивное значение для ActivatedRoute, как показано ниже:

 let activatedRouteMock: any;

beforeEach(waitForAsync(() => {

activatedRouteMock = {
  data: of({groupsResponse: [mockGroupsResponse]})
};

TestBed.configureTestingModule({
 imports:[...],
 declarations: [GroupsComponent],
 providers:[..., {provide: ActivatedRoute, useValue: activatedRouteMock }]
}).compileComponents

 

Мои фиктивные данные для решателя успешно считаны. Однако проблема, с которой я сталкиваюсь, заключается в том, что я пытаюсь назначить массив групп из ответа локальной переменной.

 constructor(
    private activatedRoute: ActivatedRoute,
    private titleService: Title,
    private userService: GroupsService
  ){
           ...
           ....
           this.groupsResponse = data['groupsResponse'] as IGroupsResponse; // groupsResponse is assigned as mock data -- console.log -> [{ groups: [object], [object]]
           this.groups = this.groupsResponse.groups; // here, not able to set this.groups array from groupsResponse. (undefined)
       }
      })
    }
  }
 

Любая идея о том, что я делаю не так с моком. В реальном сценарии, когда я получаю данные от распознавателя, используя http в качестве обещания, у меня нет никаких проблем с настройкой массива. Однако мой тест не работает

Удаляет вызовы API из конструктора и перемещает их в ngOnInit.

конструктор следует использовать только для введения зависимости. Конструктор ссылок запускается до того, как ваши макетные службы будут готовы.