All files / nexshop-web-contents/spec/component contents-main-view-spec.js

100% Statements 84/84
100% Branches 0/0
100% Functions 19/19
100% Lines 84/84
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 1561x 1x 1x 1x 1x 1x 1x 1x 1x   1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x       1x 13x                                   1x 13x 13x 13x 13x 13x 13x 13x 13x     1x 1x   1x     1x 1x     1x 1x   1x     1x 1x 1x 1x 1x 1x 1x     1x 1x   1x       1x             1x 8x 8x 8x   8x                   8x 8x     1x 1x     1x 1x 1x     1x 1x 1x     1x 1x 1x     1x 1x 1x 1x 1x     1x 1x 1x 1x 1x     1x 1x     1x 1x      
import React from 'react';
import {expect} from 'chai';
import {shallow} from 'enzyme';
import sinon from 'sinon';
import ContentsMainView from '../../src/component/contents-main-view';
import AddMenu from '../../src/component/popup/add-menu/add-menu';
import CreateThat from '../../src/component/dialog/create-that/create-that';
import ConfirmDeleteContentsItem from '../../src/component/dialog/confirm-delete-contents-item/confirm-delete-contents-item';
import MoveTo from '../../src/component/dialog/move-to/move-to';
 
describe('ContentsMain View Spec', () => {
    const spyOnAddButtonClicked = sinon.spy();
    const spyOnCreatePlaylistMenuClicked = sinon.spy();
    const spyOnPlaylistCreated = sinon.spy();
    const spyOnCreateSceneMenuClicked = sinon.spy();
    const spyOnUploadFilesSelected = sinon.spy();
    const spyCloseAddMenu = sinon.spy();
    const spyCloseDialog = sinon.spy();
    const spyOnCreateNewFolderClicked = sinon.spy();
    const breadcrumb = [{name: 'name1', id: 'id1'}, {name: 'name1', id: 'id1'}];
    const spyReplaceContentNameValidity = sinon.spy();
    const spyFetchExistContentNameAsync = sinon.spy();
    const contentNameExisted = 'NONE';
 
    let wrapper;
 
    beforeEach(() => {
        wrapper = shallow(
            <ContentsMainView
                addMenuVisibility={true}
                onAddButtonClicked={spyOnAddButtonClicked}
                onCreatePlaylistMenuClicked={spyOnCreatePlaylistMenuClicked}
                onCreateSceneMenuClicked={spyOnCreateSceneMenuClicked}
                onSelectFiles={spyOnUploadFilesSelected}
                closeAddMenu={spyCloseAddMenu}
                closeDialog={spyCloseDialog}
                onCreateNewFolderClicked={spyOnCreateNewFolderClicked}
                fetchExistContentNameAsync={spyFetchExistContentNameAsync}
                breadcrumb={breadcrumb}
                replaceContentNameValidity={spyReplaceContentNameValidity}
                contentNameExisted={contentNameExisted}
            />
        );
    });
 
    afterEach(() => {
        spyOnAddButtonClicked.reset();
        spyOnCreatePlaylistMenuClicked.reset();
        spyOnPlaylistCreated.reset();
        spyOnCreateSceneMenuClicked.reset();
        spyCloseAddMenu.reset();
        spyCloseDialog.reset();
        spyOnCreateNewFolderClicked.reset();
        spyReplaceContentNameValidity.reset();
    });
 
    it('calls onAddButtonClicked', () => {
        wrapper.find('.add-button').simulate('click');
 
        expect(spyOnAddButtonClicked.called).to.be.true;
    });
 
    it('has add-button-rotate class when addMenuVisibility prop is true', () => {
        expect(wrapper.find('.add-button').hasClass('add-button--rotate')).to.be.true;
    });
 
    it('does not have add-buttor-rotate class when addmenuVisibility prop is false', () => {
        wrapper.setProps({addMenuVisibility: false});
 
        expect(wrapper.find('.add-button').hasClass('add-button--rotate')).to.be.false;
    });
 
    describe('AddMenu', () => {
        it('passes props', () => {
            expect(wrapper.find(AddMenu).prop('onClose')).to.equal(wrapper.instance().closeAddMenu);
            expect(wrapper.find(AddMenu).prop('onCreatePlaylistClicked')).to.equal(spyOnCreatePlaylistMenuClicked);
            expect(wrapper.find(AddMenu).prop('onCreateSceneClicked')).to.equal(spyOnCreateSceneMenuClicked);
            expect(wrapper.find(AddMenu).prop('onUploadFilesSelected')).to.equal(spyOnUploadFilesSelected);
            expect(wrapper.find(AddMenu).prop('onCreateNewFolderClicked')).to.equal(spyOnCreateNewFolderClicked);
        });
 
        it('call closeAddMenu when AddMenu close button clicked', () => {
            wrapper.instance().closeAddMenu();
 
            expect(spyCloseAddMenu.called).to.true;
        });
    });
 
    describe('Create That', () => {
        let spyOnPlaylistCreated;
        let spyOnSceneCreated;
        let createPlaylist;
        let createScene;
        let spyCloseDialog;
 
        beforeEach(() => {
            spyOnPlaylistCreated = sinon.spy();
            spyOnSceneCreated = sinon.spy();
            spyCloseDialog = sinon.spy();
 
            wrapper.setProps({
                createPlaylistDialogVisibility: true,
                createSceneDialogVisibility: false,
                onPlaylistCreated: spyOnPlaylistCreated,
                onSceneCreated: spyOnSceneCreated,
                closeDialog: spyCloseDialog,
                breadcrumb,
                replaceContentNameValidity: spyReplaceContentNameValidity
            });
 
            createPlaylist = wrapper.find(CreateThat).at(0);
            createScene = wrapper.find(CreateThat).at(1);
        });
 
        it('has 2 different dialogs', () => {
            expect(wrapper.find(CreateThat).length).to.equal(2);
        });
 
        it('has one for playlist and another for scene', () => {
            expect(createPlaylist.prop('whatThatIs')).to.equal('Playlist');
            expect(createScene.prop('whatThatIs')).to.equal('Scene');
        });
 
        it('has visibility for each dialogs', () => {
            expect(createPlaylist.prop('visibility')).to.be.true;
            expect(createScene.prop('visibility')).to.be.false;
        });
 
        it('has onCreate handler for each dialogs', () => {
            expect(createPlaylist.prop('onCreated')).to.equal(spyOnPlaylistCreated);
            expect(createScene.prop('onCreated')).to.equal(spyOnSceneCreated);
        });
 
        it('has onCancel, onClose as closeDialog prop for each dialogs', () => {
            expect(createPlaylist.prop('onCancel')).to.equal(spyCloseDialog);
            expect(createScene.prop('onCancel')).to.equal(spyCloseDialog);
            expect(createPlaylist.prop('onClose')).to.equal(spyCloseDialog);
            expect(createScene.prop('onClose')).to.equal(spyCloseDialog);
        });
 
        it('has breadcrumb, replaceContentNameValidity props for each dialogs', () => {
            expect(createPlaylist.prop('breadcrumb')).to.equal(breadcrumb);
            expect(createScene.prop('breadcrumb')).to.equal(breadcrumb);
            expect(createPlaylist.prop('replaceContentNameValidity')).to.equal(spyReplaceContentNameValidity);
            expect(createScene.prop('replaceContentNameValidity')).to.equal(spyReplaceContentNameValidity);
        });
 
        it('has ConfirmDeleteContentsItem', () => {
             expect(wrapper.find(ConfirmDeleteContentsItem).exists()).to.true;
        });
 
        it('has MoveTo', () => {
            expect(wrapper.find(MoveTo).exists()).to.true;
        });
    });
});