dimanche 5 mars 2017

Redux testing issue with Chai

I'm learning react redux, I'm currently implementing some reducers using TDD. I'm working with a sample application, it's just a notepad for adding/removing/opening/closing notes.

I'm making some tests for adding a new note, but the second "it" is failing, the error that throws me is the following:

1) AddNote reducer should return two notes: AssertionError: expected { Object (id-123, id-456) } to equal { Object (byId, ids, ...) }

describe('AddNote reducer' , () => {
    it('should return a new note', () => {
        const state = getMockState.withNoNotes();
        const actualNextState = reducers.byId(
            state.byId, actions.addNote(
                'Hello World', 'id-123', 1));
        const expectedNextState = {
            'id-123': {
                id: 'id-123',
                content: 'Hello World',
                timestamp: 1
            }
        };
        expect(actualNextState).to.deep.equal(expectedNextState);
    });

    it('should return two notes', () => {
        const state = getMockState.withOneNote();
        const actualNextState = reducers.byId(state.byId, actions.addNote('Bye bye world!', 'id-456', 2));
        const expectedNextState = {
            ...state,
            'id-456': {
                id: 'id-456',
                content: 'Bye bye world!',
                timestamp: 2
            }
        };
        expect(actualNextState).to.deep.equal(expectedNextState);
    });
});

I'm using also a helper, here it is

export const getMockState = {
    withNoNotes: () => ({
        byId: {},
        ids: [],
        openNoteId: null,
    }),
    withOneNote: () => ({
        byId: {
            'id-123': {
                id: 'id-123',
                content: 'Hello world',
                timestamp: 1,
            },
        },
        ids: ['id-123'],
        openNoteId: 'id-123',
    }),
};

The idea is if I add a note in the first case it would return a new state with just that note, but in the second case, it should return a state with the previous note, plus the new one. I'm using Chai expect library with mocha.

If it helps here's the output of the state (it's a console log), which I think is ok,

{ 'id-123': { id: 'id-123', content: 'Hello World', timestamp: 1 } }
    √ should return a new note
{ 'id-123': { id: 'id-123', content: 'Hello world', timestamp: 1 },
  'id-456': { id: 'id-456', content: 'Bye bye world!', timestamp: 2 } }
    1) should return two notes

Here's is my reducer

import { merge } from 'ramda';

export const byId = (state={}, {type, payload}) => {
    switch(type) {
        case 'app/addNote':
            console.log(merge(state, { [payload.id]: payload})) ;
            return merge(state, { [payload.id]: payload});
        default:
            return state;
    }
};

Any ideas? thanks in advance!

Aucun commentaire:

Enregistrer un commentaire