Update rc-calendar to use new lifecycle methods & input auto focus (#14051)

close #11848

components/date-picker/__tests__/__snapshots__/DatePicker.test.js.snap

@@ -115,6 +115,7 @@ exports[`DatePicker prop locale should works 1`] = `
           </div>
           <div
             class="ant-calendar-date-panel"
+            tabindex="0"
           >
             <div
               class="ant-calendar-header"

components/date-picker/__tests__/__snapshots__/WeekPicker.test.js.snap

@@ -14,6 +14,7 @@ exports[`WeekPicker should support dateRender 1`] = `
       >
         <div
           class="ant-calendar-date-panel"
+          tabindex="0"
         >
           <div
             class="ant-calendar-header"

components/date-picker/__tests__/__snapshots__/other.test.js.snap

@@ -278,6 +278,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
       >
         <div
           class="ant-calendar-date-panel"
+          tabindex="0"
         >
           <div
             class="ant-calendar-header"

components/date-picker/__tests__/showTime.test.js

@@ -99,41 +99,30 @@ describe('RangePicker with showTime', () => {
       <RangePicker showTime open onChange={onChangeFn} onOpenChange={onOpenChangeFn} />,
     );
 
-    const calendarWrapper = mount(
-      wrapper
-        .find('Trigger')
-        .instance()
-        .getComponent(),
-    );
-    expect(
-      calendarWrapper
-        .find('.ant-calendar-time-picker-btn')
-        .hasClass('ant-calendar-time-picker-btn-disabled'),
-    ).toBe(true);
+    function findNode(selector) {
+      return wrapper.find('Trigger').find(selector);
+    }
+
     expect(
-      calendarWrapper.find('.ant-calendar-ok-btn').hasClass('ant-calendar-ok-btn-disabled'),
+      findNode('.ant-calendar-time-picker-btn').hasClass('ant-calendar-time-picker-btn-disabled'),
     ).toBe(true);
-    calendarWrapper
-      .find('.ant-calendar-date')
+    expect(findNode('.ant-calendar-ok-btn').hasClass('ant-calendar-ok-btn-disabled')).toBe(true);
+    findNode('.ant-calendar-date')
       .at(10)
       .simulate('click');
-    calendarWrapper
-      .find('.ant-calendar-date')
+    findNode('.ant-calendar-date')
       .at(11)
       .simulate('click');
+
     expect(
-      calendarWrapper
-        .find('.ant-calendar-time-picker-btn')
-        .hasClass('ant-calendar-time-picker-btn-disabled'),
-    ).toBe(false);
-    expect(
-      calendarWrapper.find('.ant-calendar-ok-btn').hasClass('ant-calendar-ok-btn-disabled'),
+      findNode('.ant-calendar-time-picker-btn').hasClass('ant-calendar-time-picker-btn-disabled'),
     ).toBe(false);
+    expect(findNode('.ant-calendar-ok-btn').hasClass('ant-calendar-ok-btn-disabled')).toBe(false);
     expect(onChangeFn).toHaveBeenCalled();
     expect(onOpenChangeFn).not.toHaveBeenCalled();
   });
 
-  it('hould trigger onOk when press ok button', () => {
+  it('should trigger onOk when press ok button', () => {
     const onOkFn = jest.fn();
     const onChangeFn = jest.fn();
     const onOpenChangeFn = jest.fn();
@@ -147,22 +136,18 @@ describe('RangePicker with showTime', () => {
       />,
     );
 
-    const calendarWrapper = mount(
-      wrapper
-        .find('Trigger')
-        .instance()
-        .getComponent(),
-    );
-    calendarWrapper
-      .find('.ant-calendar-date')
+    function findNode(selector) {
+      return wrapper.find('Trigger').find(selector);
+    }
+
+    findNode('.ant-calendar-date')
       .at(10)
       .simulate('click');
-    calendarWrapper
-      .find('.ant-calendar-date')
+    findNode('.ant-calendar-date')
       .at(11)
       .simulate('click');
     onChangeFn.mockClear();
-    calendarWrapper.find('.ant-calendar-ok-btn').simulate('click');
+    findNode('.ant-calendar-ok-btn').simulate('click');
     expect(onOkFn).toHaveBeenCalled();
     expect(onOpenChangeFn).toHaveBeenCalledWith(false);
     expect(onChangeFn).not.toHaveBeenCalled();

components/date-picker/style/Calendar.less

@@ -186,6 +186,7 @@
 
     &-panel {
       position: relative;
+      outline: none;
     }
 
     &:hover {

components/locale-provider/__tests__/__snapshots__/index.test.js.snap

@@ -84,6 +84,7 @@ exports[`Locale Provider set moment locale when locale changes 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -910,6 +911,7 @@ exports[`Locale Provider set moment locale when locale changes 2`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -1736,6 +1738,7 @@ exports[`Locale Provider set moment locale when locale changes 3`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -2763,6 +2766,7 @@ exports[`Locale Provider should display the text as ar 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -7838,6 +7842,7 @@ exports[`Locale Provider should display the text as bg 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -12913,6 +12918,7 @@ exports[`Locale Provider should display the text as ca 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -17988,6 +17994,7 @@ exports[`Locale Provider should display the text as cs 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -23063,6 +23070,7 @@ exports[`Locale Provider should display the text as da 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -28138,6 +28146,7 @@ exports[`Locale Provider should display the text as de 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -33213,6 +33222,7 @@ exports[`Locale Provider should display the text as el 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -38288,6 +38298,7 @@ exports[`Locale Provider should display the text as en 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -43363,6 +43374,7 @@ exports[`Locale Provider should display the text as en-gb 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -48438,6 +48450,7 @@ exports[`Locale Provider should display the text as es 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -53513,6 +53526,7 @@ exports[`Locale Provider should display the text as et 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -58588,6 +58602,7 @@ exports[`Locale Provider should display the text as fa 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -63663,6 +63678,7 @@ exports[`Locale Provider should display the text as fi 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -68738,6 +68754,7 @@ exports[`Locale Provider should display the text as fr 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -73813,6 +73830,7 @@ exports[`Locale Provider should display the text as fr 2`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -78888,6 +78906,7 @@ exports[`Locale Provider should display the text as he 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -83963,6 +83982,7 @@ exports[`Locale Provider should display the text as hi 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -89038,6 +89058,7 @@ exports[`Locale Provider should display the text as hu 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -94113,6 +94134,7 @@ exports[`Locale Provider should display the text as id 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -99188,6 +99210,7 @@ exports[`Locale Provider should display the text as is 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -104263,6 +104286,7 @@ exports[`Locale Provider should display the text as it 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -109338,6 +109362,7 @@ exports[`Locale Provider should display the text as ja 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -114413,6 +114438,7 @@ exports[`Locale Provider should display the text as kn 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -119488,6 +119514,7 @@ exports[`Locale Provider should display the text as ko 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -124563,6 +124590,7 @@ exports[`Locale Provider should display the text as ku-iq 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -129638,6 +129666,7 @@ exports[`Locale Provider should display the text as mn-mn 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -134713,6 +134742,7 @@ exports[`Locale Provider should display the text as nb 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -139788,6 +139818,7 @@ exports[`Locale Provider should display the text as ne-np 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -144863,6 +144894,7 @@ exports[`Locale Provider should display the text as nl 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -149938,6 +149970,7 @@ exports[`Locale Provider should display the text as nl-be 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -155013,6 +155046,7 @@ exports[`Locale Provider should display the text as pl 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -160088,6 +160122,7 @@ exports[`Locale Provider should display the text as pt 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -165163,6 +165198,7 @@ exports[`Locale Provider should display the text as pt-br 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -170238,6 +170274,7 @@ exports[`Locale Provider should display the text as ru 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -175313,6 +175350,7 @@ exports[`Locale Provider should display the text as sk 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -180388,6 +180426,7 @@ exports[`Locale Provider should display the text as sl 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -185463,6 +185502,7 @@ exports[`Locale Provider should display the text as sr 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -190538,6 +190578,7 @@ exports[`Locale Provider should display the text as sv 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -195613,6 +195654,7 @@ exports[`Locale Provider should display the text as th 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -200688,6 +200730,7 @@ exports[`Locale Provider should display the text as tr 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -205763,6 +205806,7 @@ exports[`Locale Provider should display the text as uk 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -210838,6 +210882,7 @@ exports[`Locale Provider should display the text as vi 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -215913,6 +215958,7 @@ exports[`Locale Provider should display the text as zh-cn 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"
@@ -220988,6 +221034,7 @@ exports[`Locale Provider should display the text as zh-tw 1`] = `
             </div>
             <div
               class="ant-calendar-date-panel"
+              tabindex="0"
             >
               <div
                 class="ant-calendar-header"

package.json

@@ -55,7 +55,7 @@
     "prop-types": "^15.6.2",
     "raf": "^3.4.0",
     "rc-animate": "^2.5.4",
-    "rc-calendar": "~9.9.2",
+    "rc-calendar": "~9.10.3",
     "rc-cascader": "~0.17.0",
     "rc-checkbox": "~2.1.5",
     "rc-collapse": "~1.10.0",