mirror of
https://github.com/zhigang1992/react.git
synced 2026-04-29 04:35:32 +08:00
style(prettier): format code style
This commit is contained in:
@@ -17,61 +17,58 @@ describe('Table', () => {
|
||||
<Table.Column prop="property" label="property" />
|
||||
<Table.Column prop="description" label="description" />
|
||||
<Table.Column prop="default" label="default" />
|
||||
</Table>
|
||||
</Table>,
|
||||
)
|
||||
expect(wrapper.html()).toMatchSnapshot()
|
||||
expect(() => wrapper.unmount()).not.toThrow()
|
||||
})
|
||||
|
||||
|
||||
it('should re-render when data changed', async () => {
|
||||
const wrapper = mount(
|
||||
<Table data={data}>
|
||||
<Table.Column prop="property" label="property" />
|
||||
<Table.Column prop="description" label="description" />
|
||||
<Table.Column prop="default" label="default" />
|
||||
</Table>
|
||||
</Table>,
|
||||
)
|
||||
expect(wrapper.find('tbody').find('tr').length).toBe(data.length)
|
||||
wrapper.setProps({ data: [] })
|
||||
await updateWrapper(wrapper, 350)
|
||||
expect(wrapper.find('tbody').find('tr').length).toBe(0)
|
||||
|
||||
})
|
||||
|
||||
|
||||
it('should set width automatically', () => {
|
||||
window.getComputedStyle = jest.fn()
|
||||
.mockImplementation(() => ({
|
||||
width: '100px',
|
||||
}))
|
||||
window.getComputedStyle = jest.fn().mockImplementation(() => ({
|
||||
width: '100px',
|
||||
}))
|
||||
const wrapper = mount(
|
||||
<Table data={data}>
|
||||
<Table.Column prop="property" label="property" />
|
||||
<Table.Column prop="description" label="description" />
|
||||
<Table.Column prop="default" label="default" width={50} />
|
||||
</Table>
|
||||
</Table>,
|
||||
)
|
||||
expect(wrapper.html()).toMatchSnapshot()
|
||||
expect(() => wrapper.unmount()).not.toThrow()
|
||||
;(window.getComputedStyle as jest.Mock).mockClear()
|
||||
})
|
||||
|
||||
|
||||
it('should be no erros when width is too large', () => {
|
||||
window.getComputedStyle = jest.fn()
|
||||
.mockImplementation(() => ({
|
||||
width: '10px',
|
||||
}))
|
||||
window.getComputedStyle = jest.fn().mockImplementation(() => ({
|
||||
width: '10px',
|
||||
}))
|
||||
const wrapper = mount(
|
||||
<Table data={data}>
|
||||
<Table.Column prop="property" label="property" />
|
||||
<Table.Column prop="description" label="description" />
|
||||
<Table.Column prop="default" label="default" width={50} />
|
||||
</Table>
|
||||
</Table>,
|
||||
)
|
||||
expect(wrapper.html()).toMatchSnapshot()
|
||||
expect(() => wrapper.unmount()).not.toThrow()
|
||||
;(window.getComputedStyle as jest.Mock).mockClear()
|
||||
})
|
||||
|
||||
|
||||
it('should work with other components', () => {
|
||||
const dataWithNodes = [
|
||||
...data,
|
||||
@@ -81,103 +78,92 @@ describe('Table', () => {
|
||||
<Table data={dataWithNodes}>
|
||||
<Table.Column prop="property" label="property" />
|
||||
<Table.Column prop="description" label="description" />
|
||||
<Table.Column prop="default" label="default"/>
|
||||
</Table>
|
||||
<Table.Column prop="default" label="default" />
|
||||
</Table>,
|
||||
)
|
||||
expect(wrapper.html()).toMatchSnapshot()
|
||||
expect(wrapper.find('code').length).not.toBe(0)
|
||||
expect(() => wrapper.unmount()).not.toThrow()
|
||||
})
|
||||
|
||||
|
||||
it('should work without hover effect', () => {
|
||||
const wrapper = mount(
|
||||
<Table data={data} hover={false}>
|
||||
<Table.Column prop="property" label="property" />
|
||||
<Table.Column prop="description" label="description" />
|
||||
<Table.Column prop="default" label="default"/>
|
||||
</Table>
|
||||
<Table.Column prop="default" label="default" />
|
||||
</Table>,
|
||||
)
|
||||
expect(wrapper.html()).toMatchSnapshot()
|
||||
expect(() => wrapper.unmount()).not.toThrow()
|
||||
})
|
||||
|
||||
|
||||
it('should be possible to remove the row', () => {
|
||||
const operation = (actions: cellActions) => {
|
||||
return <button onClick={() => actions.remove()}>Remove</button>
|
||||
}
|
||||
const data = [
|
||||
{ property: 'bold', description: 'boolean', operation },
|
||||
]
|
||||
const data = [{ property: 'bold', description: 'boolean', operation }]
|
||||
const wrapper = mount(
|
||||
<Table data={data}>
|
||||
<Table.Column prop="property" label="property" />
|
||||
<Table.Column prop="description" label="description" />
|
||||
<Table.Column prop="operation" label="operation"/>
|
||||
</Table>
|
||||
<Table.Column prop="operation" label="operation" />
|
||||
</Table>,
|
||||
)
|
||||
expect(wrapper.find('tbody').find('tr').length).toBe(1)
|
||||
wrapper.find('tbody').find('button')
|
||||
.simulate('click')
|
||||
wrapper.find('tbody').find('button').simulate('click')
|
||||
expect(wrapper.find('tbody').find('tr').length).toBe(0)
|
||||
expect(() => wrapper.unmount()).not.toThrow()
|
||||
})
|
||||
|
||||
|
||||
it('should render emptyText when data missing', () => {
|
||||
const data = [
|
||||
{ property: 'bold', description: 'boolean' },
|
||||
]
|
||||
const data = [{ property: 'bold', description: 'boolean' }]
|
||||
const wrapper = mount(
|
||||
<Table data={data} emptyText="test-not-found">
|
||||
<Table.Column prop="property" label="property" />
|
||||
<Table.Column prop="description" label="description" />
|
||||
<Table.Column prop="operation" label="operation"/>
|
||||
</Table>
|
||||
<Table.Column prop="operation" label="operation" />
|
||||
</Table>,
|
||||
)
|
||||
expect(wrapper.find('tbody').text()).toContain('test-not-found')
|
||||
})
|
||||
|
||||
|
||||
it('should trigger events when cell clicked', () => {
|
||||
const rowHandler = jest.fn()
|
||||
const cellHandler = jest.fn()
|
||||
const data = [
|
||||
{ property: 'bold', description: 'boolean' },
|
||||
]
|
||||
const data = [{ property: 'bold', description: 'boolean' }]
|
||||
const wrapper = mount(
|
||||
<Table data={data} emptyText="test-not-found"
|
||||
onRow={rowHandler} onCell={cellHandler}>
|
||||
<Table data={data} emptyText="test-not-found" onRow={rowHandler} onCell={cellHandler}>
|
||||
<Table.Column prop="property" label="property" />
|
||||
<Table.Column prop="description" label="description" />
|
||||
</Table>
|
||||
</Table>,
|
||||
)
|
||||
wrapper.find('tbody').find('tr').find('td').at(0)
|
||||
.simulate('click', nativeEvent)
|
||||
wrapper.find('tbody').find('tr').find('td').at(0).simulate('click', nativeEvent)
|
||||
expect(rowHandler).toHaveBeenCalled()
|
||||
expect(cellHandler).toHaveBeenCalled()
|
||||
})
|
||||
|
||||
|
||||
it('should wraning when prop missing', () => {
|
||||
const errorSpy = jest.spyOn(console, 'error')
|
||||
.mockImplementation(() => {})
|
||||
const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {})
|
||||
mount(
|
||||
<Table data={data}>
|
||||
<Table.Column prop="" label="property" />
|
||||
<Table.Column prop="description" label="description" />
|
||||
</Table>
|
||||
</Table>,
|
||||
)
|
||||
expect(errorSpy).toHaveBeenCalled()
|
||||
errorSpy.mockRestore()
|
||||
})
|
||||
|
||||
|
||||
it('should render children for table head', () => {
|
||||
const wrapper = mount(
|
||||
<Table data={data}>
|
||||
<Table.Column prop="property">
|
||||
<Code>property</Code>
|
||||
</Table.Column>
|
||||
</Table>
|
||||
</Table>,
|
||||
)
|
||||
expect(wrapper.find('thead').find('code').length)
|
||||
.not.toBe(0)
|
||||
expect(wrapper.find('thead').find('code').length).not.toBe(0)
|
||||
expect(wrapper.html()).toMatchSnapshot()
|
||||
})
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user