mirror of
https://github.com/ant-design/ant-design.git
synced 2025-01-18 22:36:31 +08:00
Add test case for empty table
This commit is contained in:
afc163
parent
6527f9cdb0
commit
a94e3ab3e0
529
components/table/__tests__/__snapshots__/empty.test.js.snap
Normal file
529
components/table/__tests__/__snapshots__/empty.test.js.snap
Normal file
@ -0,0 +1,529 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`Table renders empty table 1`] = `
|
||||
<div
|
||||
class="ant-table-wrapper"
|
||||
>
|
||||
<div
|
||||
class="ant-spin-nested-loading"
|
||||
>
|
||||
<div
|
||||
class="ant-spin-container"
|
||||
>
|
||||
<div
|
||||
class="ant-table ant-table-large ant-table-empty ant-table-scroll-position-left"
|
||||
>
|
||||
<div
|
||||
class="ant-table-content"
|
||||
>
|
||||
<div
|
||||
class="ant-table-body"
|
||||
>
|
||||
<table
|
||||
class=""
|
||||
>
|
||||
<colgroup>
|
||||
<col />
|
||||
<col />
|
||||
<col />
|
||||
<col />
|
||||
<col />
|
||||
<col />
|
||||
<col />
|
||||
<col />
|
||||
</colgroup>
|
||||
<thead
|
||||
class="ant-table-thead"
|
||||
>
|
||||
<tr>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Column 1
|
||||
</span>
|
||||
</th>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Column 2
|
||||
</span>
|
||||
</th>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Column 3
|
||||
</span>
|
||||
</th>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Column 4
|
||||
</span>
|
||||
</th>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Column 5
|
||||
</span>
|
||||
</th>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Column 6
|
||||
</span>
|
||||
</th>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Column 7
|
||||
</span>
|
||||
</th>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Column 8
|
||||
</span>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody
|
||||
class="ant-table-tbody"
|
||||
/>
|
||||
</table>
|
||||
</div>
|
||||
<div
|
||||
class="ant-table-placeholder"
|
||||
>
|
||||
<span>
|
||||
<i
|
||||
class="anticon anticon-frown-o"
|
||||
/>
|
||||
暂无数据
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`Table renders empty table with custom emptyText 1`] = `
|
||||
<div
|
||||
class="ant-table-wrapper"
|
||||
>
|
||||
<div
|
||||
class="ant-spin-nested-loading"
|
||||
>
|
||||
<div
|
||||
class="ant-spin-container"
|
||||
>
|
||||
<div
|
||||
class="ant-table ant-table-large ant-table-empty ant-table-scroll-position-left"
|
||||
>
|
||||
<div
|
||||
class="ant-table-content"
|
||||
>
|
||||
<div
|
||||
class="ant-table-body"
|
||||
>
|
||||
<table
|
||||
class=""
|
||||
>
|
||||
<colgroup>
|
||||
<col />
|
||||
<col />
|
||||
<col />
|
||||
<col />
|
||||
<col />
|
||||
<col />
|
||||
<col />
|
||||
<col />
|
||||
</colgroup>
|
||||
<thead
|
||||
class="ant-table-thead"
|
||||
>
|
||||
<tr>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Column 1
|
||||
</span>
|
||||
</th>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Column 2
|
||||
</span>
|
||||
</th>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Column 3
|
||||
</span>
|
||||
</th>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Column 4
|
||||
</span>
|
||||
</th>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Column 5
|
||||
</span>
|
||||
</th>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Column 6
|
||||
</span>
|
||||
</th>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Column 7
|
||||
</span>
|
||||
</th>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Column 8
|
||||
</span>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody
|
||||
class="ant-table-tbody"
|
||||
/>
|
||||
</table>
|
||||
</div>
|
||||
<div
|
||||
class="ant-table-placeholder"
|
||||
>
|
||||
custom empty text
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`Table renders empty table with fixed columns 1`] = `
|
||||
<div
|
||||
class="ant-table-wrapper"
|
||||
>
|
||||
<div
|
||||
class="ant-spin-nested-loading"
|
||||
>
|
||||
<div
|
||||
class="ant-spin-container"
|
||||
>
|
||||
<div
|
||||
class="ant-table ant-table-large ant-table-empty ant-table-scroll-position-left"
|
||||
>
|
||||
<div
|
||||
class="ant-table-content"
|
||||
>
|
||||
<div
|
||||
class="ant-table-scroll"
|
||||
>
|
||||
<div
|
||||
class="ant-table-body"
|
||||
>
|
||||
<table
|
||||
class=""
|
||||
>
|
||||
<colgroup>
|
||||
<col
|
||||
style="width:100px;min-width:100px;"
|
||||
/>
|
||||
<col
|
||||
style="width:100px;min-width:100px;"
|
||||
/>
|
||||
<col />
|
||||
<col />
|
||||
<col />
|
||||
<col />
|
||||
<col />
|
||||
<col />
|
||||
<col />
|
||||
<col />
|
||||
<col
|
||||
style="width:100px;min-width:100px;"
|
||||
/>
|
||||
</colgroup>
|
||||
<thead
|
||||
class="ant-table-thead"
|
||||
>
|
||||
<tr>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Full Name
|
||||
</span>
|
||||
</th>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Age
|
||||
</span>
|
||||
</th>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Column 1
|
||||
</span>
|
||||
</th>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Column 2
|
||||
</span>
|
||||
</th>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Column 3
|
||||
</span>
|
||||
</th>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Column 4
|
||||
</span>
|
||||
</th>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Column 5
|
||||
</span>
|
||||
</th>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Column 6
|
||||
</span>
|
||||
</th>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Column 7
|
||||
</span>
|
||||
</th>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Column 8
|
||||
</span>
|
||||
</th>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Action
|
||||
</span>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody
|
||||
class="ant-table-tbody"
|
||||
>
|
||||
<tr
|
||||
class="ant-table-row ant-table-row-level-0"
|
||||
>
|
||||
<td
|
||||
class=""
|
||||
>
|
||||
<span
|
||||
class="ant-table-row-indent indent-level-0"
|
||||
style="padding-left:0px;"
|
||||
/>
|
||||
</td>
|
||||
<td
|
||||
class=""
|
||||
/>
|
||||
<td
|
||||
class=""
|
||||
/>
|
||||
<td
|
||||
class=""
|
||||
/>
|
||||
<td
|
||||
class=""
|
||||
/>
|
||||
<td
|
||||
class=""
|
||||
/>
|
||||
<td
|
||||
class=""
|
||||
/>
|
||||
<td
|
||||
class=""
|
||||
/>
|
||||
<td
|
||||
class=""
|
||||
/>
|
||||
<td
|
||||
class=""
|
||||
/>
|
||||
<td
|
||||
class=""
|
||||
/>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div
|
||||
class="ant-table-placeholder ant-table-placeholder-fixed-columns"
|
||||
>
|
||||
<span>
|
||||
<i
|
||||
class="anticon anticon-frown-o"
|
||||
/>
|
||||
暂无数据
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="ant-table-fixed-left"
|
||||
>
|
||||
<div
|
||||
class="ant-table-body-outer"
|
||||
>
|
||||
<div
|
||||
class="ant-table-body-inner"
|
||||
>
|
||||
<table
|
||||
class="ant-table-fixed"
|
||||
>
|
||||
<colgroup>
|
||||
<col
|
||||
style="width:100px;min-width:100px;"
|
||||
/>
|
||||
<col
|
||||
style="width:100px;min-width:100px;"
|
||||
/>
|
||||
</colgroup>
|
||||
<thead
|
||||
class="ant-table-thead"
|
||||
>
|
||||
<tr>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Full Name
|
||||
</span>
|
||||
</th>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Age
|
||||
</span>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody
|
||||
class="ant-table-tbody"
|
||||
>
|
||||
<tr
|
||||
class="ant-table-row ant-table-row-level-0"
|
||||
>
|
||||
<td
|
||||
class=""
|
||||
>
|
||||
<span
|
||||
class="ant-table-row-indent indent-level-0"
|
||||
style="padding-left:0px;"
|
||||
/>
|
||||
</td>
|
||||
<td
|
||||
class=""
|
||||
/>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="ant-table-fixed-right"
|
||||
>
|
||||
<div
|
||||
class="ant-table-body-outer"
|
||||
>
|
||||
<div
|
||||
class="ant-table-body-inner"
|
||||
>
|
||||
<table
|
||||
class="ant-table-fixed"
|
||||
>
|
||||
<colgroup>
|
||||
<col
|
||||
style="width:100px;min-width:100px;"
|
||||
/>
|
||||
</colgroup>
|
||||
<thead
|
||||
class="ant-table-thead"
|
||||
>
|
||||
<tr>
|
||||
<th
|
||||
class=""
|
||||
>
|
||||
<span>
|
||||
Action
|
||||
</span>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody
|
||||
class="ant-table-tbody"
|
||||
>
|
||||
<tr
|
||||
class="ant-table-row ant-table-row-level-0"
|
||||
>
|
||||
<td
|
||||
class=""
|
||||
/>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
61
components/table/__tests__/empty.test.js
Normal file
61
components/table/__tests__/empty.test.js
Normal file
@ -0,0 +1,61 @@
|
||||
import React from 'react';
|
||||
import { render } from 'enzyme';
|
||||
import Table from '..';
|
||||
|
||||
const columns = [
|
||||
{ title: 'Column 1', dataIndex: 'address', key: '1' },
|
||||
{ title: 'Column 2', dataIndex: 'address', key: '2' },
|
||||
{ title: 'Column 3', dataIndex: 'address', key: '3' },
|
||||
{ title: 'Column 4', dataIndex: 'address', key: '4' },
|
||||
{ title: 'Column 5', dataIndex: 'address', key: '5' },
|
||||
{ title: 'Column 6', dataIndex: 'address', key: '6' },
|
||||
{ title: 'Column 7', dataIndex: 'address', key: '7' },
|
||||
{ title: 'Column 8', dataIndex: 'address', key: '8' },
|
||||
];
|
||||
|
||||
const columnsFixed = [
|
||||
{ title: 'Full Name', width: 100, dataIndex: 'name', key: 'name', fixed: 'left' },
|
||||
{ title: 'Age', width: 100, dataIndex: 'age', key: 'age', fixed: 'left' },
|
||||
{ title: 'Column 1', dataIndex: 'address', key: '1' },
|
||||
{ title: 'Column 2', dataIndex: 'address', key: '2' },
|
||||
{ title: 'Column 3', dataIndex: 'address', key: '3' },
|
||||
{ title: 'Column 4', dataIndex: 'address', key: '4' },
|
||||
{ title: 'Column 5', dataIndex: 'address', key: '5' },
|
||||
{ title: 'Column 6', dataIndex: 'address', key: '6' },
|
||||
{ title: 'Column 7', dataIndex: 'address', key: '7' },
|
||||
{ title: 'Column 8', dataIndex: 'address', key: '8' },
|
||||
{
|
||||
title: 'Action',
|
||||
key: 'address',
|
||||
fixed: 'right',
|
||||
width: 100,
|
||||
},
|
||||
];
|
||||
|
||||
describe('Table', () => {
|
||||
it('renders empty table', () => {
|
||||
const wrapper = render(
|
||||
<Table dataSource={[]} columns={columns} pagination={false} />
|
||||
);
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('renders empty table with fixed columns', () => {
|
||||
const wrapper = render(
|
||||
<Table dataSource={[]} columns={columnsFixed} pagination={false} />
|
||||
);
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('renders empty table with custom emptyText', () => {
|
||||
const wrapper = render(
|
||||
<Table
|
||||
dataSource={[]}
|
||||
columns={columns}
|
||||
pagination={false}
|
||||
locale={{ emptyText: 'custom empty text ' }}
|
||||
/>
|
||||
);
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
});
|
||||
});
|
||||
Loading…
Reference in New Issue
Block a user