Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Mocha tests using Immutable.js are failing when runned with Karma

here is some context. I'm working on a project using React and Immutable.js, written with ES6. I use Babel and webpack.

I wrote some unit tests using Mocha, Chai and jsdom so they could be executed outside a browser.

The problem is that some of the components are using things like requiring images. This stuff is handled by webpack through the specific loader.

So when running the tests in the terminal, they fail because of these unexepected requires.

I found how to fix this by using Karma (leaving behind the ability to run the tests outside a browser) and compiling the sources before running the tests and make it so the webpack config just ignores the image loader (using null-loader).

At that point, the tests are running via Karma but some of them are failing whereas they are passing when they are runned via the terminal (I commented the lines where there was the require stuff, just for the purpose of the test).

The test that are failing are all related with Immutable.js meaning that I'm trying to test the equality of two Immutable objects.

Here is an exemple of a test :

it('handles SET_STATE', () => {
    const initialState = Map();
    const action = {
        type : 'SET_STATE',
        state : Map({
            vote : Map({
                pair : List.of('Trainspotting', '28 Days Later'),
                tally : Map({ 'Trainspotting' : 1 })
            })
        })
    };

    const nextState = reducer(initialState, action);

    expect(nextState).to.equal(fromJS({
        vote: {
            pair: ['Trainspotting', '28 Days Later'],
            tally: { 'Trainspotting': 1 }
        }
    }));
});

The failure gives something like that :

1) handles SET_STATE
     reducer
     AssertionError: expected { Object (size, _root, ...) } to equal { Object (size, _root, ...) }
    at Context.<anonymous> (/Users/boris_louboff/Labs/VotingApp/voting-client/test/tests.bundle.js:36413:42 <- webpack:///test/reducer.spec.js:21:29)

All the other tests which are not testing things related to Immutable are passing.

If someone have any idea on what could solve this that'd be great ! Thank you.

like image 640
websilone Avatar asked Dec 02 '15 10:12

websilone


2 Answers

I finally found what the problem was !!

The expectation to.equal seems to behave differently depending on the environnement (Node or a browser).

const map1 = Map({a: 1, b: 2});
const map2 = Map({a: 1, b: 2});

// In Node
expect(map1).to.equal(map2) // true

// In a browser
expect(map1).to.equal(map2) // false

The solution is to use the Immutable.js API .is()

expect(Immutable.is(map1, map2)).to.be.true // true in both Node and browser !
like image 196
websilone Avatar answered Nov 09 '22 12:11

websilone


While your suggestion works, this is the part of code needed to solve the problem:

import chai from 'chai';
import chaiImmutable from 'chai-immutable';

chai.use(chaiImmutable);

After adding it, expect(map1).to.equal(map2) // true works in karma. But I didn't find a way to include this in all my tests file like you can do with mocha with command

mocha --compilers js:babel-core/register --require ./test/test_helper.js\"test/**/*@(.js|.jsx)\"
like image 31
Carl Bosch Avatar answered Nov 09 '22 12:11

Carl Bosch