Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 9bf57a1

Browse files
add testing for cellEdit
1 parent 321d996 commit 9bf57a1

File tree

7 files changed

+512
-16
lines changed

7 files changed

+512
-16
lines changed

‎packages/react-bootstrap-table2/test/body.test.js

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { shallow } from 'enzyme';
44

55
import Body from '../src/body';
66
import Row from '../src/row';
7+
import Const from '../src/const';
78
import RowSection from '../src/row-section';
89

910
describe('Body', () => {
@@ -111,4 +112,35 @@ describe('Body', () => {
111112
});
112113
});
113114
});
115+
116+
describe('when cellEdit.nonEditableRows props is defined', () => {
117+
const nonEditableRows = [data[1].id];
118+
const keyField = 'id';
119+
const cellEdit = {
120+
mode: Const.CLICK_TO_CELL_EDIT,
121+
nonEditableRows
122+
};
123+
beforeEach(() => {
124+
wrapper = shallow(
125+
<Body
126+
data={ data }
127+
columns={ columns }
128+
keyField={ keyField }
129+
cellEdit={ cellEdit }
130+
/>
131+
);
132+
});
133+
134+
it('should render Row component with correct editable prop', () => {
135+
expect(wrapper.length).toBe(1);
136+
const rows = wrapper.find(Row);
137+
for (let i = 0; i < rows.length; i += 1) {
138+
if (nonEditableRows.indexOf(rows.get(i).props.row[keyField]) > -1) {
139+
expect(rows.get(i).props.editable).toBeFalsy();
140+
} else {
141+
expect(rows.get(i).props.editable).toBeTruthy();
142+
}
143+
}
144+
});
145+
});
114146
});

‎packages/react-bootstrap-table2/test/bootstrap-table.test.js

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,11 @@
11
import React from 'react';
2+
import sinon from 'sinon';
23
import { shallow } from 'enzyme';
34

45
import Header from '../src/header';
56
import Body from '../src/body';
67
import BootstrapTable from '../src/bootstrap-table';
8+
import Const from '../src/const';
79

810
describe('BootstrapTable', () => {
911
let wrapper;
@@ -36,6 +38,12 @@ describe('BootstrapTable', () => {
3638
expect(wrapper.find('.react-bootstrap-table-container').length).toBe(1);
3739
});
3840

41+
it('should have correct default state', () => {
42+
expect(wrapper.state().currEditCell).toBeDefined();
43+
expect(wrapper.state().currEditCell.ridx).toBeNull();
44+
expect(wrapper.state().currEditCell.cidx).toBeNull();
45+
});
46+
3947
it('should have table-bordered class as default', () => {
4048
expect(wrapper.find('table.table-bordered').length).toBe(1);
4149
});
@@ -80,4 +88,36 @@ describe('BootstrapTable', () => {
8088
expect(wrapper.find('table.table-condensed').length).toBe(0);
8189
});
8290
});
91+
92+
describe('when cellEdit props is defined', () => {
93+
const nonEditableRows = [data[1].id];
94+
const cellEdit = {
95+
mode: Const.CLICK_TO_CELL_EDIT,
96+
onEditing: sinon.stub(),
97+
nonEditableRows: () => nonEditableRows
98+
};
99+
100+
beforeEach(() => {
101+
wrapper = shallow(
102+
<BootstrapTable
103+
keyField="id"
104+
columns={ columns }
105+
data={ data }
106+
bordered={ false }
107+
cellEdit={ cellEdit }
108+
/>
109+
);
110+
});
111+
112+
it('should resolve correct cellEdit object to Body component', () => {
113+
const body = wrapper.find(Body);
114+
expect(body.length).toBe(1);
115+
expect(body.props().cellEdit.nonEditableRows).toEqual(nonEditableRows);
116+
expect(body.props().cellEdit.ridx).toEqual(wrapper.state().currEditCell.ridx);
117+
expect(body.props().cellEdit.cidx).toEqual(wrapper.state().currEditCell.cidx);
118+
expect(body.props().cellEdit.onStart).toBeDefined();
119+
expect(body.props().cellEdit.onEscape).toBeDefined();
120+
expect(body.props().cellEdit.onComplete).toBeDefined();
121+
});
122+
});
83123
});

‎packages/react-bootstrap-table2/test/cell.test.js

Lines changed: 95 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import React from 'react';
22
import sinon from 'sinon';
33
import { shallow } from 'enzyme';
44

5+
import Const from '../src/const';
56
import Cell from '../src/cell';
67

78
describe('Cell', () => {
@@ -447,4 +448,98 @@ describe('Cell', () => {
447448
});
448449
});
449450
});
451+
452+
describe('when editable prop is true', () => {
453+
let onStartCallBack;
454+
const rowIndex = 1;
455+
const columnIndex = 1;
456+
const column = {
457+
dataField: 'id',
458+
text: 'ID'
459+
};
460+
461+
beforeEach(() => {
462+
onStartCallBack = sinon.stub().withArgs(rowIndex, columnIndex);
463+
});
464+
465+
describe(`and editMode is ${Const.CLICK_TO_CELL_EDIT}`, () => {
466+
beforeEach(() => {
467+
wrapper = shallow(
468+
<Cell
469+
row={ row }
470+
rowIndex={ rowIndex }
471+
column={ column }
472+
columnIndex={ columnIndex }
473+
editable
474+
editMode={ Const.CLICK_TO_CELL_EDIT }
475+
onStart={ onStartCallBack }
476+
/>
477+
);
478+
});
479+
480+
it('should render onClick attribute', () => {
481+
expect(wrapper.length).toBe(1);
482+
expect(wrapper.find('td').prop('onClick')).toBeDefined();
483+
});
484+
485+
it('should call onStart correctly when clicking cell', () => {
486+
wrapper.find('td').simulate('click');
487+
expect(onStartCallBack.callCount).toBe(1);
488+
expect(onStartCallBack.calledWith(rowIndex, columnIndex)).toBe(true);
489+
});
490+
491+
describe('if when column.events.onClick prop is defined', () => {
492+
beforeEach(() => {
493+
column.events = {
494+
onClick: sinon.stub()
495+
};
496+
});
497+
it('should calling custom onClick callback also', () => {
498+
wrapper.find('td').simulate('click');
499+
expect(onStartCallBack.callCount).toBe(1);
500+
expect(column.events.onClick.callCount).toBe(1);
501+
});
502+
});
503+
});
504+
505+
describe(`and editMode is ${Const.DBCLICK_TO_CELL_EDIT}`, () => {
506+
beforeEach(() => {
507+
wrapper = shallow(
508+
<Cell
509+
row={ row }
510+
rowIndex={ 1 }
511+
column={ column }
512+
columnIndex={ 1 }
513+
editable
514+
editMode={ Const.DBCLICK_TO_CELL_EDIT }
515+
onStart={ onStartCallBack }
516+
/>
517+
);
518+
});
519+
520+
it('should render onDoubleClick attribute', () => {
521+
expect(wrapper.length).toBe(1);
522+
expect(wrapper.find('td').prop('onDoubleClick')).toBeDefined();
523+
});
524+
525+
it('should call onStart correctly when double clicking cell', () => {
526+
wrapper.find('td').simulate('doubleclick');
527+
expect(onStartCallBack.callCount).toBe(1);
528+
expect(onStartCallBack.calledWith(rowIndex, columnIndex)).toBe(true);
529+
});
530+
531+
describe('if when column.events.onDoubleClick prop is defined', () => {
532+
beforeEach(() => {
533+
column.events = {
534+
onDoubleClick: sinon.stub()
535+
};
536+
});
537+
it('should calling custom onDoubleClick callback also', () => {
538+
wrapper.find('td').simulate('doubleclick');
539+
expect(onStartCallBack.callCount).toBe(1);
540+
expect(column.events.onDoubleClick.callCount).toBe(1);
541+
});
542+
});
543+
});
544+
});
450545
});
Lines changed: 93 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,93 @@
1+
import 'jsdom-global/register';
2+
import React from 'react';
3+
import sinon from 'sinon';
4+
import { shallow, mount } from 'enzyme';
5+
6+
import { TableRowWrapper } from './test-helpers/table-wrapper';
7+
import EditingCell from '../src/editing-cell';
8+
import TextEditor from '../src/text-editor';
9+
10+
11+
describe('EditingCell', () => {
12+
let wrapper;
13+
let onEscape;
14+
let onComplete;
15+
const row = {
16+
id: 1,
17+
name: 'A'
18+
};
19+
20+
const column = {
21+
dataField: 'id',
22+
text: 'ID'
23+
};
24+
25+
beforeEach(() => {
26+
onComplete = sinon.stub();
27+
onEscape = sinon.stub();
28+
wrapper = shallow(
29+
<EditingCell
30+
row={ row }
31+
column={ column }
32+
onEscape={ onEscape }
33+
onComplete={ onComplete }
34+
/>
35+
);
36+
});
37+
38+
it('should render default editor successfully', () => {
39+
expect(wrapper.length).toBe(1);
40+
expect(wrapper.find('td').length).toBe(1);
41+
expect(wrapper.find(TextEditor).length).toBe(1);
42+
});
43+
44+
it('should render TextEditor with correct props', () => {
45+
const textEditor = wrapper.find(TextEditor);
46+
expect(textEditor.props().defaultValue).toEqual(row[column.dataField]);
47+
expect(textEditor.props().onKeyDown).toBeDefined();
48+
expect(textEditor.props().onBlur).toBeDefined();
49+
});
50+
51+
it('when press ENTER on TextEditor should call onComplete correctly', () => {
52+
const newValue = 'test';
53+
const textEditor = wrapper.find(TextEditor);
54+
textEditor.simulate('keyDown', { keyCode: 13, currentTarget: { value: newValue } });
55+
expect(onComplete.callCount).toBe(1);
56+
expect(onComplete.calledWith(row, column, newValue)).toBe(true);
57+
});
58+
59+
it('when press ESC on TextEditor should call onEscape correctly', () => {
60+
const textEditor = wrapper.find(TextEditor);
61+
textEditor.simulate('keyDown', { keyCode: 27 });
62+
expect(onEscape.callCount).toBe(1);
63+
});
64+
65+
it('when blur from TextEditor should call onEscape correctly', () => {
66+
const textEditor = wrapper.find(TextEditor);
67+
textEditor.simulate('blur');
68+
expect(onEscape.callCount).toBe(1);
69+
});
70+
71+
describe('if blurToSave prop is true', () => {
72+
beforeEach(() => {
73+
wrapper = mount(
74+
<TableRowWrapper>
75+
<EditingCell
76+
row={ row }
77+
column={ column }
78+
onEscape={ onEscape }
79+
onComplete={ onComplete }
80+
blurToSave
81+
/>
82+
</TableRowWrapper>
83+
);
84+
});
85+
86+
it('when blur from TextEditor should call onComplete correctly', () => {
87+
const textEditor = wrapper.find(TextEditor);
88+
textEditor.simulate('blur');
89+
expect(onComplete.callCount).toBe(1);
90+
expect(onComplete.calledWith(row, column, `${row[column.dataField]}`)).toBe(true);
91+
});
92+
});
93+
});

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /