Skip to content

Commit

Permalink
feat: 增加 message , Col 组件的单元测试
Browse files Browse the repository at this point in the history
  • Loading branch information
lijinke666 committed Aug 29, 2018
1 parent 80e13e1 commit 85f6e6b
Show file tree
Hide file tree
Showing 5 changed files with 387 additions and 1 deletion.
3 changes: 2 additions & 1 deletion components/col/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,8 @@ import './styles.less';

export default class Col extends PureComponent {
static defaultProps = {
prefixCls: 'cuke-col'
prefixCls: 'cuke-col',
gutter:0
};

static propTypes = {
Expand Down
265 changes: 265 additions & 0 deletions components/message/__tests__/__snapshots__/index.test.js.snap
Original file line number Diff line number Diff line change
@@ -0,0 +1,265 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`<Message/> should render a <Message/> components 1`] = `
<div>
<div
class="cuke-message open"
>
<div
class="cuke-message-title-custom message-success"
>
<p
class="icon"
>
<svg
attr="[object Object]"
fill="none"
height="1em"
stroke="currentColor"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
viewBox="0 0 24 24"
width="1em"
>
<path
d="M22 11.08V12a10 10 0 1 1-5.93-9.14"
/>
<polyline
points="22 4 12 14.01 9 11.01"
/>
</svg>
</p>
<p
class="text"
>
<span
class="title"
>
哈哈
</span>
</p>
</div>
</div>
<div
class="cuke-message open"
>
<div
class="cuke-message-title-custom message-error"
>
<p
class="icon"
>
<svg
attr="[object Object]"
fill="none"
height="1em"
stroke="currentColor"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
viewBox="0 0 24 24"
width="1em"
>
<circle
cx="12"
cy="12"
r="10"
/>
<line
x1="15"
x2="9"
y1="9"
y2="15"
/>
<line
x1="9"
x2="15"
y1="9"
y2="15"
/>
</svg>
</p>
<p
class="text"
>
<span
class="title"
>
哈哈
</span>
</p>
</div>
</div>
<div
class="cuke-message open"
>
<div
class="cuke-message-title-custom message-info"
>
<p
class="icon"
>
<svg
attr="[object Object]"
fill="none"
height="1em"
stroke="currentColor"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
viewBox="0 0 24 24"
width="1em"
>
<polygon
points="11 5 6 9 2 9 2 15 6 15 11 19 11 5"
/>
<path
d="M19.07 4.93a10 10 0 0 1 0 14.14M15.54 8.46a5 5 0 0 1 0 7.07"
/>
</svg>
</p>
<p
class="text"
>
<span
class="title"
>
哈哈
</span>
</p>
</div>
</div>
<div
class="cuke-message open"
>
<div
class="cuke-message-title-custom message-warning"
>
<p
class="icon"
>
<svg
attr="[object Object]"
fill="none"
height="1em"
stroke="currentColor"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
viewBox="0 0 24 24"
width="1em"
>
<circle
cx="12"
cy="12"
r="10"
/>
<line
x1="12"
x2="12"
y1="8"
y2="12"
/>
<line
x1="12"
x2="12"
y1="16"
y2="16"
/>
</svg>
</p>
<p
class="text"
>
<span
class="title"
>
哈哈
</span>
</p>
</div>
</div>
<div
class="cuke-message open"
>
<div
class="cuke-message-title-custom message-loading"
>
<p
class="icon"
>
<svg
attr="[object Object]"
fill="none"
height="1em"
stroke="currentColor"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
viewBox="0 0 24 24"
width="1em"
>
<line
x1="12"
x2="12"
y1="2"
y2="6"
/>
<line
x1="12"
x2="12"
y1="18"
y2="22"
/>
<line
x1="4.93"
x2="7.76"
y1="4.93"
y2="7.76"
/>
<line
x1="16.24"
x2="19.07"
y1="16.24"
y2="19.07"
/>
<line
x1="2"
x2="6"
y1="12"
y2="12"
/>
<line
x1="18"
x2="22"
y1="12"
y2="12"
/>
<line
x1="4.93"
x2="7.76"
y1="19.07"
y2="16.24"
/>
<line
x1="16.24"
x2="19.07"
y1="7.76"
y2="4.93"
/>
</svg>
</p>
<p
class="text"
>
<span
class="title"
>
哈哈
</span>
</p>
</div>
</div>
</div>
`;
41 changes: 41 additions & 0 deletions components/message/__tests__/index.test.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
import React from 'react';
import assert from 'power-assert';
import { render, shallow, mount } from 'enzyme';
import toJson from 'enzyme-to-json';
import Message from '../index';

describe('<Message/>', () => {
it('should render a <Message/> components', () => {
const wrapper = render(
<div>
<Message title="哈哈" type="success" />
<Message title="哈哈" type="error" />
<Message title="哈哈" type="info" />
<Message title="哈哈" type="warning" />
<Message title="哈哈" type="loading" />
</div>
);
expect(toJson(wrapper)).toMatchSnapshot();
});

it('should find cuke-turn-table classnames', () => {
const wrapper = shallow(<Message title="哈哈" type="success" />);
assert(wrapper.find('.cuke-message').length === 1);
assert(wrapper.find('.message-success').length === 1);
});

it('should 2s ago emit callback', () => {
const wrapper = mount(
<Message
title="哈哈"
type="success"
duration={2}
onClose={() => wrapper.setProps({ title: '回调' })}
/>
);

setTimeout(()=>{
assert(wrapper.props().title === "回调");
},2000)
});
});
45 changes: 45 additions & 0 deletions components/row/__tests__/__snapshots__/index.test.js.snap
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`<Row/> should find cuke-row classnames 1`] = `
<div>
<div
class="cuke-row"
style="margin-left:0px;margin-right:0px"
>
<div
class="cuke-col cuke-col-12"
style="padding-left:0px;padding-right:0px"
>
1
</div>
<div
class="cuke-col cuke-col-6"
style="padding-left:0px;padding-right:0px"
>
2
</div>
<div
class="cuke-col cuke-col-2 cuke-col-offset-4"
style="padding-left:0px;padding-right:0px"
>
3
</div>
</div>
</div>
`;

exports[`<Row/> should render a <Row/> components 1`] = `
<div
class="cuke-row"
style="margin-left:0px;margin-right:0px"
>
<div
class="cuke-col cuke-col-12"
style="padding-left:0px;padding-right:0px"
/>
<div
class="cuke-col cuke-col-12"
style="padding-left:0px;padding-right:0px"
/>
</div>
`;
34 changes: 34 additions & 0 deletions components/row/__tests__/index.test.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
import React from 'react';
import assert from 'power-assert';
import { render } from 'enzyme';
import toJson from 'enzyme-to-json';
import Row from '../index';
import Col from '../../col';

describe('<Row/>', () => {
it('should render a <Row/> components', () => {
const wrapper = render(
<Row>
<Col span={12}></Col>
<Col span={12}></Col>
</Row>
);
expect(toJson(wrapper)).toMatchSnapshot();
});

it('should find cuke-row classnames', () => {
const wrapper = render(
<div>
<Row>
<Col span={12}>1</Col>
<Col span={6}>2</Col>
<Col span={2} offset={4}>3</Col>
</Row>
</div>
);
assert(wrapper.find('.cuke-row').length >= 1);
assert(wrapper.find('.cuke-col-offset-4').length === 1);
assert(wrapper.find('.cuke-col-6').length === 1);
expect(toJson(wrapper)).toMatchSnapshot();
});
});

0 comments on commit 85f6e6b

Please sign in to comment.