Updates to jest mock utilties

[awei01]

Made some updates to handle some new use cases.

N.B.: when using jest, you'll sometimes have to jest.dontMock('util'). possibly related to jestjs/jest#78

some usage examples

// testing actions
'use strict';
jest.dontMock('./actions.js');
describe('Testing actions in isolation', function() {
    var FakeFactory,
        Actions, events;
    beforeEach(function() {
        FakeFactory = require('fluxxor/lib/jest_mock_factory')(jest);
        Actions = FakeFactory.fakeBoundActions(require('./actions'));
        events = require('./events');
    });
    it('when .doFoo() called with group and items, it should call .dispatch() with DO_FOO event and { group: group, items: items }', function() {
        Actions.setGroupWithItems('foo', 'items');
        expect(Actions.dispatch).toBeCalledWith(events.DO_FOO, { group: "foo", items: "items" });
    });
    describe('testing an async action that returns kew module promise', function() {
        var fakeAPI, fakePromise;
        beforeEach(function() {
            fakeAPI = require('./api');
            fakePromise = FakeFactory.fakePromise();
            fakeAPI.getAsyncData.mockReturnValue(fakePromise);
            Actions.doAsyncAction('foo');
        });
        it('should call .dispatch() with START_FETCH event and { group: group }', function() {
            expect(Actions.dispatch).toBeCalledWith(events.START_FETCH, { group: "foo" });
        });
        it('should call API.getAsyncData() with the group', function() {
            expect(fakeAPI.getAsyncData).toBeCalledWith('foo');
        });
        it('when promise resolves with results, it should call .dispatch() with FETCH_SUCCESS event and { group: group, items: results }', function() {
            fakePromise.resolve('results');
            expect(Actions.dispatch).toBeCalledWith(events.FETCH_SUCCESS, { group: "foo", items: "results" });
        });
        it('when promise rejects with error, it should call .dispatch() with FETCH_FAILURE event and { group: group, error: error }', function() {
            fakePromise.reject('error');
            expect(Actions.dispatch).toBeCalledWith(events.FETCH_FAILURE, { group: "foo", error: "error" });
        });
    });
});

'use strict';
jest.dontMock('util');
jest.dontMock('./foo-store.js');
jest.dontMock('./bar-store.js');
describe('Testing a store in isolation', function() {
    var FakeFactory,
        FooStore;
    beforeEach(function() {
        FakeFactory = require('fluxxor/lib/jest_mock_factory')(jest);
        FooStore = require('./foo-store');
    });
    it('should be a function', function() {
        expect(ItemsStore).toEqual(jasmine.any(Function));
    });
    describe('after instantiation', function() {
        var fooStore,
            events, otherStores;
        beforeEach(function() {
            fooStore = new FooStore();
            events = require('./events');
            otherStores = {
                Bars: require('./bar-store')
            };
            FakeFactory.attachFakeFluxToStore(fooStore, otherStores);
        });
        describe('getters', function() {
            it('.getFooValue() should return undefined', function() {
                expet(fooStore.getFooValue()).toBe(undefined);
            });
            it('.getItems() should return undefined', function() {
                expect(fooStore.getItems()).toBe(undefined);
            });
        });
        it('when FOO_UPDATED event triggered with payload, it should set .getFooValue() with payload.foo', function() {
            fooStore.__handleAction__({ type: events.FOO_UPDATED, payload: { foo: "foo value" } });
            expect(fooStore.getFooValue()).toBe('foo value');
        });
        it('when BAR_UPDATED event triggered, it should waitFor Bars store and call Bars.getBarValue() with payload and set .getItems() and .emit() "change"', function() {
            stores.Bars.getBarValue.mockReturnValue('bar');
            fooStore.__handleAction__({ type: events.BAR_UPDATED, payload: "payload" });

            expect(Barts.getBarValue).toBeCalledWith('payload');
            expect(fooStore.getItems()).toBe('bar');
            expect(fooStore.emit).toBeCalledWith('change');
        });
    });
});

'use strict';
jest.dontMock('util');
jest.dontMock('./store.js');
jest.dontMock('./child-component.js');
describe('testing a child component that will be mounted with a parent that has props.flux', function() {
    var React, TestUtils, FakeFactory,
        ChildComponent;
    beforeEach(function() {
        React = require('react/addons');
        TestUtils = React.addons.TestUtils;
        FakeFactory = require('fluxxor/lib/jest_mock_factory')(jest);

        ChildComponent = require('./child-component');
    });
    it('should be a React class', function() {
        expect(React.isValidClass(ChildComponent)).toBe(true);
    });
    describe('rendered into document with flux context', function() {
        var flux, stores,
            childComponent;
        beforeEach(function() {
            stores = {
                MyStore: require('./store')
            };
            flux = FakeFactory.fakeFluxInstance(stores);
            childComponent = FakeFactory.mountFluxChildComponent(React, flux, ChildComponent);
        });
        it('should be a DIV tag', function() {
            expect(childComponent.getDOMNode().tagName).toBe('DIV');
        });
        it('when .getStateFromFlux() called, it should call MyStore.getFoo() and set state.fooValue as its result', function() {
            stores.Filters.getFoo.mockReturnValue('foo');
            var result = childComponent.getStateFromFlux();
            expect(result.fooValue).toBe('foo');
        });
        it('when component is clicked, it should call .stopPropagation() on event and actions.incrementCount()', function() {
            var fakeEvent = FakeFactory.fakeEvent();
            flux.actions = require('./actions');

            TestUtils.Simulate.click(childComponent.getDOMNode(), fakeEvent);

            expect(fakeEvent.stopPropagation).toBeCalled();
            expect(flux.actions.incrementCount).toBeCalled();
        });
    });
});

[landau]

I also was forced to dontMock util in order to get my test to pass.

Here are my errors based on the current situation of my tests.

- TypeError: Object [object Object] has no method 'bindActions'
- TypeError: Cannot call method 'getState' of null

Seems weird to throw jest testing into this lib. Also odd that @BinaryMuse hasn't commented on this.

[BinaryMuse]

Sorry for the lack of comment here. I think something like this is definitely valuable, but agree that it probably shouldn't go in Fluxxor proper. If I'm not mistaken, @awei01, this has been published on npm as fluxxor-jest-utils?

As an aside, I'm a bit worried that effective testing of Fluxxor-based apps requires so much extra/special code; it's something I'm keeping in mind when thinking about the v2 API.

[awei01]

Yes, there is an npm module called fluxxor-jest-utils available. I have a few bug fixes pending. But, in the meantime, you can check it out and take of it what you will. Pull requests welcome.

[BinaryMuse]

@awei01 Okay, awesome — I'm going to close this, and I'll be sure to add a link to that package in #73

[landau]

It's a shame fluxxor-jest-utils isn't on github. That stopped me from using it immediately. Perhaps i'll just copy the repo out if it has value. I'm still not experienced enough with jest as well. Thanks!

Perhaps a note in the docs for jest users would be useful.

[BinaryMuse]

@landau Seems to be up at https://github.com/awei01/fluxxor-jest-utils

[landau]

Ahh, thanks.