From 84f29188a63387e208dbeb7ebcb80686bb262881 Mon Sep 17 00:00:00 2001
From: "blake.vandercar" <blake.vandercar@validatek.com>
Date: Mon, 6 Jun 2022 18:53:43 -0600
Subject: [PATCH 1/4] a11y datepicker fixes

---
 packages/core/src/components/html-select/htmlSelect.tsx | 9 ++++++++-
 packages/datetime/src/datePickerCaption.tsx             | 2 ++
 packages/datetime/src/datePickerNavbar.tsx              | 2 ++
 packages/datetime/src/shortcuts.tsx                     | 2 +-
 4 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/packages/core/src/components/html-select/htmlSelect.tsx b/packages/core/src/components/html-select/htmlSelect.tsx
index 7e183d8cd4..8605404037 100644
--- a/packages/core/src/components/html-select/htmlSelect.tsx
+++ b/packages/core/src/components/html-select/htmlSelect.tsx
@@ -91,7 +91,14 @@ export class HTMLSelect extends AbstractPureComponent2<HTMLSelectProps> {
 
         const optionChildren = options.map(option => {
             const props: OptionProps = typeof option === "object" ? option : { value: option };
-            return <option {...props} key={props.value} children={props.label || props.value} />;
+            return (
+                <option
+                    {...props}
+                    key={props.value}
+                    children={props.label || props.value}
+                    selected={this.props.value === props.value}
+                />
+            );
         });
 
         return (
diff --git a/packages/datetime/src/datePickerCaption.tsx b/packages/datetime/src/datePickerCaption.tsx
index 1e1dae68fc..5d63cde882 100644
--- a/packages/datetime/src/datePickerCaption.tsx
+++ b/packages/datetime/src/datePickerCaption.tsx
@@ -75,6 +75,7 @@ export class DatePickerCaption extends AbstractPureComponent2<IDatePickerCaption
 
         const monthSelect = (
             <HTMLSelect
+                aria-label="month"
                 iconProps={{ style: { right: this.state.monthRightOffset } }}
                 className={Classes.DATEPICKER_MONTH_SELECT}
                 key="month"
@@ -86,6 +87,7 @@ export class DatePickerCaption extends AbstractPureComponent2<IDatePickerCaption
         );
         const yearSelect = (
             <HTMLSelect
+                aria-label="year"
                 className={Classes.DATEPICKER_YEAR_SELECT}
                 key="year"
                 minimal={true}
diff --git a/packages/datetime/src/datePickerNavbar.tsx b/packages/datetime/src/datePickerNavbar.tsx
index 768e9e7c0c..df9c2ef408 100644
--- a/packages/datetime/src/datePickerNavbar.tsx
+++ b/packages/datetime/src/datePickerNavbar.tsx
@@ -39,6 +39,7 @@ export class DatePickerNavbar extends React.PureComponent<IDatePickerNavbarProps
             <div className={classNames(Classes.DATEPICKER_NAVBAR, classes.navBar)}>
                 {this.props.hideLeftNavButton || (
                     <Button
+                        aria-label="go to previous month"
                         className={classes.navButtonPrev}
                         disabled={areSameMonth(month, minDate)}
                         icon="chevron-left"
@@ -48,6 +49,7 @@ export class DatePickerNavbar extends React.PureComponent<IDatePickerNavbarProps
                 )}
                 {this.props.hideRightNavButton || (
                     <Button
+                        aria-label="go to next month"
                         className={classes.navButtonNext}
                         disabled={areSameMonth(month, maxDate)}
                         icon="chevron-right"
diff --git a/packages/datetime/src/shortcuts.tsx b/packages/datetime/src/shortcuts.tsx
index 132150963e..89ddb4b188 100644
--- a/packages/datetime/src/shortcuts.tsx
+++ b/packages/datetime/src/shortcuts.tsx
@@ -104,7 +104,7 @@ export class Shortcuts extends React.PureComponent<IShortcutsProps> {
         ));
 
         return (
-            <Menu className={DATERANGEPICKER_SHORTCUTS} tabIndex={0}>
+            <Menu aria-label="datepicker shortcuts" className={DATERANGEPICKER_SHORTCUTS} tabIndex={0}>
                 {shortcutElements}
             </Menu>
         );

From 44c666ca3af7fc90e15a15ad3c93daf95a225be7 Mon Sep 17 00:00:00 2001
From: Adi Dahiya <adi.dahiya14@gmail.com>
Date: Tue, 7 Jun 2022 08:26:57 -0400
Subject: [PATCH 2/4] Apply suggestions from code review

---
 packages/datetime/src/datePickerCaption.tsx | 4 ++--
 packages/datetime/src/datePickerNavbar.tsx  | 4 ++--
 packages/datetime/src/shortcuts.tsx         | 2 +-
 3 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/packages/datetime/src/datePickerCaption.tsx b/packages/datetime/src/datePickerCaption.tsx
index 5d63cde882..47d1feac57 100644
--- a/packages/datetime/src/datePickerCaption.tsx
+++ b/packages/datetime/src/datePickerCaption.tsx
@@ -75,7 +75,7 @@ export class DatePickerCaption extends AbstractPureComponent2<IDatePickerCaption
 
         const monthSelect = (
             <HTMLSelect
-                aria-label="month"
+                aria-label="Month"
                 iconProps={{ style: { right: this.state.monthRightOffset } }}
                 className={Classes.DATEPICKER_MONTH_SELECT}
                 key="month"
@@ -87,7 +87,7 @@ export class DatePickerCaption extends AbstractPureComponent2<IDatePickerCaption
         );
         const yearSelect = (
             <HTMLSelect
-                aria-label="year"
+                aria-label="Year"
                 className={Classes.DATEPICKER_YEAR_SELECT}
                 key="year"
                 minimal={true}
diff --git a/packages/datetime/src/datePickerNavbar.tsx b/packages/datetime/src/datePickerNavbar.tsx
index df9c2ef408..d43b2d47ad 100644
--- a/packages/datetime/src/datePickerNavbar.tsx
+++ b/packages/datetime/src/datePickerNavbar.tsx
@@ -39,7 +39,7 @@ export class DatePickerNavbar extends React.PureComponent<IDatePickerNavbarProps
             <div className={classNames(Classes.DATEPICKER_NAVBAR, classes.navBar)}>
                 {this.props.hideLeftNavButton || (
                     <Button
-                        aria-label="go to previous month"
+                        aria-label="Go to previous month"
                         className={classes.navButtonPrev}
                         disabled={areSameMonth(month, minDate)}
                         icon="chevron-left"
@@ -49,7 +49,7 @@ export class DatePickerNavbar extends React.PureComponent<IDatePickerNavbarProps
                 )}
                 {this.props.hideRightNavButton || (
                     <Button
-                        aria-label="go to next month"
+                        aria-label="Go to next month"
                         className={classes.navButtonNext}
                         disabled={areSameMonth(month, maxDate)}
                         icon="chevron-right"
diff --git a/packages/datetime/src/shortcuts.tsx b/packages/datetime/src/shortcuts.tsx
index 89ddb4b188..83252732cf 100644
--- a/packages/datetime/src/shortcuts.tsx
+++ b/packages/datetime/src/shortcuts.tsx
@@ -104,7 +104,7 @@ export class Shortcuts extends React.PureComponent<IShortcutsProps> {
         ));
 
         return (
-            <Menu aria-label="datepicker shortcuts" className={DATERANGEPICKER_SHORTCUTS} tabIndex={0}>
+            <Menu aria-label="Date picker shortcuts" className={DATERANGEPICKER_SHORTCUTS} tabIndex={0}>
                 {shortcutElements}
             </Menu>
         );

From 7a1ad07aed35273ebd4e6c6849397841f5ad60d9 Mon Sep 17 00:00:00 2001
From: "blake.vandercar" <blake.vandercar@validatek.com>
Date: Mon, 13 Jun 2022 14:23:20 -0600
Subject: [PATCH 3/4] fix chrome warning

---
 .../core/src/components/html-select/htmlSelect.tsx    | 11 ++---------
 1 file changed, 2 insertions(+), 9 deletions(-)

diff --git a/packages/core/src/components/html-select/htmlSelect.tsx b/packages/core/src/components/html-select/htmlSelect.tsx
index 8605404037..7e8991564b 100644
--- a/packages/core/src/components/html-select/htmlSelect.tsx
+++ b/packages/core/src/components/html-select/htmlSelect.tsx
@@ -91,19 +91,12 @@ export class HTMLSelect extends AbstractPureComponent2<HTMLSelectProps> {
 
         const optionChildren = options.map(option => {
             const props: OptionProps = typeof option === "object" ? option : { value: option };
-            return (
-                <option
-                    {...props}
-                    key={props.value}
-                    children={props.label || props.value}
-                    selected={this.props.value === props.value}
-                />
-            );
+            return <option {...props} key={props.value} children={props.label || props.value} />;
         });
 
         return (
             <div className={classes}>
-                <select disabled={disabled} ref={elementRef} {...htmlProps} multiple={false}>
+                <select disabled={disabled} ref={elementRef} value={this.props.value} {...htmlProps} multiple={false}>
                     {optionChildren}
                     {htmlProps.children}
                 </select>

From 9c97c46abb625d6fab2ae4e5c748a7b9046f8984 Mon Sep 17 00:00:00 2001
From: "blake.vandercar" <blake.vandercar@validatek.com>
Date: Mon, 13 Jun 2022 14:26:22 -0600
Subject: [PATCH 4/4] fix bug

---
 packages/core/src/components/html-select/htmlSelect.tsx | 9 +--------
 1 file changed, 1 insertion(+), 8 deletions(-)

diff --git a/packages/core/src/components/html-select/htmlSelect.tsx b/packages/core/src/components/html-select/htmlSelect.tsx
index 4eb2e63308..7e8991564b 100644
--- a/packages/core/src/components/html-select/htmlSelect.tsx
+++ b/packages/core/src/components/html-select/htmlSelect.tsx
@@ -91,14 +91,7 @@ export class HTMLSelect extends AbstractPureComponent2<HTMLSelectProps> {
 
         const optionChildren = options.map(option => {
             const props: OptionProps = typeof option === "object" ? option : { value: option };
-            return (
-                <option
-                    {...props}
-                    key={props.value}
-                    children={props.label || props.value}
-                    selected={this.props.value === props.value}
-                />
-            );
+            return <option {...props} key={props.value} children={props.label || props.value} />;
         });
 
         return (