diff --git a/components/date-picker/RangePicker.tsx b/components/date-picker/RangePicker.tsx
index 7c58d598c2..681296ff35 100644
--- a/components/date-picker/RangePicker.tsx
+++ b/components/date-picker/RangePicker.tsx
@@ -301,6 +301,7 @@ export default class RangePicker extends React.Component<any, RangePickerState>
     return (
       <span
         ref={this.savePicker}
+        id={props.id}
         className={classNames(props.className, props.pickerClass)}
         style={{ ...style, ...pickerStyle }}
         tabIndex={props.disabled ? -1 : 0}
diff --git a/components/date-picker/WeekPicker.tsx b/components/date-picker/WeekPicker.tsx
index ccec719013..c6b97fe48d 100644
--- a/components/date-picker/WeekPicker.tsx
+++ b/components/date-picker/WeekPicker.tsx
@@ -131,7 +131,7 @@ export default class WeekPicker extends React.Component<any, any> {
       );
     };
     return (
-      <span className={classNames(className, pickerClass)}>
+      <span className={classNames(className, pickerClass)} id={this.props.id}>
         <RcDatePicker
           {...this.props}
           calendar={calendar}
diff --git a/components/date-picker/createPicker.tsx b/components/date-picker/createPicker.tsx
index 3e7166e560..13ddb9fc8c 100644
--- a/components/date-picker/createPicker.tsx
+++ b/components/date-picker/createPicker.tsx
@@ -162,6 +162,7 @@ export default function createPicker(TheCalendar: React.ComponentClass): any {
       }
       return (
         <span
+          id={props.id}
           className={classNames(props.className, props.pickerClass)}
           style={props.style}
           onFocus={props.onFocus}
diff --git a/components/date-picker/interface.tsx b/components/date-picker/interface.tsx
index 90d09285ad..54d7e48897 100644
--- a/components/date-picker/interface.tsx
+++ b/components/date-picker/interface.tsx
@@ -3,6 +3,7 @@ import * as moment from 'moment';
 import { TimePickerProps } from '../time-picker';
 
 export interface PickerProps {
+  id?: number | string;
   prefixCls?: string;
   inputPrefixCls?: string;
   format?: string;
diff --git a/components/form/__tests__/__snapshots__/demo.test.js.snap b/components/form/__tests__/__snapshots__/demo.test.js.snap
index 6cb90619a7..dbd6d7364c 100644
--- a/components/form/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/form/__tests__/__snapshots__/demo.test.js.snap
@@ -1720,6 +1720,7 @@ exports[`renders ./components/form/demo/time-related-controls.md correctly 1`] =
       >
         <span
           class="ant-calendar-picker"
+          id="date-picker"
         >
           <div>
             <input
@@ -1758,6 +1759,7 @@ exports[`renders ./components/form/demo/time-related-controls.md correctly 1`] =
       >
         <span
           class="ant-calendar-picker"
+          id="date-time-picker"
         >
           <div>
             <input
@@ -1796,6 +1798,7 @@ exports[`renders ./components/form/demo/time-related-controls.md correctly 1`] =
       >
         <span
           class="ant-calendar-picker"
+          id="month-picker"
         >
           <div>
             <input
@@ -1834,6 +1837,7 @@ exports[`renders ./components/form/demo/time-related-controls.md correctly 1`] =
       >
         <span
           class="ant-calendar-picker"
+          id="range-picker"
           tabindex="0"
         >
           <span
@@ -1888,6 +1892,7 @@ exports[`renders ./components/form/demo/time-related-controls.md correctly 1`] =
       >
         <span
           class="ant-calendar-picker"
+          id="range-time-picker"
           style="width:350px"
           tabindex="0"
         >