From c71d329f085af80afbe169413057461689df3aae Mon Sep 17 00:00:00 2001
From: Benjamin Monnot <benjamin@passbolt.com>
Date: Mon, 12 Aug 2024 16:14:03 +0200
Subject: [PATCH] PB-34314 Fix shadow-dom autofill fields

---
 src/react-web-integration/Autofill/Autofill.js | 18 ++++++------------
 src/react-web-integration/lib/Dom/DomUtils.js  |  9 +++------
 2 files changed, 9 insertions(+), 18 deletions(-)

diff --git a/src/react-web-integration/Autofill/Autofill.js b/src/react-web-integration/Autofill/Autofill.js
index e6549e18d..cb7adf007 100644
--- a/src/react-web-integration/Autofill/Autofill.js
+++ b/src/react-web-integration/Autofill/Autofill.js
@@ -13,6 +13,7 @@
  */
 import UserEventsService from "../lib/User/UserEventsService";
 import InFormFieldSelector from "../lib/InForm/InFormFieldSelector";
+import InFormCallToActionField from "../lib/InForm/InFormCallToActionField";
 
 /**
  * Fill the login form.
@@ -33,7 +34,7 @@ const fillForm = function(formData) {
     }
 
     // Get password element
-    const passwordElement = getPasswordElement(formData);
+    const passwordElement = getPasswordElement();
     let usernameElement = null;
     /*
      * If password element exists
@@ -200,8 +201,8 @@ const findInputElementInIframe = function(type, iframeDocument) {
  * Find the password element on the page.
  * @return {HTMLInputElement/null}
  */
-const getPasswordElement = function(formData) {
-  const passwordElements = document.querySelectorAll(InFormFieldSelector.PASSWORD_FIELD_SELECTOR);
+const getPasswordElement = function() {
+  const passwordElements = InFormCallToActionField.findAll(InFormFieldSelector.PASSWORD_FIELD_SELECTOR);
 
   // A password element has been found.
   if (passwordElements.length) {
@@ -210,16 +211,9 @@ const getPasswordElement = function(formData) {
         return passwordElement;
       }
     }
-    // If all passwords are hidden return null to autofill only the username input (PB-20173)
-    return null;
-  } else {
-    /*
-     * If no password element found on the page, the login form could be served by an iframe.
-     * Search the password element in the page iframes. By instance reddit.com login page serves its login
-     * form in an iframe.
-     */
-    return getInputElementFromIframe('password', formData);
   }
+  // If all passwords are hidden return null to autofill only the username input (PB-20173)
+  return null;
 };
 
 /**
diff --git a/src/react-web-integration/lib/Dom/DomUtils.js b/src/react-web-integration/lib/Dom/DomUtils.js
index a10131306..64a382e69 100644
--- a/src/react-web-integration/lib/Dom/DomUtils.js
+++ b/src/react-web-integration/lib/Dom/DomUtils.js
@@ -46,19 +46,16 @@ class DomUtils {
     const filterByShadowRoot = element => element.shadowRoot ? NodeFilter.FILTER_ACCEPT
       : NodeFilter.FILTER_SKIP;
     const treeWalker = document.createTreeWalker(
-      document.activeElement,
+      document.body,
       NodeFilter.SHOW_ELEMENT,
       filterByShadowRoot
     );
     const shadowDomDocuments = [];
-    // Check directly the next node to not have the main document
-    let currentNode = treeWalker?.nextNode();
-    while (currentNode) {
-      const shadowDom = browser.dom?.openOrClosedShadowRoot(currentNode) || currentNode.shadowRoot;
+    while (treeWalker.nextNode()) {
+      const shadowDom = browser.dom?.openOrClosedShadowRoot(treeWalker.currentNode) || treeWalker.currentNode.shadowRoot;
       if (shadowDom) {
         shadowDomDocuments.push(shadowDom);
       }
-      currentNode = treeWalker?.nextNode();
     }
     return shadowDomDocuments;
   }