Угловое жасминовое юнит-тестирование "Не удается прочитать" свойство "из неопределенного

Question

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

контроллер

//Get data from URL
vm.getJson = function() {
    var url = 'https://www.reddit.com/r/worldnews/new.json',
        count = 0;
    $http.get(url).success(function(response) {
        console.log(response);
        for (var i = 0; i < response.data.children.length; i++) {
            vm.data.push(response.data.children[i].data);
            count++;
            if (count === response.data.children.length) {
                vm.numberOfPages();
            }
        }

        vm.result = true;

    }).error(function(err) {
        console.log(err);
    });

};

Ответ, который я получаю:

спекуляция

 //Testing the getJson function
describe('vm.getJson()', function() {

   it('It should return dummy Data as response and vm.result to be truthy', function() {

    var dummyData = {name: 'Umair'};
    $httpBackend.whenRoute('GET','https://www.reddit.com/r/worldnews/new.json').respond(200, dummyData);

    MainCtrl.getJson(); 

    $httpBackend.flush();

    expect(MainCtrl.result).toBeTruthy();


}); });

Я не получаю никаких ошибок, и тест проходит, если я удаляю цикл из функции контроллера. Я получаю ошибку:

Невозможно прочитать "Дети" из неопределенного. Из изображения, которое я прикрепил к данным ответа, дети - это массив.

Answer 1

Когда ваш тест запущен, $httpBackend фактически перехватывает $http.get позвонить и назначить dummyData на ответ, как вы указали в

$httpBackend.whenRoute('GET','https://www.reddit.com/r/worldnews/new.json').respond(200, dummyData);

Такое насмешливое поведение позволяет быстро выполнять модульные тесты, не полагаясь на Reddit, доступный с вашей тестовой машины. Так что в вашем контроллере, response.data = {name: 'Umair'} и этот объект не имеет дочернего по имени children,

Чтобы исправить это, для dummyDataпопробуйте подражать реальным данным немного больше.

Answer 2

Вы возвращаете объект со свойством name в вашем тесте, а затем вы пытаетесь получить доступ к свойству data который не определен.

Вы должны смоделировать реальный объект ответа в ваших тестах, например:

var dummyData = {
  data: {
    children: [ 
    { data: 'foo'}
    ]
  }
};

Answer 3

Вы dummyData не массив, я полагаю, это может решить проблему, пожалуйста, попробуйте с тестом ниже

//Testing the getJson function
describe('vm.getJson()', function() {

    it('It should return dummy Data as response and vm.result to be truthy', function() {

        var dummyData = [{ data: 'Umair' }];
        $httpBackend
            .when('GET', 'https://www.reddit.com/r/worldnews/new.json')
            .respond(.respond(
                function() {
                    return [200, dummyData, {}];
                }););

        MainCtrl.getJson();

        $httpBackend.flush();

        expect(MainCtrl.result).toBeTruthy();

    });
});

Answer 4

Вы должны определить неопределенные переменные в области компонента:

 beforeEach(async () => {
    fixture = TestBed.createComponent(ExportWizardComponent);
    component = fixture.componentInstance;
    // DEFINE VALUES FOR VARIABLES
    component.patientInfo =  Constants.PROJECT_WIZARD_INFO;
    component.wizardMove = of(null);

    fixture.detectChanges();
  });

  it('should create', async () => {
    expect(component).toBeTruthy();
  });