@@ -4387,4 +4387,39 @@ describe("DatePicker", () => {
43874387 expect ( input . value ) . toBe ( DATE_VALUE ) ;
43884388 } ) ;
43894389 } ) ;
4390+
4391+ describe ( "Close on ESC Key" , ( ) => {
4392+ it ( "should close DatePicker on ESC key press" , ( ) => {
4393+ const { container } = render ( < DatePicker /> ) ;
4394+ const input = safeQuerySelector ( container , "input" ) ;
4395+
4396+ fireEvent . click ( input ) ;
4397+ const calendar = safeQuerySelector ( container , ".react-datepicker" ) ;
4398+
4399+ fireEvent . keyDown ( calendar , getKey ( KeyType . Escape ) ) ;
4400+
4401+ const calendarAfterEsc = container . querySelector ( ".react-datepicker" ) ;
4402+ expect ( calendarAfterEsc ) . toBeFalsy ( ) ;
4403+ } ) ;
4404+
4405+ it ( "should close DatePicker on ESC key press - even when the focus is at Calendar header buttons" , ( ) => {
4406+ const { container } = render ( < DatePicker /> ) ;
4407+ const input = safeQuerySelector ( container , "input" ) ;
4408+
4409+ fireEvent . click ( input ) ;
4410+ const calendar = safeQuerySelector ( container , ".react-datepicker" ) ;
4411+ const nextMontButton = safeQuerySelector (
4412+ calendar ,
4413+ "button.react-datepicker__navigation--next" ,
4414+ ) ;
4415+
4416+ fireEvent . click ( nextMontButton ) ;
4417+ fireEvent . click ( nextMontButton ) ;
4418+
4419+ fireEvent . keyDown ( nextMontButton , getKey ( KeyType . Escape ) ) ;
4420+
4421+ const calendarAfterEsc = container . querySelector ( ".react-datepicker" ) ;
4422+ expect ( calendarAfterEsc ) . toBeFalsy ( ) ;
4423+ } ) ;
4424+ } ) ;
43904425} ) ;
0 commit comments