UX: Add auto focus to hamburger and user menu dropdowns (#13165)

UX: Add auto focus to hamburger and user menu dropdowns (#13165)

diff --git a/app/assets/javascripts/discourse/app/widgets/header.js b/app/assets/javascripts/discourse/app/widgets/header.js
index eb47b84..784d526 100644
--- a/app/assets/javascripts/discourse/app/widgets/header.js
+++ b/app/assets/javascripts/discourse/app/widgets/header.js
@@ -506,11 +506,21 @@ export default createWidget("header", {
 
     this.state.userVisible = !this.state.userVisible;
     this.toggleBodyScrolling(this.state.userVisible);
+
+    // auto focus on first button in dropdown
+    schedule("afterRender", () =>
+      document.querySelector(".user-menu button")?.focus()
+    );
   },
 
   toggleHamburger() {
     this.state.hamburgerVisible = !this.state.hamburgerVisible;
     this.toggleBodyScrolling(this.state.hamburgerVisible);
+
+    // auto focus on first link in dropdown
+    schedule("afterRender", () => {
+      document.querySelector(".hamburger-panel .menu-links a")?.focus();
+    });
   },
 
   toggleBodyScrolling(bool) {

GitHub sha: b9053c5e

This commit appears in #13165 which was approved by pmusaraj and SamSaffron. It was merged by SamSaffron.