vendredi 16 septembre 2016

Chai testing on React App returning unexpected result

Hi I ran the following test and the test confirmed that ChannelListItem exists:

import React from 'react';
//import expect from 'expect';
import { expect } from 'chai';
import io from 'socket.io-client';
import sinon from 'sinon';
import { Provider } from 'react-redux';
import configureStore from '../../src/common/store/configureStore';
import { shallow,mount } from 'enzyme';
import Channels from '../../src/common/components/Channels';
import ChannelListItem from '../../src/common/components/ChannelListItem';
import { fakeChannels } from '../fakeData/channelsFake';
import { fakeMessages } from '../fakeData/messagesFake';
const initialState = window.__INITIAL_STATE__;
const store = configureStore(initialState);
const socket = io('', { path: '/api/chat' });



describe('Channels', () => {
    const changeActiveChannel = sinon.spy()
    const dispatch = sinon.spy(store, 'dispatch')
    let Component;

    beforeEach(() => {

        Component = 
            shallow(<Provider store={store}>
                <Channels
                    socket = {socket} 
                    onClick = {changeActiveChannel}
                    channels = {fakeChannels}
                    messages = {fakeMessages}
                    dispatch = {dispatch}
                    />
            </Provider>);
    });

    it('should render', () => {
        expect(Component).to.be.ok;
    });


    it('should have a ChannelListItem', () => {
        const channelListItem = Component.find('ChannelListItem')

        expect(channelListItem).to.exist;

However, when I ran the following test, I got channelListItem.length equal 0

expect(channelListItem.length).to.equal(3);

Any ideas what could be wrong? I clearly have a channelListItem inside my Channel component:

return (
      <ChannelListItem  style= channel={'aa'} key={'1'} onClick={::this.handleChangeChannel} />
    );
        });

Aucun commentaire:

Enregistrer un commentaire