Browse Source

perf: some code

pull/398/head
tangjinzhou 6 years ago
parent
commit
380e4cd53d
  1. 2
      components/form/__tests__/__snapshots__/demo.test.js.snap
  2. 4
      components/grid/__tests__/__snapshots__/demo.test.js.snap
  3. 2
      components/modal/Modal.jsx
  4. 3
      components/modal/confirm.js
  5. 2
      components/pagination/Pagination.jsx
  6. 12
      components/progress/__tests__/__snapshots__/index.test.js.snap
  7. 5
      components/progress/__tests__/index.test.js
  8. 20
      components/spin/Spin.jsx
  9. 12
      components/spin/__tests__/__snapshots__/index.test.js.snap
  10. 64
      components/table/__tests__/__snapshots__/Table.filter.test.js.snap
  11. 68
      components/table/__tests__/__snapshots__/Table.pagination.test.js.snap
  12. 173
      components/table/__tests__/__snapshots__/Table.rowSelection.test.js.snap
  13. 67
      components/table/__tests__/__snapshots__/Table.test.js.snap
  14. 337
      components/table/__tests__/__snapshots__/empty.test.js.snap
  15. 2
      components/vc-menu/MenuItem.jsx

2
components/form/__tests__/__snapshots__/demo.test.js.snap

@ -545,7 +545,7 @@ exports[`renders ./components/form/demo/validate-other.vue correctly 1`] = `
<div class="ant-row ant-form-item">
<div class="ant-col-6 ant-form-item-label"><label for="slider" title="Slider" class="">Slider</label></div>
<div class="ant-col-14 ant-form-item-control-wrapper">
<div class="ant-form-item-control"><span class="ant-form-item-children"><div class="ant-slider ant-slider-with-marks" data-__meta="[object Object]" data-__field="[object Object]" id="slider"><div class="ant-slider-rail"></div><div class="ant-slider-track" style="left: 0%; width: 0%;"></div><div class="ant-slider-step"><span class="ant-slider-dot ant-slider-dot-active" style="left: 0%;"></span><span class="ant-slider-dot" style="left: 20%;"></span><span class="ant-slider-dot" style="left: 40%;"></span><span class="ant-slider-dot" style="left: 60%;"></span><span class="ant-slider-dot" style="left: 80%;"></span><span class="ant-slider-dot" style="left: 100%;"></span></div>
<div class="ant-form-item-control"><span class="ant-form-item-children"><div tabindex="-1" class="ant-slider ant-slider-with-marks" data-__meta="[object Object]" data-__field="[object Object]" id="slider"><div class="ant-slider-rail"></div><div class="ant-slider-track" style="left: 0%; width: 0%;"></div><div class="ant-slider-step"><span class="ant-slider-dot ant-slider-dot-active" style="left: 0%;"></span><span class="ant-slider-dot" style="left: 20%;"></span><span class="ant-slider-dot" style="left: 40%;"></span><span class="ant-slider-dot" style="left: 60%;"></span><span class="ant-slider-dot" style="left: 80%;"></span><span class="ant-slider-dot" style="left: 100%;"></span></div>
<div role="slider" tabindex="0" aria-valuemin="0" aria-valuemax="100" aria-valuenow="0" class="ant-slider-handle" style="left: 0%;"></div>
<div class="ant-slider-mark"><span class="ant-slider-mark-text ant-slider-mark-text-active" style="width: 18%; margin-left: -9%; left: 0%;">A</span><span class="ant-slider-mark-text" style="width: 18%; margin-left: -9%; left: 20%;">B</span><span class="ant-slider-mark-text" style="width: 18%; margin-left: -9%; left: 40%;">C</span><span class="ant-slider-mark-text" style="width: 18%; margin-left: -9%; left: 60%;">D</span><span class="ant-slider-mark-text" style="width: 18%; margin-left: -9%; left: 80%;">E</span><span class="ant-slider-mark-text" style="width: 18%; margin-left: -9%; left: 100%;">F</span></div>
</div></span>

4
components/grid/__tests__/__snapshots__/demo.test.js.snap

@ -160,7 +160,7 @@ exports[`renders ./components/grid/demo/playfround.md correctly 1`] = `
<div id="components-grid-demo-playground">
<div style="margin-bottom: 16px;"><span style="margin-right: 6px;">Gutter (px): </span>
<div style="width: 50%;">
<div class="ant-slider ant-slider-with-marks">
<div tabindex="-1" class="ant-slider ant-slider-with-marks">
<div class="ant-slider-rail"></div>
<div class="ant-slider-track" style="left: 0%; width: 20%;"></div>
<div class="ant-slider-step"><span class="ant-slider-dot ant-slider-dot-active" style="left: 0%;"></span><span class="ant-slider-dot ant-slider-dot-active" style="left: 20%;"></span><span class="ant-slider-dot" style="left: 40%;"></span><span class="ant-slider-dot" style="left: 60%;"></span><span class="ant-slider-dot" style="left: 80%;"></span><span class="ant-slider-dot" style="left: 100%;"></span></div>
@ -169,7 +169,7 @@ exports[`renders ./components/grid/demo/playfround.md correctly 1`] = `
</div>
</div> <span style="margin-right: 6px;">Column Count:</span>
<div style="width: 50%;">
<div class="ant-slider ant-slider-with-marks">
<div tabindex="-1" class="ant-slider ant-slider-with-marks">
<div class="ant-slider-rail"></div>
<div class="ant-slider-track" style="left: 0%; width: 40%;"></div>
<div class="ant-slider-step"><span class="ant-slider-dot ant-slider-dot-active" style="left: 0%;"></span><span class="ant-slider-dot ant-slider-dot-active" style="left: 20%;"></span><span class="ant-slider-dot ant-slider-dot-active" style="left: 40%;"></span><span class="ant-slider-dot" style="left: 60%;"></span><span class="ant-slider-dot" style="left: 80%;"></span><span class="ant-slider-dot" style="left: 100%;"></span></div>

2
components/modal/Modal.jsx

@ -29,7 +29,7 @@ const modalProps = (defaultProps = {}) => {
/** 点击模态框右上角叉、取消按钮、Props.maskClosable 值为 true 时的遮罩层或键盘按下 Esc 时的回调*/
// onCancel: (e: React.MouseEvent<any>) => void,
afterClose: PropTypes.func.def(noop),
/** 居中 */
/** 垂直居中 */
centered: PropTypes.bool,
/** 宽度*/
width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),

3
components/modal/confirm.js

@ -26,8 +26,7 @@ export default function confirm (config) {
confirmDialogInstance = null
div.parentNode.removeChild(div)
}
const triggerCancel = args && args.length &&
args.some(param => param && param.triggerCancel)
const triggerCancel = args.some(param => param && param.triggerCancel)
if (config.onCancel && triggerCancel) {
config.onCancel(...args)
}

2
components/pagination/Pagination.jsx

@ -2,7 +2,6 @@
import PropTypes from '../_util/vue-types'
import VcSelect from '../select'
import MiniSelect from './MiniSelect'
import enUS from '../vc-pagination/locale/en_US'
import LocaleReceiver from '../locale-provider/LocaleReceiver'
import { getOptionProps } from '../_util/props-util'
import VcPagination from '../vc-pagination'
@ -121,7 +120,6 @@ export default {
return (
<LocaleReceiver
componentName='Pagination'
defaultLocale={enUS}
scopedSlots={
{ default: this.renderPagination }
}

12
components/progress/__tests__/__snapshots__/index.test.js.snap

@ -51,6 +51,18 @@ exports[`Progress render negetive successPercent 2`] = `
</div>
`;
exports[`Progress render normal progress 1`] = `
<div class="ant-progress ant-progress-line ant-progress-status-normal ant-progress-show-info ant-progress-default">
<div>
<div class="ant-progress-outer">
<div class="ant-progress-inner">
<div class="ant-progress-bg" style="width: 0%; height: 8px; border-radius: 100px;"></div>
</div>
</div><span title="0%" class="ant-progress-text">0%</span>
</div>
</div>
`;
exports[`Progress render out-of-range progress 1`] = `
<div class="ant-progress ant-progress-line ant-progress-status-success ant-progress-show-info ant-progress-default">
<div>

5
components/progress/__tests__/index.test.js

@ -98,4 +98,9 @@ describe('Progress', () => {
expect(wrapper.html()).toMatchSnapshot()
})
})
it('render normal progress', () => {
const wrapper = mount(Progress, { propsData: { status: 'normal' }})
expect(wrapper.html()).toMatchSnapshot()
})
})

20
components/spin/Spin.jsx

@ -48,14 +48,6 @@ export default {
}
},
mounted () {
this.$nextTick(() => {
const { spinning, delay } = this
if (shouldDelay(spinning, delay)) {
this.delayTimeout = window.setTimeout(this.delayUpdateSpinning, delay)
}
})
},
updated () {
this.$nextTick(() => {
const { delay, spinning, sSpinning } = this
@ -150,26 +142,18 @@ export default {
)
const children = this.getChildren()
if (children) {
let animateClassName = prefixCls + '-nested-loading'
if (wrapperClassName) {
animateClassName += ' ' + wrapperClassName
}
const containerClassName = {
[`${prefixCls}-container`]: true,
[`${prefixCls}-blur`]: sSpinning,
}
return (
<transition-group
{...getTransitionProps('fade', { appear: false })}
tag='div'
class={animateClassName}
>
<div {...{ on: this.$listeners }} class={[`${prefixCls}-nested-loading`, wrapperClassName]}>
{sSpinning && <div key='loading'>{spinElement}</div>}
<div class={containerClassName} key='container'>
{children}
</div>
</transition-group>
</div>
)
}
return spinElement

12
components/spin/__tests__/__snapshots__/index.test.js.snap

@ -1,12 +1,14 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Spin should only affect the spin element when set style to a nested <Spin>xx</Spin> 1`] = `
<span tag="div" class="ant-spin-nested-loading" style="background: red;"><div><div class="ant-spin ant-spin-spinning"><span class="ant-spin-dot ant-spin-dot-spin"><i></i><i></i><i></i><i></i></span></div>
<div class="ant-spin-nested-loading" style="background: red;">
<div>
<div class="ant-spin ant-spin-spinning"><span class="ant-spin-dot ant-spin-dot-spin"><i></i><i></i><i></i><i></i></span></div>
</div>
<div class="ant-spin-container ant-spin-blur">
<div>content</div>
</div>
</div>
<div class="ant-spin-container ant-spin-blur">
<div>content</div>
</div>
</span>
`;
exports[`Spin should render custom indicator when it's set 1`] = `

64
components/table/__tests__/__snapshots__/Table.filter.test.js.snap

@ -11,27 +11,51 @@ exports[`Table.filter renders custom content correctly 1`] = `
`;
exports[`Table.filter renders filter correctly 1`] = `
<div class="ant-table-wrapper"><span tag="div" class="ant-spin-nested-loading"><div class="ant-spin-container"><div class="ant-table ant-table-scroll-position-left ant-table-default"><div class="ant-table-content"><!----><div class="ant-table-body"><table class=""><colgroup><col></colgroup><thead class="ant-table-thead"><tr><th key="name" class="ant-table-column-has-actions ant-table-column-has-filters"><div>Name</div><i title="Filter menu" class="anticon anticon-filter ant-dropdown-trigger"><svg viewBox="64 64 896 896" data-icon="filter" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M349 838c0 17.7 14.2 32 31.8 32h262.4c17.6 0 31.8-14.3 31.8-32V642H349v196zm531.1-684H143.9c-24.5 0-39.8 26.7-27.5 48l221.3 376h348.8l221.3-376c12.1-21.3-3.2-48-27.7-48z"></path></svg></i></th></tr></thead><tbody class="ant-table-tbody"><tr class="ant-table-row ant-table-row-level-0" data-row-key="0"><td class="ant-table-column-has-actions ant-table-column-has-filters"><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->Jack</td>
</tr>
<tr class="ant-table-row ant-table-row-level-0" data-row-key="1">
<td class="ant-table-column-has-actions ant-table-column-has-filters"><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->Lucy</td>
</tr>
<tr class="ant-table-row ant-table-row-level-0" data-row-key="2">
<td class="ant-table-column-has-actions ant-table-column-has-filters"><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->Tom</td>
</tr>
<tr class="ant-table-row ant-table-row-level-0" data-row-key="3">
<td class="ant-table-column-has-actions ant-table-column-has-filters"><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->Jerry</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="ant-table-wrapper">
<div class="ant-spin-nested-loading">
<div class="ant-spin-container">
<div class="ant-table ant-table-scroll-position-left ant-table-default">
<div class="ant-table-content">
<!---->
<div class="ant-table-body">
<table class="">
<colgroup>
<col>
</colgroup>
<thead class="ant-table-thead">
<tr>
<th key="name" class="ant-table-column-has-actions ant-table-column-has-filters">
<div>Name</div><i title="Filter menu" class="anticon anticon-filter ant-dropdown-trigger"><svg viewBox="64 64 896 896" data-icon="filter" width="1em" height="1em" fill="currentColor" aria-hidden="true" class="">
<path d="M349 838c0 17.7 14.2 32 31.8 32h262.4c17.6 0 31.8-14.3 31.8-32V642H349v196zm531.1-684H143.9c-24.5 0-39.8 26.7-27.5 48l221.3 376h348.8l221.3-376c12.1-21.3-3.2-48-27.7-48z"></path>
</svg></i>
</th>
</tr>
</thead>
<tbody class="ant-table-tbody">
<tr class="ant-table-row ant-table-row-level-0" data-row-key="0">
<td class="ant-table-column-has-actions ant-table-column-has-filters"><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->Jack</td>
</tr>
<tr class="ant-table-row ant-table-row-level-0" data-row-key="1">
<td class="ant-table-column-has-actions ant-table-column-has-filters"><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->Lucy</td>
</tr>
<tr class="ant-table-row ant-table-row-level-0" data-row-key="2">
<td class="ant-table-column-has-actions ant-table-column-has-filters"><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->Tom</td>
</tr>
<tr class="ant-table-row ant-table-row-level-0" data-row-key="3">
<td class="ant-table-column-has-actions ant-table-column-has-filters"><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->Jerry</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div></span></div>
`;
exports[`Table.filter renders menu correctly 1`] = `

68
components/table/__tests__/__snapshots__/Table.pagination.test.js.snap

@ -1,28 +1,50 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Table.pagination renders pagination correctly 1`] = `
<div class="ant-table-wrapper"><span tag="div" class="ant-spin-nested-loading"><div class="ant-spin-container"><div class="ant-table ant-table-scroll-position-left ant-table-default"><div class="ant-table-content"><!----><div class="ant-table-body"><table class=""><colgroup><col></colgroup><thead class="ant-table-thead"><tr><th key="name" class=""><div>Name</div></th></tr></thead><tbody class="ant-table-tbody"><tr class="ant-table-row ant-table-row-level-0" data-row-key="0"><td><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->Jack</td>
</tr>
<tr class="ant-table-row ant-table-row-level-0" data-row-key="1">
<td><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->Lucy</td>
</tr>
</tbody>
</table>
<div class="ant-table-wrapper">
<div class="ant-spin-nested-loading">
<div class="ant-spin-container">
<div class="ant-table ant-table-scroll-position-left ant-table-default">
<div class="ant-table-content">
<!---->
<div class="ant-table-body">
<table class="">
<colgroup>
<col>
</colgroup>
<thead class="ant-table-thead">
<tr>
<th key="name" class="">
<div>Name</div>
</th>
</tr>
</thead>
<tbody class="ant-table-tbody">
<tr class="ant-table-row ant-table-row-level-0" data-row-key="0">
<td><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->Jack</td>
</tr>
<tr class="ant-table-row ant-table-row-level-0" data-row-key="1">
<td><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->Lucy</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<ul unselectable="unselectable" class="ant-pagination my-page ant-table-pagination">
<li title="Previous Page" aria-disabled="true" class="ant-pagination-disabled ant-pagination-prev"><a class="ant-pagination-item-link"><i class="anticon anticon-left"><svg viewBox="64 64 896 896" data-icon="left" width="1em" height="1em" fill="currentColor" aria-hidden="true" class="">
<path d="M724 218.3V141c0-6.7-7.7-10.4-12.9-6.3L260.3 486.8a31.86 31.86 0 0 0 0 50.3l450.8 352.1c5.3 4.1 12.9.4 12.9-6.3v-77.3c0-4.9-2.3-9.6-6.1-12.6l-360-281 360-281.1c3.8-3 6.1-7.7 6.1-12.6z"></path>
</svg></i></a></li>
<li title="1" tabindex="0" class="ant-pagination-item ant-pagination-item-1 ant-pagination-item-active"><a>1</a></li>
<li title="2" tabindex="0" class="ant-pagination-item ant-pagination-item-2"><a>2</a></li>
<li title="Next Page" tabindex="0" class=" ant-pagination-next"><a class="ant-pagination-item-link"><i class="anticon anticon-right"><svg viewBox="64 64 896 896" data-icon="right" width="1em" height="1em" fill="currentColor" aria-hidden="true" class="">
<path d="M765.7 486.8L314.9 134.7A7.97 7.97 0 0 0 302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 0 0 0-50.4z"></path>
</svg></i></a></li>
<!---->
</ul>
</div>
</div>
</div>
</div>
</div>
<ul unselectable="unselectable" class="ant-pagination my-page ant-table-pagination">
<li title="Previous Page" aria-disabled="true" class="ant-pagination-disabled ant-pagination-prev"><a class="ant-pagination-item-link"><i class="anticon anticon-left"><svg viewBox="64 64 896 896" data-icon="left" width="1em" height="1em" fill="currentColor" aria-hidden="true" class="">
<path d="M724 218.3V141c0-6.7-7.7-10.4-12.9-6.3L260.3 486.8a31.86 31.86 0 0 0 0 50.3l450.8 352.1c5.3 4.1 12.9.4 12.9-6.3v-77.3c0-4.9-2.3-9.6-6.1-12.6l-360-281 360-281.1c3.8-3 6.1-7.7 6.1-12.6z"></path>
</svg></i></a></li>
<li title="1" tabindex="0" class="ant-pagination-item ant-pagination-item-1 ant-pagination-item-active"><a>1</a></li>
<li title="2" tabindex="0" class="ant-pagination-item ant-pagination-item-2"><a>2</a></li>
<li title="Next Page" tabindex="0" class=" ant-pagination-next"><a class="ant-pagination-item-link"><i class="anticon anticon-right"><svg viewBox="64 64 896 896" data-icon="right" width="1em" height="1em" fill="currentColor" aria-hidden="true" class="">
<path d="M765.7 486.8L314.9 134.7A7.97 7.97 0 0 0 302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 0 0 0-50.4z"></path>
</svg></i></a></li>
<!---->
</ul>
</div></span></div>
`;

173
components/table/__tests__/__snapshots__/Table.rowSelection.test.js.snap

@ -1,87 +1,106 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Table.rowSelection fix selection column on the left 1`] = `
<div class="ant-table-wrapper"><span tag="div" class="ant-spin-nested-loading"><div class="ant-spin-container"><div class="ant-table ant-table-default ant-table-scroll-position-left ant-table-scroll-position-right"><div class="ant-table-content"><div class="ant-table-scroll"><!----><div class="ant-table-body"><table class=""><colgroup><col><col></colgroup><thead class="ant-table-thead"><tr><th key="selection-column" class="ant-table-fixed-columns-in-body ant-table-selection-column"><div><div class="ant-table-selection"><label class="ant-checkbox-wrapper"><span class="ant-checkbox"><input type="checkbox" class="ant-checkbox-input" value=""><span class="ant-checkbox-inner"></span></span></label></div>
</div>
</th>
<th key="name" class="">
<div>Name</div>
</th>
</tr>
</thead>
<tbody class="ant-table-tbody">
<tr class="ant-table-row ant-table-row-level-0" data-row-key="0">
<td class="ant-table-fixed-columns-in-body ant-table-selection-column"><span><label class="ant-checkbox-wrapper"><span class="ant-checkbox"><input type="checkbox" class="ant-checkbox-input" value=""><span class="ant-checkbox-inner"></span></span></label></span></td>
<td><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->Jack</td>
</tr>
<tr class="ant-table-row ant-table-row-level-0" data-row-key="1">
<td class="ant-table-fixed-columns-in-body ant-table-selection-column"><span><label class="ant-checkbox-wrapper"><span class="ant-checkbox"><input type="checkbox" class="ant-checkbox-input" value=""><span class="ant-checkbox-inner"></span></span></label></span></td>
<td><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->Lucy</td>
</tr>
<tr class="ant-table-row ant-table-row-level-0" data-row-key="2">
<td class="ant-table-fixed-columns-in-body ant-table-selection-column"><span><label class="ant-checkbox-wrapper"><span class="ant-checkbox"><input type="checkbox" class="ant-checkbox-input" value=""><span class="ant-checkbox-inner"></span></span></label></span></td>
<td><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->Tom</td>
</tr>
<tr class="ant-table-row ant-table-row-level-0" data-row-key="3">
<td class="ant-table-fixed-columns-in-body ant-table-selection-column"><span><label class="ant-checkbox-wrapper"><span class="ant-checkbox"><input type="checkbox" class="ant-checkbox-input" value=""><span class="ant-checkbox-inner"></span></span></label></span></td>
<td><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->Jerry</td>
</tr>
</tbody>
</table>
</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>
</colgroup>
<thead class="ant-table-thead">
<tr>
<th key="selection-column" class="ant-table-selection-column">
<div>
<div class="ant-table-selection"><label class="ant-checkbox-wrapper"><span class="ant-checkbox"><input type="checkbox" class="ant-checkbox-input" value=""><span class="ant-checkbox-inner"></span></span></label></div>
<div class="ant-table-wrapper">
<div class="ant-spin-nested-loading">
<div class="ant-spin-container">
<div class="ant-table ant-table-default ant-table-scroll-position-left ant-table-scroll-position-right">
<div class="ant-table-content">
<div class="ant-table-scroll">
<!---->
<div class="ant-table-body">
<table class="">
<colgroup>
<col>
<col>
</colgroup>
<thead class="ant-table-thead">
<tr>
<th key="selection-column" class="ant-table-fixed-columns-in-body ant-table-selection-column">
<div>
<div class="ant-table-selection"><label class="ant-checkbox-wrapper"><span class="ant-checkbox"><input type="checkbox" class="ant-checkbox-input" value=""><span class="ant-checkbox-inner"></span></span></label></div>
</div>
</th>
<th key="name" class="">
<div>Name</div>
</th>
</tr>
</thead>
<tbody class="ant-table-tbody">
<tr class="ant-table-row ant-table-row-level-0" data-row-key="0">
<td class="ant-table-fixed-columns-in-body ant-table-selection-column"><span><label class="ant-checkbox-wrapper"><span class="ant-checkbox"><input type="checkbox" class="ant-checkbox-input" value=""><span class="ant-checkbox-inner"></span></span></label></span></td>
<td><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->Jack</td>
</tr>
<tr class="ant-table-row ant-table-row-level-0" data-row-key="1">
<td class="ant-table-fixed-columns-in-body ant-table-selection-column"><span><label class="ant-checkbox-wrapper"><span class="ant-checkbox"><input type="checkbox" class="ant-checkbox-input" value=""><span class="ant-checkbox-inner"></span></span></label></span></td>
<td><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->Lucy</td>
</tr>
<tr class="ant-table-row ant-table-row-level-0" data-row-key="2">
<td class="ant-table-fixed-columns-in-body ant-table-selection-column"><span><label class="ant-checkbox-wrapper"><span class="ant-checkbox"><input type="checkbox" class="ant-checkbox-input" value=""><span class="ant-checkbox-inner"></span></span></label></span></td>
<td><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->Tom</td>
</tr>
<tr class="ant-table-row ant-table-row-level-0" data-row-key="3">
<td class="ant-table-fixed-columns-in-body ant-table-selection-column"><span><label class="ant-checkbox-wrapper"><span class="ant-checkbox"><input type="checkbox" class="ant-checkbox-input" value=""><span class="ant-checkbox-inner"></span></span></label></span></td>
<td><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->Jerry</td>
</tr>
</tbody>
</table>
</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>
</colgroup>
<thead class="ant-table-thead">
<tr>
<th key="selection-column" class="ant-table-selection-column">
<div>
<div class="ant-table-selection"><label class="ant-checkbox-wrapper"><span class="ant-checkbox"><input type="checkbox" class="ant-checkbox-input" value=""><span class="ant-checkbox-inner"></span></span></label></div>
</div>
</th>
</tr>
</thead>
<tbody class="ant-table-tbody">
<tr class="ant-table-row ant-table-row-level-0" data-row-key="0">
<td class="ant-table-selection-column"><span><label class="ant-checkbox-wrapper"><span class="ant-checkbox"><input type="checkbox" class="ant-checkbox-input" value=""><span class="ant-checkbox-inner"></span></span></label></span></td>
</tr>
<tr class="ant-table-row ant-table-row-level-0" data-row-key="1">
<td class="ant-table-selection-column"><span><label class="ant-checkbox-wrapper"><span class="ant-checkbox"><input type="checkbox" class="ant-checkbox-input" value=""><span class="ant-checkbox-inner"></span></span></label></span></td>
</tr>
<tr class="ant-table-row ant-table-row-level-0" data-row-key="2">
<td class="ant-table-selection-column"><span><label class="ant-checkbox-wrapper"><span class="ant-checkbox"><input type="checkbox" class="ant-checkbox-input" value=""><span class="ant-checkbox-inner"></span></span></label></span></td>
</tr>
<tr class="ant-table-row ant-table-row-level-0" data-row-key="3">
<td class="ant-table-selection-column"><span><label class="ant-checkbox-wrapper"><span class="ant-checkbox"><input type="checkbox" class="ant-checkbox-input" value=""><span class="ant-checkbox-inner"></span></span></label></span></td>
</tr>
</tbody>
</table>
</div>
</th>
</tr>
</thead>
<tbody class="ant-table-tbody">
<tr class="ant-table-row ant-table-row-level-0" data-row-key="0">
<td class="ant-table-selection-column"><span><label class="ant-checkbox-wrapper"><span class="ant-checkbox"><input type="checkbox" class="ant-checkbox-input" value=""><span class="ant-checkbox-inner"></span></span></label></span></td>
</tr>
<tr class="ant-table-row ant-table-row-level-0" data-row-key="1">
<td class="ant-table-selection-column"><span><label class="ant-checkbox-wrapper"><span class="ant-checkbox"><input type="checkbox" class="ant-checkbox-input" value=""><span class="ant-checkbox-inner"></span></span></label></span></td>
</tr>
<tr class="ant-table-row ant-table-row-level-0" data-row-key="2">
<td class="ant-table-selection-column"><span><label class="ant-checkbox-wrapper"><span class="ant-checkbox"><input type="checkbox" class="ant-checkbox-input" value=""><span class="ant-checkbox-inner"></span></span></label></span></td>
</tr>
<tr class="ant-table-row ant-table-row-level-0" data-row-key="3">
<td class="ant-table-selection-column"><span><label class="ant-checkbox-wrapper"><span class="ant-checkbox"><input type="checkbox" class="ant-checkbox-input" value=""><span class="ant-checkbox-inner"></span></span></label></span></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<ul unselectable="unselectable" class="ant-pagination ant-table-pagination">
<li title="Previous Page" aria-disabled="true" class="ant-pagination-disabled ant-pagination-prev"><a class="ant-pagination-item-link"><i class="anticon anticon-left"><svg viewBox="64 64 896 896" data-icon="left" width="1em" height="1em" fill="currentColor" aria-hidden="true" class="">
<path d="M724 218.3V141c0-6.7-7.7-10.4-12.9-6.3L260.3 486.8a31.86 31.86 0 0 0 0 50.3l450.8 352.1c5.3 4.1 12.9.4 12.9-6.3v-77.3c0-4.9-2.3-9.6-6.1-12.6l-360-281 360-281.1c3.8-3 6.1-7.7 6.1-12.6z"></path>
</svg></i></a></li>
<li title="1" tabindex="0" class="ant-pagination-item ant-pagination-item-1 ant-pagination-item-active"><a>1</a></li>
<li title="Next Page" aria-disabled="true" class="ant-pagination-disabled ant-pagination-next"><a class="ant-pagination-item-link"><i class="anticon anticon-right"><svg viewBox="64 64 896 896" data-icon="right" width="1em" height="1em" fill="currentColor" aria-hidden="true" class="">
<path d="M765.7 486.8L314.9 134.7A7.97 7.97 0 0 0 302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 0 0 0-50.4z"></path>
</svg></i></a></li>
<!---->
</ul>
</div>
</div>
</div>
</div>
</div>
<ul unselectable="unselectable" class="ant-pagination ant-table-pagination">
<li title="Previous Page" aria-disabled="true" class="ant-pagination-disabled ant-pagination-prev"><a class="ant-pagination-item-link"><i class="anticon anticon-left"><svg viewBox="64 64 896 896" data-icon="left" width="1em" height="1em" fill="currentColor" aria-hidden="true" class="">
<path d="M724 218.3V141c0-6.7-7.7-10.4-12.9-6.3L260.3 486.8a31.86 31.86 0 0 0 0 50.3l450.8 352.1c5.3 4.1 12.9.4 12.9-6.3v-77.3c0-4.9-2.3-9.6-6.1-12.6l-360-281 360-281.1c3.8-3 6.1-7.7 6.1-12.6z"></path>
</svg></i></a></li>
<li title="1" tabindex="0" class="ant-pagination-item ant-pagination-item-1 ant-pagination-item-active"><a>1</a></li>
<li title="Next Page" aria-disabled="true" class="ant-pagination-disabled ant-pagination-next"><a class="ant-pagination-item-link"><i class="anticon anticon-right"><svg viewBox="64 64 896 896" data-icon="right" width="1em" height="1em" fill="currentColor" aria-hidden="true" class="">
<path d="M765.7 486.8L314.9 134.7A7.97 7.97 0 0 0 302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 0 0 0-50.4z"></path>
</svg></i></a></li>
<!---->
</ul>
</div></span></div>
`;
exports[`Table.rowSelection render with default selection correctly 1`] = `

67
components/table/__tests__/__snapshots__/Table.test.js.snap

@ -1,21 +1,56 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Table renders JSX correctly 1`] = `
<div class="ant-table-wrapper"><span tag="div" class="ant-spin-nested-loading"><div class="ant-spin-container"><div class="ant-table ant-table-scroll-position-left ant-table-default"><div class="ant-table-content"><!----><div class="ant-table-body"><table class=""><colgroup><col><col><col></colgroup><thead class="ant-table-thead"><tr><th key="0" colspan="2" class=""><div>Name</div></th><th key="age" rowspan="2" class=""><div>Age</div></th></tr><tr><th key="firstName" class=""><div>First Name</div></th><th key="lastName" class=""><div>Last Name</div></th></tr></thead><tbody class="ant-table-tbody"><tr class="ant-table-row ant-table-row-level-0" data-row-key="1"><td><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->John</td>
<td>Brown</td>
<td>32</td>
</tr>
<tr class="ant-table-row ant-table-row-level-0" data-row-key="2">
<td><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->Jim</td>
<td>Green</td>
<td>42</td>
</tr>
</tbody>
</table>
<div class="ant-table-wrapper">
<div class="ant-spin-nested-loading">
<div class="ant-spin-container">
<div class="ant-table ant-table-scroll-position-left ant-table-default">
<div class="ant-table-content">
<!---->
<div class="ant-table-body">
<table class="">
<colgroup>
<col>
<col>
<col>
</colgroup>
<thead class="ant-table-thead">
<tr>
<th key="0" colspan="2" class="">
<div>Name</div>
</th>
<th key="age" rowspan="2" class="">
<div>Age</div>
</th>
</tr>
<tr>
<th key="firstName" class="">
<div>First Name</div>
</th>
<th key="lastName" class="">
<div>Last Name</div>
</th>
</tr>
</thead>
<tbody class="ant-table-tbody">
<tr class="ant-table-row ant-table-row-level-0" data-row-key="1">
<td><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->John</td>
<td>Brown</td>
<td>32</td>
</tr>
<tr class="ant-table-row ant-table-row-level-0" data-row-key="2">
<td><span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
<!---->Jim</td>
<td>Green</td>
<td>42</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div></span></div>
`;

337
components/table/__tests__/__snapshots__/empty.test.js.snap

@ -1,63 +1,294 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Table renders empty table 1`] = `<div class="ant-table-wrapper"><span tag="div" class="ant-spin-nested-loading"><div class="ant-spin-container"><div class="ant-table ant-table-scroll-position-left ant-table-default ant-table-empty"><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 key="1" class=""><div>Column 1</div></th><th key="2" class=""><div>Column 2</div></th><th key="3" class=""><div>Column 3</div></th><th key="4" class=""><div>Column 4</div></th><th key="5" class=""><div>Column 5</div></th><th key="6" class=""><div>Column 6</div></th><th key="7" class=""><div>Column 7</div></th><th key="8" class=""><div>Column 8</div></th></tr></thead><tbody class="ant-table-tbody"></tbody></table></div><div class="ant-table-placeholder">No data</div></div></div></div></span></div>`;
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-scroll-position-left ant-table-default ant-table-empty">
<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 key="1" class="">
<div>Column 1</div>
</th>
<th key="2" class="">
<div>Column 2</div>
</th>
<th key="3" class="">
<div>Column 3</div>
</th>
<th key="4" class="">
<div>Column 4</div>
</th>
<th key="5" class="">
<div>Column 5</div>
</th>
<th key="6" class="">
<div>Column 6</div>
</th>
<th key="7" class="">
<div>Column 7</div>
</th>
<th key="8" class="">
<div>Column 8</div>
</th>
</tr>
</thead>
<tbody class="ant-table-tbody"></tbody>
</table>
</div>
<div class="ant-table-placeholder">No data</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`Table renders empty table with custom emptyText 1`] = `<div class="ant-table-wrapper"><span tag="div" class="ant-spin-nested-loading"><div class="ant-spin-container"><div class="ant-table ant-table-scroll-position-left ant-table-default ant-table-empty"><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 key="1" class=""><div>Column 1</div></th><th key="2" class=""><div>Column 2</div></th><th key="3" class=""><div>Column 3</div></th><th key="4" class=""><div>Column 4</div></th><th key="5" class=""><div>Column 5</div></th><th key="6" class=""><div>Column 6</div></th><th key="7" class=""><div>Column 7</div></th><th key="8" class=""><div>Column 8</div></th></tr></thead><tbody class="ant-table-tbody"></tbody></table></div><div class="ant-table-placeholder">custom empty text </div></div></div></div></span></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-scroll-position-left ant-table-default ant-table-empty">
<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 key="1" class="">
<div>Column 1</div>
</th>
<th key="2" class="">
<div>Column 2</div>
</th>
<th key="3" class="">
<div>Column 3</div>
</th>
<th key="4" class="">
<div>Column 4</div>
</th>
<th key="5" class="">
<div>Column 5</div>
</th>
<th key="6" class="">
<div>Column 6</div>
</th>
<th key="7" class="">
<div>Column 7</div>
</th>
<th key="8" class="">
<div>Column 8</div>
</th>
</tr>
</thead>
<tbody class="ant-table-tbody"></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"><span tag="div" class="ant-spin-nested-loading"><div class="ant-spin-container"><div class="ant-table ant-table-default ant-table-empty ant-table-scroll-position-left ant-table-scroll-position-right"><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 key="name" class="ant-table-fixed-columns-in-body"><div>Full Name</div></th><th key="age" class="ant-table-fixed-columns-in-body"><div>Age</div></th><th key="1" class=""><div>Column 1</div></th><th key="2" class=""><div>Column 2</div></th><th key="3" class=""><div>Column 3</div></th><th key="4" class=""><div>Column 4</div></th><th key="5" class=""><div>Column 5</div></th><th key="6" class=""><div>Column 6</div></th><th key="7" class=""><div>Column 7</div></th><th key="8" class=""><div>Column 8</div></th><th key="address" class="ant-table-fixed-columns-in-body"><div>Action</div></th></tr></thead><tbody class="ant-table-tbody"></tbody></table></div><div class="ant-table-placeholder">No data</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 key="name" class=""><div>Full Name</div></th><th key="age" class=""><div>Age</div></th></tr></thead><tbody class="ant-table-tbody"></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 key="address" class=""><div>Action</div></th></tr></thead><tbody class="ant-table-tbody"></tbody></table></div></div></div></div></div></div></span></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-default ant-table-empty ant-table-scroll-position-left ant-table-scroll-position-right">
<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 key="name" class="ant-table-fixed-columns-in-body">
<div>Full Name</div>
</th>
<th key="age" class="ant-table-fixed-columns-in-body">
<div>Age</div>
</th>
<th key="1" class="">
<div>Column 1</div>
</th>
<th key="2" class="">
<div>Column 2</div>
</th>
<th key="3" class="">
<div>Column 3</div>
</th>
<th key="4" class="">
<div>Column 4</div>
</th>
<th key="5" class="">
<div>Column 5</div>
</th>
<th key="6" class="">
<div>Column 6</div>
</th>
<th key="7" class="">
<div>Column 7</div>
</th>
<th key="8" class="">
<div>Column 8</div>
</th>
<th key="address" class="ant-table-fixed-columns-in-body">
<div>Action</div>
</th>
</tr>
</thead>
<tbody class="ant-table-tbody"></tbody>
</table>
</div>
<div class="ant-table-placeholder">No data</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 key="name" class="">
<div>Full Name</div>
</th>
<th key="age" class="">
<div>Age</div>
</th>
</tr>
</thead>
<tbody class="ant-table-tbody"></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 key="address" class="">
<div>Action</div>
</th>
</tr>
</thead>
<tbody class="ant-table-tbody"></tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`Table renders empty table without emptyText when loading 1`] = `
<div class="ant-table-wrapper"><span tag="div" class="ant-spin-nested-loading ant-table-without-pagination ant-table-spin-holder"><div><div class="ant-spin ant-spin-spinning"><span class="ant-spin-dot ant-spin-dot-spin"><i></i><i></i><i></i><i></i></span></div>
</div>
<div class="ant-spin-container ant-spin-blur">
<div class="ant-table ant-table-scroll-position-left ant-table-default ant-table-empty">
<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 key="1" class="">
<div>Column 1</div>
</th>
<th key="2" class="">
<div>Column 2</div>
</th>
<th key="3" class="">
<div>Column 3</div>
</th>
<th key="4" class="">
<div>Column 4</div>
</th>
<th key="5" class="">
<div>Column 5</div>
</th>
<th key="6" class="">
<div>Column 6</div>
</th>
<th key="7" class="">
<div>Column 7</div>
</th>
<th key="8" class="">
<div>Column 8</div>
</th>
</tr>
</thead>
<tbody class="ant-table-tbody"></tbody>
</table>
<div class="ant-table-wrapper">
<div class="ant-spin-nested-loading ant-table-without-pagination ant-table-spin-holder">
<div>
<div class="ant-spin ant-spin-spinning"><span class="ant-spin-dot ant-spin-dot-spin"><i></i><i></i><i></i><i></i></span></div>
</div>
<div class="ant-spin-container ant-spin-blur">
<div class="ant-table ant-table-scroll-position-left ant-table-default ant-table-empty">
<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 key="1" class="">
<div>Column 1</div>
</th>
<th key="2" class="">
<div>Column 2</div>
</th>
<th key="3" class="">
<div>Column 3</div>
</th>
<th key="4" class="">
<div>Column 4</div>
</th>
<th key="5" class="">
<div>Column 5</div>
</th>
<th key="6" class="">
<div>Column 6</div>
</th>
<th key="7" class="">
<div>Column 7</div>
</th>
<th key="8" class="">
<div>Column 8</div>
</th>
</tr>
</thead>
<tbody class="ant-table-tbody"></tbody>
</table>
</div>
<div class="ant-table-placeholder"></div>
</div>
</div>
<div class="ant-table-placeholder"></div>
</div>
</div>
</div></span></div>
</div>
`;

2
components/vc-menu/MenuItem.jsx

@ -14,7 +14,7 @@ const props = {
active: PropTypes.bool,
selectedKeys: PropTypes.array,
disabled: PropTypes.bool,
title: PropTypes.string,
title: PropTypes.any,
index: PropTypes.number,
inlineIndent: PropTypes.number.def(24),
level: PropTypes.number.def(1),

Loading…
Cancel
Save