How can I mock an update of an object in an array : Unit testing Angular

Question

I am unit testing my redux reducers, I have tested GET, and CREATE so far however I don't know how to do the UPDATE. I can't figure out how to mock it. I have also added the code for the UPDATE in the reducer below.

This is what I have done so far in the test:

describe('register reducer', () => {
    let initialState;
    beforeEach(() => {
        initialState = UsersService.getInitialUsersState();
        deepFreeze(initialState);
    })

    it('should return the initial state', () => {
        expect(usersReducer(undefined, [])).toEqual(initialState);
    });
    it('Should add a new baby object to the babies array', () => {
        // create 'mock' of initial state
        // add baby by calling reducer function
        // check that state is correct. Use deep freeze to check no mutations.
        let afterState = UsersService.getInitialUsersState();
        let baby = {
            firstname: 'Peter',
            lastname: 'Petursson',
            username: 'test baby 1',
            birthDate: new Date(2018, 0, 1),
            area: 'Copenhagen',
            rating: []
        };
        afterState.babies.push(baby);

        let newState = usersReducer(initialState, {
            type: types.UsersActions.CREATED_BABY,
            payload: baby
        });
        expect(newState.babies.length).toEqual(1);
        expect(newState).toEqual(afterState);
    });
    it('Should get the babies array', () => {
        let afterState = UsersService.getInitialUsersState();
        let babies = [{
            _id: "5ad228ffdc32f1a42f5d3259",
            firstname: "Oliver",
            lastname: "Hultgren",
            username: "o@h",
            birthDate: new Date(2018, 0, 1),
            area: "København Ø",
            rating: [],
            userType: "baby",
            dataClient: "Julia"
        },
        {
            _id: "5ad229d7dc32f1a42f5d325a",
            firstname: "Oli",
            lastname: "Hult",
            username: "o.h@dk",
            birthDate: new Date(2018, 0, 1),
            area: "København V",
            rating: [],
            userType: "baby",
            dataClient: "Julia",
        }, {
            _id: "5ad309337cbda3002a7e92e0",
            firstname: "Jenny",
            lastname: "Lopez",
            username: "jl@com",
            birthDate: new Date(2018, 0, 1),
            area: "København Ø",
            rating: [],
            userType: "baby",
            dataClient: "Julia",
        }]
        afterState.babies = babies;
        let newState = usersReducer(initialState, {
            type: types.UsersActions.RECEIVED_BABIES,
            payload: babies

        });
        expect(newState).toEqual(afterState);
    })

//update comes here

it('Should update a baby object in the babies array', () => {}}

This is how my actual reducer look like:

 case UsersActions.UPDATED_BABY:
            let indexBaby = state.babies.findIndex(baby => { return baby._id === action.payload._id });
            return tassign(state, { babies: [...state.babies.slice(0, indexBaby), action.payload, ...state.babies.slice(indexBaby + 1)] });

you can make your test on babies[0], change it, dispatch update action and then compare the result with the payload you have sent — Fateh Mohamed
– Fateh Mohamed, Commented May 31, 2018 at 14:19

Fateh Mohamed · Accepted Answer · 2018-05-31 14:53:18Z

try this

 it('Should add a new baby object to the babies array', () => {
    let afterState = UsersService.getInitialUsersState();
     let babies = [{
        _id: "5ad228ffdc32f1a42f5d3259",
        firstname: "Oliver",
        lastname: "Hultgren",
        username: "o@h",
        birthDate: new Date(2018, 0, 1),
        area: "København Ø",
        rating: [],
        userType: "baby",
        dataClient: "Julia"
    },
    {
        _id: "5ad229d7dc32f1a42f5d325a",
        firstname: "Oli",
        lastname: "Hult",
        username: "o.h@dk",
        birthDate: new Date(2018, 0, 1),
        area: "København V",
        rating: [],
        userType: "baby",
        dataClient: "Julia",
    }];
    let updatedBaby = {
        _id: "5ad229d7dc32f1a42f5d325a",
        firstname: "ChangedName", // change the name for example
        lastname: "Hult",
        username: "o.h@dk",
        birthDate: new Date(2018, 0, 1),
        area: "København V",
        rating: [],
        userType: "baby",
        dataClient: "Julia",
    }
    let newState = usersReducer(initialState, {
        type: types.UsersActions.UPDATED_BABY,
        payload: updatedBaby

    });
    expect(newState[1].firstname).toEqual('ChangedName'); // to check that update is working and that you have the new firstname

Collectives™ on Stack Overflow

How can I mock an update of an object in an array : Unit testing Angular

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest