mirror of
https://gitee.com/ant-design/ant-design.git
synced 2024-11-30 11:08:45 +08:00
test support react15
This commit is contained in:
parent
2e3d131d74
commit
0f22cd69c3
@ -2,50 +2,56 @@ import React from 'react';
|
||||
import { mount } from 'enzyme';
|
||||
import Drawer from '..';
|
||||
|
||||
|
||||
class DrawerTester extends React.Component {
|
||||
saveContainer = (container) => {
|
||||
this.container = container;
|
||||
}
|
||||
|
||||
getContainer = () => {
|
||||
return this.container;
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<div ref={this.saveContainer} />
|
||||
<Drawer
|
||||
visible
|
||||
getContainer={this.getContainer}
|
||||
{...this.props}
|
||||
>
|
||||
Here is content of Drawer
|
||||
</Drawer>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
describe('Drawer', () => {
|
||||
it('render correctly', () => {
|
||||
const wrapper = mount(<DrawerTester width={400} />);
|
||||
const wrapper = mount(
|
||||
<Drawer
|
||||
visible
|
||||
width={400}
|
||||
getContainer={false}
|
||||
>
|
||||
Here is content of Drawer
|
||||
</Drawer>
|
||||
);
|
||||
expect(wrapper.render()).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('have a title', () => {
|
||||
const wrapper = mount(<DrawerTester title="Test Title" />);
|
||||
const wrapper = mount(
|
||||
<Drawer
|
||||
visible
|
||||
title="Test Title"
|
||||
getContainer={false}
|
||||
>
|
||||
Here is content of Drawer
|
||||
</Drawer>
|
||||
);
|
||||
expect(wrapper.render()).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('closable is false', () => {
|
||||
const wrapper = mount(<DrawerTester closable={false} />);
|
||||
const wrapper = mount(
|
||||
<Drawer
|
||||
visible
|
||||
closable={false}
|
||||
getContainer={false}
|
||||
>
|
||||
Here is content of Drawer
|
||||
</Drawer>
|
||||
);
|
||||
expect(wrapper.render()).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('destroyOnClose is true', () => {
|
||||
const wrapper = mount(<DrawerTester destroyOnClose visible={false} />);
|
||||
const wrapper = mount(
|
||||
<Drawer
|
||||
destroyOnClose
|
||||
visible={false}
|
||||
getContainer={false}
|
||||
>
|
||||
Here is content of Drawer
|
||||
</Drawer>
|
||||
);
|
||||
expect(wrapper.render()).toMatchSnapshot();
|
||||
});
|
||||
});
|
||||
|
@ -13,14 +13,6 @@ class DrawerEventTester extends React.Component {
|
||||
this.setState({ visible: true }); // eslint-disable-line react/no-did-mount-set-state
|
||||
}
|
||||
|
||||
saveContainer = (container) => {
|
||||
this.container = container;
|
||||
};
|
||||
|
||||
getContainer = () => {
|
||||
return this.container;
|
||||
};
|
||||
|
||||
onClose = () => {
|
||||
this.setState({
|
||||
visible: false,
|
||||
@ -38,12 +30,11 @@ class DrawerEventTester extends React.Component {
|
||||
return (
|
||||
<div>
|
||||
<Button onClick={this.open}>open</Button>
|
||||
<div ref={this.saveContainer} />
|
||||
<Drawer
|
||||
visible={visible}
|
||||
onClose={this.onClose}
|
||||
destroyOnClose
|
||||
getContainer={this.getContainer}
|
||||
getContainer={false}
|
||||
{...this.props}
|
||||
>
|
||||
Here is content of Drawer
|
||||
|
@ -1,30 +1,28 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`Drawer closable is false 1`] = `
|
||||
<div>
|
||||
<div>
|
||||
<div>
|
||||
<div
|
||||
class=""
|
||||
>
|
||||
<div
|
||||
class="ant-drawer ant-drawer-left ant-drawer-open"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-mask"
|
||||
/>
|
||||
<div
|
||||
class="ant-drawer-content-wrapper"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer ant-drawer-left ant-drawer-open"
|
||||
class="ant-drawer-content"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-mask"
|
||||
/>
|
||||
<div
|
||||
class="ant-drawer-content-wrapper"
|
||||
style="width: 256px;"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-content"
|
||||
class="ant-drawer-body"
|
||||
>
|
||||
<div
|
||||
style="width: 256px;"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-body"
|
||||
>
|
||||
Here is content of Drawer
|
||||
</div>
|
||||
</div>
|
||||
Here is content of Drawer
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -34,54 +32,67 @@ exports[`Drawer closable is false 1`] = `
|
||||
`;
|
||||
|
||||
exports[`Drawer destroyOnClose is true 1`] = `
|
||||
<div>
|
||||
<div />
|
||||
<div
|
||||
class=""
|
||||
>
|
||||
<div
|
||||
class="ant-drawer ant-drawer-left"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-mask"
|
||||
/>
|
||||
<div
|
||||
class="ant-drawer-content-wrapper"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-content"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`Drawer have a title 1`] = `
|
||||
<div>
|
||||
<div>
|
||||
<div>
|
||||
<div
|
||||
class=""
|
||||
>
|
||||
<div
|
||||
class="ant-drawer ant-drawer-left ant-drawer-open"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-mask"
|
||||
/>
|
||||
<div
|
||||
class="ant-drawer-content-wrapper"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer ant-drawer-left ant-drawer-open"
|
||||
class="ant-drawer-content"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-mask"
|
||||
/>
|
||||
<div
|
||||
class="ant-drawer-content-wrapper"
|
||||
style="width: 256px;"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-content"
|
||||
class="ant-drawer-header"
|
||||
>
|
||||
<div
|
||||
style="width: 256px;"
|
||||
class="ant-drawer-title"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-header"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-title"
|
||||
>
|
||||
Test Title
|
||||
</div>
|
||||
</div>
|
||||
<button
|
||||
aria-label="Close"
|
||||
class="ant-drawer-close"
|
||||
>
|
||||
<span
|
||||
class="ant-drawer-close-x"
|
||||
/>
|
||||
</button>
|
||||
<div
|
||||
class="ant-drawer-body"
|
||||
>
|
||||
Here is content of Drawer
|
||||
</div>
|
||||
Test Title
|
||||
</div>
|
||||
</div>
|
||||
<button
|
||||
aria-label="Close"
|
||||
class="ant-drawer-close"
|
||||
>
|
||||
<span
|
||||
class="ant-drawer-close-x"
|
||||
/>
|
||||
</button>
|
||||
<div
|
||||
class="ant-drawer-body"
|
||||
>
|
||||
Here is content of Drawer
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -90,38 +101,36 @@ exports[`Drawer have a title 1`] = `
|
||||
`;
|
||||
|
||||
exports[`Drawer render correctly 1`] = `
|
||||
<div>
|
||||
<div>
|
||||
<div>
|
||||
<div
|
||||
class=""
|
||||
>
|
||||
<div
|
||||
class="ant-drawer ant-drawer-left ant-drawer-open"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-mask"
|
||||
/>
|
||||
<div
|
||||
class="ant-drawer-content-wrapper"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer ant-drawer-left ant-drawer-open"
|
||||
class="ant-drawer-content"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-mask"
|
||||
/>
|
||||
<div
|
||||
class="ant-drawer-content-wrapper"
|
||||
style="width: 400px;"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-content"
|
||||
<button
|
||||
aria-label="Close"
|
||||
class="ant-drawer-close"
|
||||
>
|
||||
<div
|
||||
style="width: 400px;"
|
||||
>
|
||||
<button
|
||||
aria-label="Close"
|
||||
class="ant-drawer-close"
|
||||
>
|
||||
<span
|
||||
class="ant-drawer-close-x"
|
||||
/>
|
||||
</button>
|
||||
<div
|
||||
class="ant-drawer-body"
|
||||
>
|
||||
Here is content of Drawer
|
||||
</div>
|
||||
</div>
|
||||
<span
|
||||
class="ant-drawer-close-x"
|
||||
/>
|
||||
</button>
|
||||
<div
|
||||
class="ant-drawer-body"
|
||||
>
|
||||
Here is content of Drawer
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -10,36 +10,36 @@ exports[`Drawer render correctly 1`] = `
|
||||
open
|
||||
</span>
|
||||
</button>
|
||||
<div>
|
||||
<div>
|
||||
<div
|
||||
class=""
|
||||
>
|
||||
<div
|
||||
class="ant-drawer ant-drawer-left ant-drawer-open"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer ant-drawer-left ant-drawer-open"
|
||||
class="ant-drawer-mask"
|
||||
/>
|
||||
<div
|
||||
class="ant-drawer-content-wrapper"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-mask"
|
||||
/>
|
||||
<div
|
||||
class="ant-drawer-content-wrapper"
|
||||
class="ant-drawer-content"
|
||||
>
|
||||
<div
|
||||
class="ant-drawer-content"
|
||||
style="width: 256px;"
|
||||
>
|
||||
<div
|
||||
style="width: 256px;"
|
||||
<button
|
||||
aria-label="Close"
|
||||
class="ant-drawer-close"
|
||||
>
|
||||
<button
|
||||
aria-label="Close"
|
||||
class="ant-drawer-close"
|
||||
>
|
||||
<span
|
||||
class="ant-drawer-close-x"
|
||||
/>
|
||||
</button>
|
||||
<div
|
||||
class="ant-drawer-body"
|
||||
>
|
||||
Here is content of Drawer
|
||||
</div>
|
||||
<span
|
||||
class="ant-drawer-close-x"
|
||||
/>
|
||||
</button>
|
||||
<div
|
||||
class="ant-drawer-body"
|
||||
>
|
||||
Here is content of Drawer
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -37,7 +37,7 @@ export default class Drawer extends React.Component<
|
||||
static propTypes = {
|
||||
closable: PropTypes.bool,
|
||||
destroyOnClose: PropTypes.bool,
|
||||
getContainer: PropTypes.oneOfType([PropTypes.string, PropTypes.object, PropTypes.func]),
|
||||
getContainer: PropTypes.oneOfType([PropTypes.string, PropTypes.object, PropTypes.func, PropTypes.bool]),
|
||||
maskClosable: PropTypes.bool,
|
||||
mask: PropTypes.bool,
|
||||
maskStyle: PropTypes.object,
|
||||
|
@ -58,7 +58,7 @@
|
||||
"rc-checkbox": "~2.1.5",
|
||||
"rc-collapse": "~1.9.0",
|
||||
"rc-dialog": "~7.1.0",
|
||||
"rc-drawer": "~1.4.1",
|
||||
"rc-drawer": "~1.4.2",
|
||||
"rc-dropdown": "~2.2.0",
|
||||
"rc-editor-mention": "^1.0.2",
|
||||
"rc-form": "^2.1.0",
|
||||
|
Loading…
Reference in New Issue
Block a user