Merge pull request ManageIQ#9706 from asirvadAbrahamVarghese/enhance-select-accordion-item

Enhance select accordion item

Author: jrafanie

cypress/support/commands/explorer.js

@@ -58,7 +58,7 @@ Cypress.Commands.add('selectAccordionItem', (accordionPath) => {
     const expandAndClickPath = (accordionPathIndex, searchStartIndex) => {
       /* TODO: Remove logger once the command is confirmed to be stable */
       Cypress.log({
-        name: 'selectAccordionItem',
+        name: '🟢 selectAccordionItem',
         message: `Found ${listItems.length} list items, searching from index ${searchStartIndex}`,
       });
 
@@ -68,7 +68,7 @@ Cypress.Commands.add('selectAccordionItem', (accordionPath) => {
       for (let i = searchStartIndex; i < listItems.length; i++) {
         /* TODO: Remove logger once the command is confirmed to be stable */
         Cypress.log({
-          name: 'selectAccordionItem',
+          name: '🟢 selectAccordionItem',
           message: `Loop index: ${i} & Searching for label: ${accordionLabel}`,
         });
 
@@ -85,7 +85,7 @@ Cypress.Commands.add('selectAccordionItem', (accordionPath) => {
         if (isMatch) {
           /* TODO: Remove logger once the command is confirmed to be stable */
           Cypress.log({
-            name: 'selectAccordionItem',
+            name: '🟢 selectAccordionItem',
             message: `Matched "${liText}" at index ${i}`,
           });
 
@@ -104,6 +104,50 @@ Cypress.Commands.add('selectAccordionItem', (accordionPath) => {
             return;
           }
 
+          // TODO: Once interceptApi is enhanced to handle mutiple aliases, instead of
+          // depending on the spinner or angle-down spans, wait for tree_autoload to complete
+          /* ===================================================================================== */
+          const isStillLoading =
+            currentLiElement.find('span.fa-spinner').length > 0;
+          if (isStillLoading) {
+            Cypress.log({
+              name: '⚠️ selectAccordionItem',
+              message: `Node "${liText}" is still loading - waiting for fa-angle-down to appear`,
+            });
+
+            // Wait for fa-angle-down to appear (indicates loading is complete)
+            cy.wrap(currentLiElement)
+              .find('span.fa-angle-down')
+              .should('exist')
+              .then(() => {
+                Cypress.log({
+                  name: '🟢 selectAccordionItem',
+                  message: `Node "${liText}" loading completed (fa-angle-down found)`,
+                });
+                cy.get('div.panel-collapse.collapse.in')
+                  .then((latestAccordionJqueryObject) => {
+                    // Update the expanded accordion reference to the latest one
+                    expandedAccordion = latestAccordionJqueryObject;
+                    const updatedListItems = [
+                      ...expandedAccordion.find('li.list-group-item'),
+                    ];
+                    Cypress.log({
+                      name: '🟢 selectAccordionItem',
+                      message: `Re-queried accordion - new list items count: ${updatedListItems.length}`,
+                    });
+                    // Update list items
+                    listItems = [...updatedListItems];
+                  })
+                  .then(() => {
+                    // Recurse to the next label in the given path array and
+                    // start iteration from the current index
+                    expandAndClickPath(accordionPathIndex + 1, i + 1);
+                  });
+              });
+            return;
+          }
+          /* ===================================================================================== */
+
           const expandButton = currentLiElement.find('span.fa-angle-right');
           const isExpandable = expandButton.length > 0;
 
@@ -113,7 +157,7 @@ Cypress.Commands.add('selectAccordionItem', (accordionPath) => {
             // Expand the node
             /* TODO: Remove logger once the command is confirmed to be stable */
             Cypress.log({
-              name: 'selectAccordionItem',
+              name: '🟢 selectAccordionItem',
               message: `Expanding node "${liText}"`,
             });
             cy.interceptApi({
@@ -132,7 +176,7 @@ Cypress.Commands.add('selectAccordionItem', (accordionPath) => {
                     ];
                     /* TODO: Remove logger once the command is confirmed to be stable */
                     Cypress.log({
-                      name: 'selectAccordionItem',
+                      name: '🟢 selectAccordionItem',
                       message: `Re-queried accordion - new list items count: ${updatedListItems.length}`,
                     });
                     // Update list items