[4.3] Fix submit button focus on frontend MFA captive login page when using Webauthn (#40555)

* Fix submit button focus on MFA captive site login

* Revert "[4.3] Fix javascript error on frontend MFA captive login page (#40330)"

This reverts commit b5f5db7.

* Use optional chaining operator

* Revert unneccessary check for the button

* PHPCS

---------

Co-authored-by: Olivier Buisard <[email protected]>

Author: richard67

build/media_source/com_users/js/two-factor-focus.es6.js

@@ -9,7 +9,7 @@
   document.addEventListener('DOMContentLoaded', () => {
     const elCodeField = document.getElementById('users-mfa-code');
     const elValidateButton = document.getElementById('users-mfa-captive-button-submit');
-    const elToolbarCustomElement = document.getElementById('toolbar-user-mfa-submit');
+    const elToolbarButton = document.getElementById('toolbar-user-mfa-submit')?.querySelector('button');
 
     // Focus the code field. If the code field is hidden, focus the submit button (useful e.g. for WebAuthn)
     if (
@@ -21,8 +21,8 @@
       if (elValidateButton) {
         elValidateButton.focus();
       }
-      if (elToolbarCustomElement) {
-        elToolbarCustomElement.querySelector('button').focus();
+      if (elToolbarButton) {
+        elToolbarButton.focus();
       }
     }
 

components/com_users/tmpl/captive/default.php

@@ -20,12 +20,10 @@
  * @var HtmlView     $this  View object
  * @var CaptiveModel $model The model
  */
-$model           = $this->getModel();
+$model = $this->getModel();
 
-if ($this->renderOptions['field_type'] !== 'custom') {
-    $this->document->getWebAssetManager()
-            ->useScript('com_users.two-factor-focus');
-}
+$this->document->getWebAssetManager()
+    ->useScript('com_users.two-factor-focus');
 
 ?>
 <div class="users-mfa-captive card card-body">