add drawer test

components/drawer/__tests__/Drawer.test.js

@@ -16,12 +16,12 @@ class DrawerTester extends React.Component {
     this.container = container;
   }
   getContainer = () => {
-    return 'DrawerTester';
+    return this.container;
   }
   render() {
     return (
       <div>
-        <div id="DrawerTester" />
+        <div ref={this.saveContainer} />
         <Drawer
           {...this.props}
           visible={this.state.visible}

components/drawer/__tests__/__snapshots__/Drawer.test.js.snap

@@ -0,0 +1,42 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Drawer render correctly 1`] = `
+<div>
+  <div>
+    <div>
+      <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-content"
+          >
+            <div
+              style="width: 256px;"
+            >
+              <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>
+      </div>
+    </div>
+  </div>
+</div>
+`;

components/drawer/demo/from-drawer.md

@@ -124,12 +124,38 @@ class App extends React.Component {
               <Col span={24}>
                 <Form.Item label="description">
                   {getFieldDecorator('description', {
-                    rules: [{ required: true, message: 'please enter url description' }],
+                    rules: [
+                      {
+                        required: true,
+                        message: 'please enter url description',
+                      },
+                    ],
                   })(<Input.TextArea rows={4} placeholder="please enter url description" />)}
                 </Form.Item>
               </Col>
             </Row>
           </Form>
+          <div
+            style={{
+              position: 'absolute',
+              bottom: 0,
+              width: '100%',
+              borderTop: '1px solid #e8e8e8',
+              padding: '10px 16px',
+              textAlign: 'right',
+              left: 0,
+              borderRadius: '0 0 4px 4px',
+            }}
+          >
+            <Button
+              style={{
+                marginRight: 8,
+              }}
+            >
+              取消
+            </Button>
+            <Button type="primary">提交</Button>
+          </div>
         </Drawer>
       </div>
     );

components/drawer/index.tsx

@@ -6,10 +6,12 @@ type EventType =
   | React.MouseEvent<HTMLDivElement>
   | React.MouseEvent<HTMLButtonElement>;
 
+type getContainerfunc = () => HTMLElement;
+
 export interface DrawerProps {
   closable?: boolean;
   destroyOnClose?: boolean;
-  getContainer?: HTMLElement;
+  getContainer?: string | HTMLElement | getContainerfunc;
   maskClosable?: boolean;
   mask?: boolean;
   maskStyle?: React.CSSProperties;
@@ -35,7 +37,7 @@ export default class Drawer extends React.Component<
   static propTypes = {
     closable: PropTypes.bool,
     destroyOnClose: PropTypes.bool,
-    getContainer: PropTypes.object,
+    getContainer: PropTypes.oneOfType([PropTypes.string, PropTypes.object, PropTypes.func]),
     maskClosable: PropTypes.bool,
     mask: PropTypes.bool,
     maskStyle: PropTypes.object,

package.json

@@ -58,7 +58,7 @@
     "rc-checkbox": "~2.1.5",
     "rc-collapse": "~1.9.0",
     "rc-dialog": "~7.1.0",
-    "rc-drawer": "~1.2.0",
+    "rc-drawer": "~1.3.0",
     "rc-dropdown": "~2.2.0",
     "rc-editor-mention": "^1.0.2",
     "rc-form": "^2.1.0",