Mocha tests using Immutable.js fail with karma

Question

here is some context. I am working on a project using React and Immutable.js written in ES6. I use Babel and webpack.

I wrote some unit tests using Mocha, Chai, and jsdom so that they can be run outside of the browser.

The problem is that some components use things like required images. This material is processed by webpack through a specific loader.

Therefore, when running tests in the terminal, they fail due to the fact that these unprocessed ones require.

I found how to fix this using Karma (leaving the ability to run tests outside of the browser) and compiling the sources before running the tests, and make the webpack configuration simply ignore the image loader (using the null loader).

At this point, the tests are performed through Karma, but some of them fail while they pass when they are launched through the terminal (I commented on the lines in which the required material was, only for the purpose of the test).

The test that fails is related to Immutable.js, which means I'm trying to verify the equality of two immutable objects.

Here is a test example:

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 error gives something like this:

 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 other tests that do not test things related to immutable ones pass.

If anyone has an idea that could solve this, that would be great! Thanks.

Answer 1

I finally found what the problem is!

The wait for.equal seems to behave differently depending on the environment (Node or 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.is () API

 expect(Immutable.is(map1, map2)).to.be.true // true in both Node and browser ! 

Answer 2

While your proposal is working, this is part of the code needed to solve the problem:

 import chai from 'chai'; import chaiImmutable from 'chai-immutable'; chai.use(chaiImmutable); 

After adding expect(map1).to.equal(map2) // true works in karma. But I did not find a way to include this in all my test files, as you can do with mocha with the command

 mocha --compilers js:babel-core/register --require ./test/test_helper.js\"test/**/*@(.js|.jsx)\"