nexshop-web-contents

Version:
Nexshop Web Contents Project
387 lines (386 loc) • 12.2 kB
HTML
<!doctype html>
<html lang="en">
<head>
    <title>Code coverage report for nexshop-web-contents/spec/component/scene/scene-resource/scene-resource-view-spec.js</title>
    <meta charset="utf-8" />
    <link rel="stylesheet" href="../../../../../prettify.css" />
    <link rel="stylesheet" href="../../../../../base.css" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <style type='text/css'>
        .coverage-summary .sorter {
            background-image: url(../../../../../sort-arrow-sprite.png);
        }
    </style>
</head>
<body>
<div class='wrapper'>
  <div class='pad1'>
    <h1>
      <a href="../../../../../index.html">All files</a> / <a href="index.html">nexshop-web-contents/spec/component/scene/scene-resource</a> scene-resource-view-spec.js
    </h1>
    <div class='clearfix'>
      <div class='fl pad1y space-right2'>
        <span class="strong">100% </span>
        <span class="quiet">Statements</span>
        <span class='fraction'>58/58</span>
      </div>
      <div class='fl pad1y space-right2'>
        <span class="strong">100% </span>
        <span class="quiet">Branches</span>
        <span class='fraction'>0/0</span>
      </div>
      <div class='fl pad1y space-right2'>
        <span class="strong">100% </span>
        <span class="quiet">Functions</span>
        <span class='fraction'>18/18</span>
      </div>
      <div class='fl pad1y space-right2'>
        <span class="strong">100% </span>
        <span class="quiet">Lines</span>
        <span class='fraction'>58/58</span>
      </div>
    </div>
  </div>
  <div class='status-line high'></div>
<pre><table class="coverage">
<tr><td class="line-count quiet">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</td><td class="line-coverage quiet"><span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">14x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">14x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-yes">1x</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import React from 'react';
import {expect} from 'chai';
import {shallow} from "enzyme";
import sinon from "sinon";
import SceneResource from "../../../../src/component/scene/scene-resource/scene-resource-view";
&nbsp;
describe('Scene Resource Spec', () =&gt; {
    let wrapper;
&nbsp;
    let tabs = ['Layout', 'Templates', 'Contents', 'Widget'];
&nbsp;
    let instance;
&nbsp;
    const SELECTED_TAB_ID = 'layout';
    const CONTENTS = [{id: 'contentsItem1'}, {id: 'contentsItem2'}];
    const FOLDERS = [{id: 'f1', name: 'folder'}];
    const SELECTED_LAYOUT_ID = '1';
    const orientation = 'horizontal';
&nbsp;
    const spyChangeLayout = sinon.spy();
    const spySelectTab = sinon.spy();
&nbsp;
    beforeEach(() =&gt; {
        wrapper = shallow(&lt;SceneResource changeLayout={spyChangeLayout}
                                         orientation={orientation}
                                         selectTab={spySelectTab}
                                         selectedTabId={SELECTED_TAB_ID}
                                         contents={CONTENTS}
                                         folders={FOLDERS}
                                         selectedLayoutId={SELECTED_LAYOUT_ID}/&gt;);
        instance = wrapper.instance();
    });
&nbsp;
    describe('render', () =&gt; {
&nbsp;
        it('show layout button when selecetedTabId is layout', () =&gt; {
            wrapper.setProps({selectedTabId: 'layout'});
            expect(wrapper.find('.scene-tab__button--selected').exists()).to.true;
            expect(wrapper.find('.scene-tab__button--selected').text()).to.equal('Layout');
        });
&nbsp;
        it('show template button when selecetedTabId is template', () =&gt; {
            wrapper.setProps({selectedTabId: 'template'});
            expect(wrapper.find('.scene-tab__button--selected').exists()).to.true;
            expect(wrapper.find('.scene-tab__button--selected').text()).to.equal('Templates');
        });
&nbsp;
        it('show contents button when selecetedTabId is contents', () =&gt; {
            wrapper.setProps({selectedTabId: 'contents'});
            expect(wrapper.find('.scene-tab__button--selected').exists()).to.true;
            expect(wrapper.find('.scene-tab__button--selected').text()).to.equal('Contents');
        });
&nbsp;
        it('show widget button when selecetedTabId is widget', () =&gt; {
            wrapper.setProps({selectedTabId: 'widget'});
            expect(wrapper.find('.scene-tab__button--selected').exists()).to.true;
            expect(wrapper.find('.scene-tab__button--selected').text()).to.equal('');
        });
&nbsp;
    });
&nbsp;
    describe('Mapping props and actions', () =&gt; {
        it('has props.changeLayout', () =&gt; {
            expect(instance.props.changeLayout).to.equal(spyChangeLayout);
        });
&nbsp;
        it('has props.selectTab', () =&gt; {
            expect(instance.props.selectTab).to.equal(spySelectTab);
        });
&nbsp;
        it('has props.selectedTabId', () =&gt; {
            expect(instance.props.selectedTabId).to.equal(SELECTED_TAB_ID);
        });
&nbsp;
        it('has props.contents', () =&gt; {
            expect(instance.props.contents).to.deep.equal(CONTENTS);
        });
&nbsp;
        it('has props.selectedLayoutId', () =&gt; {
            expect(instance.props.selectedLayoutId).to.equal(SELECTED_LAYOUT_ID);
        });
    });
&nbsp;
    it('has scene-resource-wrapper', () =&gt; {
        expect(wrapper.find('.scene-resource-wrapper').length).to.be.equal(1);
    });
&nbsp;
    it('has 4 layout tab button', () =&gt; {
        expect(wrapper.find('.scene-tab__button--selected').length).to.be.equal(1);
        expect(wrapper.find('.scene-tab__button').length).to.be.equal(tabs.length - 1);
    });
&nbsp;
    it('tab button should selected when within selectedTabId', () =&gt; {
        expect(wrapper.find('.scene-tab__button--selected').text()).to.equal('Layout');
    });
&nbsp;
    it('call selectTab when click tab button(layout)', () =&gt; {
        wrapper.find('.scene-tab__button--selected').simulate('click');
&nbsp;
        expect(spySelectTab.calledWith('layout')).to.be.true;
    });
&nbsp;
    it('call selectTab when click tab button(contents)', () =&gt; {
        wrapper.find('.scene-tab__button').at(1).simulate('click');
&nbsp;
        expect(spySelectTab.calledWith('contents')).to.be.true;
    });
});</pre></td></tr>
</table></pre>
<div class='push'></div><!-- for sticky footer -->
</div><!-- /wrapper -->
<div class='footer quiet pad2 space-top1 center small'>
  Code coverage
  generated by <a href="https://istanbul.js.org/" target="_blank">istanbul</a> at Mon Dec 18 2017 16:41:44 GMT+0900 (KST)
</div>
</div>
<script src="../../../../../prettify.js"></script>
<script>
window.onload = function () {
        if (typeof prettyPrint === 'function') {
            prettyPrint();
        }
};
</script>
<script src="../../../../../sorter.js"></script>
</body>
</html>