FIX: Better focus support for modals (#13147)

FIX: Better focus support for modals (#13147)

diff --git a/app/assets/javascripts/discourse/app/components/d-modal-body.js b/app/assets/javascripts/discourse/app/components/d-modal-body.js
index fada626..27e0921 100644
--- a/app/assets/javascripts/discourse/app/components/d-modal-body.js
+++ b/app/assets/javascripts/discourse/app/components/d-modal-body.js
@@ -4,6 +4,7 @@ export default Component.extend({
   classNames: ["modal-body"],
   fixed: false,
   dismissable: true,
+  autoFocus: true,
 
   didInsertElement() {
     this._super(...arguments);
@@ -28,14 +29,6 @@ export default Component.extend({
   },
 
   _afterFirstRender() {
-    if (
-      !this.site.mobileView &&
-      this.autoFocus !== "false" &&
-      this.element.querySelector("input")
-    ) {
-      this.element.querySelector("input").focus();
-    }
-
     const maxHeight = this.maxHeight;
     if (maxHeight) {
       const maxHeightFloat = parseFloat(maxHeight) / 100.0;
@@ -57,7 +50,8 @@ export default Component.extend({
         "subtitle",
         "rawSubtitle",
         "dismissable",
-        "headerClass"
+        "headerClass",
+        "autoFocus"
       )
     );
   },
diff --git a/app/assets/javascripts/discourse/app/components/d-modal.js b/app/assets/javascripts/discourse/app/components/d-modal.js
index 8bb6568..144a9cc 100644
--- a/app/assets/javascripts/discourse/app/components/d-modal.js
+++ b/app/assets/javascripts/discourse/app/components/d-modal.js
@@ -132,13 +132,18 @@ export default Component.extend({
 
     this.set("headerClass", data.headerClass || null);
 
-    if (this.element) {
-      const autofocusInputs = this.element.querySelectorAll(
+    if (this.element && data.autoFocus) {
+      let focusTarget = this.element.querySelector(
         ".modal-body input[autofocus]"
       );
 
-      if (autofocusInputs.length) {
-        afterTransition(() => autofocusInputs[0].focus());
+      if (!focusTarget && !this.site.mobileView) {
+        focusTarget = this.element.querySelector(
+          ".modal-body input, .modal-body button, .modal-footer input, .modal-footer button"
+        );
+      }
+      if (focusTarget) {
+        afterTransition(() => focusTarget.focus());
       }
     }
   },

GitHub sha: 681a129e

This commit appears in #13147 which was approved by pmusaraj. It was merged by eviltrout.