Search code examples
angulartypescriptangular5karma-jasmineangular-unit-test

Angular unit testing getting failed


I am trying to unit test the function editDependentInfo(), but I am getting error, because in that function, another function populateEditDepInfo() is being called and populateEditDepInfo have this.dependentsInfo property and test from EditDependentInfo is trying to access but not able to Please find the below code and let me know what should I do

let dependentsInfo: Dependents;
        class ProfileDependentsStub {
            dependentInfoChange: Subject<any[]> = new Subject<any[]>();
            dependentInfoDelete: Subject<any[]> = new Subject<any[]>();

            data = {
                body: [{states: [{name: "Alabama", code: "AL"}]}, {countries: [{name: "UNITED STATES", code: "USA"}]}, ['relationshipType'], {hideDBCardStatus:"no"}, {hsaenrollmentStatus: "Enrolled"},{beneficiaryType:["Contingent", "Primary"]},
                {relationshipType:["Adopted Child"]}, {status:["Active"]}, 
                {prefixlist: ["DEACON"]},{prefixlist: ["DEACON"]}, {addressDetails:[{addressLineOne: "6226 3RD DRIVE"}]}, {beneficiaryList:[{id:123, firstName:"David"}]},
                {dependentsList:[{id:1234, employeeId:909}]} ]}

            getChildObject = function (href) {
                return { href: '' };
            };

            getChildLinks = function () {
                return Observable.of(ResponseData);
            };

            getLabelList = function (label) {
                return label;
            };

            addChildObjects = function (links) {
                return links;
            };

            addLabelList = function (labels) {
                return labels;
            };

            getStateCountryList = function () {
                return Observable.of(this.data);
            };

            getRelationAndStatusList = function () {
                return Observable.of(this.data);
            };

            getPrefixSuffixList = function () {
                return Observable.of(this.data);
            };

            populateEditDepInfo = function(data){
                return data;
            }

            getDependentsInfoDetails = function () {
                this.data.body['dependentsList'] = new Array('John Smith');
                return Observable.of(this.data);
            };
        }

test which is getting failed

  it('should edit Dependent Info', () => {

        component.editDependentInfo(null,this.userDependentInfo)

        expect(component.isUpdateDependentInfo).toBeTruthy();
    });

Component which I am testing

    export class {
       dependentsInfo: Dependents;
    editDependentInfo(event = null, userDependentInfo: Dependents) {
            this.dependentsInfo = <Dependents>{};
            this.clearSelectValues();
            this.isUpdateDependentInfo = true;
            this.dependentsInfo = userDependentInfo;
            this.populateEditDepInfo();
        }

        populateEditDepInfo(): void {
            this.saveDepInfo = false;
            if (this.dependentsInfo.id) {
                this.dependentId = this.dependentsInfo.id;
            }}
}

Sample Dependents class

class Dependents {
  name: string;
  id: string;
  dependentType: string;
  status: string;
  ineligibleReason: String;
  depndtDebitCardStatus: string;
  showCardStatusfInfo: boolean;
  addressLineOne: string;
  addressLineTwo: string;
  addressLineThree: string;
  city: string;}

Error which I am getting

TypeError: Cannot read property 'id' of undefined
    at ProfileDependentsViewComponent.populateEditDepInfo (webpack:///./src/app/profile/_profile-dependents-view/profile-dependents-view.component.ts?:207:33)
    at ProfileDependentsViewComponent.editDependentInfo (webpack:///./src/app/profile/_profile-dependents-view/profile-dependents-view.component.ts?:202:14)
    at Object.eval (webpack:///./src/app/profile/_profile-dependents-view/profile-dependents-view.component.spec.ts?:135:19)

Solution

  • Below solution worked for me

    it('should edit Dependent Info', () => {
    let userDependentInfo= {  name: "john", ......}  as any
    
            component.editDependentInfo(null,this.userDependentInfo)
    
            expect(component.isUpdateDependentInfo).toBeTruthy();
        });