How to unit test .then function with jamsine

Question

I have written one component which post data from some service. Am not able to cover then function in Unit Test. How to enter test `then' function?

angular.module('myapp')
       .component('performAnalysis', {
            templateUrl: 'analysis.component.html',
            controller: PerformAnalysisController,
            controllerAs: 'vm'
        });

function PerformAnalysisController(UnitySizerService, SizingService, MarshallDTO, CommonService) {
    let vm = this;

    vm.$onInit = $onInit;

    function $onInit() {
        let unitySizerDTO = MarshallDTO.generateDTO();
        let previousDTO = CommonService.getProperty('previousDTO');

        vm.dataChanged = JSON.stringify(unitySizerDTO) === JSON.stringify(previousDTO);

        /* Call Backend API only if DTO is changed */
        if (!vm.dataChanged) {
            /* Loader On */
            vm.activateLoader = true;

            SizingService.postSizingResults(unitySizerDTO).then(function (data) {

                UnitySizerService.resultSummary = data;
                /* New Data coming from Backend */
                vm.dataChanged = true;
                /* Loader Off */
                vm.activateLoader = false;
                CommonService.setProperty('previousDTO', unitySizerDTO);
                vm.unitySizerService = UnitySizerService;
            });
        }
        else {
            vm.unitySizerService = UnitySizerService;
        }
    }
}

This is test file which I have written, but am not able to cover then function inside this:

describe('my Component', function () {

beforeEach(module('myApp'));

let vm;
let $rootScope;
let $componentController;
let UnitySizerService, SizingService;

beforeEach(inject(function (_$componentController_, _$rootScope_, _UnitySizerService_, _SizingService_) {
    $componentController = _$componentController_;
    $rootScope = _$rootScope_;
    UnitySizerService = _UnitySizerService_;
    SizingService = _SizingService_;

    vm = $componentController('performAnalysis');
}));

it('should be defined', function () {
    expect(vm).toBeDefined();

    expect(vm.$onInit).toBeDefined();

    expect(UnitySizerService).toBeDefined();

});

it('should show loader', function () {
    vm.$onInit();

    vm.dataChanged = false;

    expect(vm.activateLoader).toBeTruthy();
});

});

Answer 1

In order to mock .then of a Promise in jasmine, you can do something like this

var deferred = $q.defer();   
var whatServiceReturns = "test";

// we are returning promise from service function 
SizingService.postSizingResults.and.returnValue({$promise:deferred.$promise}); 

// now let's call the original function
vm.$onInit();

// we will resolve our promise so that we can reach inside 'then'
// here, 'whatServiceReturns' resembles your 'data' parameter in 'then' function
deferred.resolve(whatServiceReturns);

$rootScope.$digest();

// here we can expect things like 'dataChanged' and 'activateLoader' if we see from your example
expect(...).toEqual(...);

You can use deferred.reject(someError); for error.

Edit: added comments to elaborate the code