Skip to content

Commit c96aa43

Browse files
simonguosimonguo
authored
test(Test): add uncovered test cases for TreeTable (#419)
1 parent eac4b0a commit c96aa43

File tree

2 files changed

+361
-310
lines changed

2 files changed

+361
-310
lines changed

‎test/TableSpec.js

Lines changed: 0 additions & 310 deletions
Original file line numberDiff line numberDiff line change
@@ -252,66 +252,6 @@ describe('Table', () => {
252252
expect(cellContent.style.wordBreak).to.equal('keep-all');
253253
});
254254

255-
it('Should be wordWrap when isTree', async () => {
256-
const data = [{ id: 1, country: 'South Georgia and the South Sandwich Islands' }];
257-
const ref = React.createRef();
258-
259-
render(
260-
<Table ref={ref} wordWrap isTree data={data} rowKey="id">
261-
<Column width={20}>
262-
<HeaderCell>Country</HeaderCell>
263-
<Cell dataKey="country" />
264-
</Column>
265-
</Table>
266-
);
267-
268-
const table = ref.current.root;
269-
const cell = table.querySelectorAll('.rs-table-cell')[1];
270-
271-
expect(cell).to.text('South Georgia and the South Sandwich Islands');
272-
273-
await waitFor(() => {
274-
expect(getHeight(cell)).to.be.gt(46);
275-
});
276-
});
277-
278-
it('Should be wordWrap when node is expanded', async () => {
279-
const data = [
280-
{
281-
id: 1,
282-
country: 'Test',
283-
children: [{ id: 2, country: 'South Georgia and the South Sandwich Islands' }]
284-
}
285-
];
286-
const ref = React.createRef();
287-
288-
act(() => {
289-
render(
290-
<Table ref={ref} wordWrap isTree data={data} rowKey="id">
291-
<Column width={20}>
292-
<HeaderCell>Country</HeaderCell>
293-
<Cell dataKey="country" />
294-
</Column>
295-
</Table>
296-
);
297-
});
298-
299-
const table = ref.current.root;
300-
const button = table.querySelector('.rs-table-cell-expand-wrapper');
301-
302-
expect(table.querySelectorAll('.rs-table-cell')[2]).to.be.not.exist;
303-
304-
fireEvent.click(button);
305-
306-
const cell = table.querySelectorAll('.rs-table-cell')[2];
307-
308-
expect(cell).to.text('South Georgia and the South Sandwich Islands');
309-
310-
await waitFor(() => {
311-
expect(getHeight(cell)).to.be.gt(46);
312-
});
313-
});
314-
315255
it('Should be automatic height', () => {
316256
const instance = getDOMNode(
317257
<Table
@@ -442,95 +382,6 @@ describe('Table', () => {
442382
expect(instance).to.style('height', '500px');
443383
});
444384

445-
it('Should render custom tree columns', () => {
446-
const instance = getDOMNode(
447-
<Table
448-
isTree
449-
defaultExpandAllRows
450-
rowKey="id"
451-
data={[
452-
{
453-
id: 1,
454-
name: 'a',
455-
children: [
456-
{
457-
id: 2,
458-
name: 'b'
459-
}
460-
]
461-
}
462-
]}
463-
>
464-
<Column>
465-
<HeaderCell>a</HeaderCell>
466-
<Cell>a</Cell>
467-
</Column>
468-
<Column treeCol>
469-
<HeaderCell>b</HeaderCell>
470-
<Cell>b</Cell>
471-
</Column>
472-
</Table>
473-
);
474-
475-
expect(
476-
instance.querySelector('.rs-table-body-row-wrapper .rs-table-cell-expand-wrapper').parentNode
477-
).to.be.text('b');
478-
});
479-
480-
it('Should render custom tree toggle', () => {
481-
const ref = React.createRef();
482-
act(() => {
483-
render(
484-
<Table
485-
isTree
486-
ref={ref}
487-
expandedRowKeys={[1]}
488-
rowKey="id"
489-
renderTreeToggle={(expandButton, rowData, expanded) => {
490-
if (expanded) {
491-
return <div className="toggle-open">{rowData.name}</div>;
492-
}
493-
return <div className="toggle-close">{rowData.name}</div>;
494-
}}
495-
data={[
496-
{
497-
id: 1,
498-
name: 'a',
499-
children: [
500-
{
501-
id: 2,
502-
name: 'b',
503-
children: [
504-
{
505-
id: 3,
506-
name: 'c'
507-
}
508-
]
509-
}
510-
]
511-
}
512-
]}
513-
>
514-
<Column>
515-
<HeaderCell>a</HeaderCell>
516-
<Cell>a</Cell>
517-
</Column>
518-
<Column treeCol>
519-
<HeaderCell>b</HeaderCell>
520-
<Cell>b</Cell>
521-
</Column>
522-
</Table>
523-
);
524-
});
525-
526-
const table = ref.current.root;
527-
const openRows = table.querySelectorAll('.toggle-open');
528-
529-
expect(openRows).to.be.length(1);
530-
expect(openRows[0]).to.be.text('a');
531-
expect(table.querySelector('.toggle-close')).to.be.text('b');
532-
});
533-
534385
it('Should call `rowHeight` callback', done => {
535386
const doneOp = () => {
536387
done();
@@ -570,38 +421,6 @@ describe('Table', () => {
570421
expect(onWheelSpy).to.have.been.calledOnce;
571422
});
572423

573-
it('Should call `onExpandChange` callback', () => {
574-
const onExpandChangeSpy = sinon.spy();
575-
const instance = getDOMNode(
576-
<Table
577-
onExpandChange={onExpandChangeSpy}
578-
isTree
579-
rowKey="id"
580-
data={[
581-
{
582-
id: 1,
583-
name: 'a',
584-
hasChildren: true,
585-
children: [
586-
{
587-
id: 2,
588-
name: 'b'
589-
}
590-
]
591-
}
592-
]}
593-
>
594-
<Column>
595-
<HeaderCell>11</HeaderCell>
596-
<Cell dataKey="id" />
597-
</Column>
598-
</Table>
599-
);
600-
601-
fireEvent.click(instance.querySelector('.rs-table-cell-expand-icon'));
602-
expect(onExpandChangeSpy).to.have.been.calledOnce;
603-
});
604-
605424
it('Should get the body DOM', () => {
606425
const data = [
607426
{
@@ -783,135 +602,6 @@ describe('Table', () => {
783602
assert.equal(table.querySelectorAll('.rs-table-cell-group-fixed-left').length, 1);
784603
});
785604

786-
// https://github.com/rsuite/rsuite/issues/1257
787-
it('Should change data, after the isTree property is changed', () => {
788-
const data = [
789-
{
790-
rowKey: 'a',
791-
name: 'tets',
792-
num: 1999,
793-
children: [
794-
{
795-
name: 'test-1',
796-
num: 1000
797-
},
798-
{
799-
name: 'test-2',
800-
num: 999
801-
}
802-
]
803-
}
804-
];
805-
const App = React.forwardRef((props, ref) => {
806-
const [tree, setTree] = React.useState(true);
807-
const tableRef = React.useRef();
808-
React.useImperativeHandle(ref, () => ({
809-
get table() {
810-
return tableRef.current.root;
811-
},
812-
setTree
813-
}));
814-
return (
815-
<div>
816-
<Table
817-
ref={tableRef}
818-
isTree={tree}
819-
data={data}
820-
showHeader={false}
821-
rowKey="rowKey"
822-
defaultExpandAllRows
823-
>
824-
<Column>
825-
<HeaderCell>name</HeaderCell>
826-
<Cell dataKey="name" />
827-
</Column>
828-
<Column>
829-
<HeaderCell>num</HeaderCell>
830-
<Cell dataKey="num" />
831-
</Column>
832-
</Table>
833-
</div>
834-
);
835-
});
836-
App.displayName = 'App';
837-
const ref = React.createRef();
838-
act(() => {
839-
render(<App ref={ref} />);
840-
});
841-
842-
const table = ref.current.table;
843-
844-
assert.equal(table.querySelectorAll('.rs-table-row').length, 3);
845-
846-
act(() => {
847-
ref.current.setTree(false);
848-
});
849-
850-
assert.equal(table.querySelectorAll('.rs-table-row').length, 1);
851-
assert.equal(getHeight(table.querySelector('.rs-table-row')), 46);
852-
});
853-
854-
it('Should show a vertical scroll bar when the tree is expanded', () => {
855-
const data = [
856-
{
857-
name: '1',
858-
children: [
859-
{
860-
name: '1-1'
861-
},
862-
{
863-
name: '1-2'
864-
},
865-
{
866-
name: '1-3'
867-
},
868-
{
869-
name: '1-4'
870-
},
871-
{
872-
name: '1-5'
873-
},
874-
{
875-
name: '1-6'
876-
},
877-
{
878-
name: '1-7'
879-
},
880-
{
881-
name: '1-8'
882-
},
883-
{
884-
name: '1-9'
885-
}
886-
]
887-
}
888-
];
889-
890-
const ref = React.createRef();
891-
892-
render(
893-
<Table ref={ref} isTree data={data} showHeader={false} rowKey="name" height={100}>
894-
<Column>
895-
<HeaderCell>name</HeaderCell>
896-
<Cell dataKey="name" />
897-
</Column>
898-
</Table>
899-
);
900-
901-
const table = ref.current.root;
902-
const expand = table.querySelector('.rs-table-cell-expand-icon');
903-
904-
// Before the Tree expands, it displays 1 row without vertical scroll bar.
905-
assert.equal(table.querySelectorAll('.rs-table-row').length, 1);
906-
assert.isNull(table.querySelector('.rs-table-scrollbar-vertical'));
907-
908-
fireEvent.click(expand);
909-
910-
// After the Tree is expanded, 10 rows are displayed and a vertical scroll bar is displayed at the same time.
911-
assert.equal(table.querySelectorAll('.rs-table-row').length, 10);
912-
assert.isNotNull(table.querySelector('.rs-table-scrollbar-vertical'));
913-
});
914-
915605
it('Should render 2 ColumnGroup', () => {
916606
const ref = React.createRef();
917607
const columnData = [

0 commit comments

Comments
 (0)