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

Enhance select accordion item

Author: jrafanie

cypress/e2e/ui/Settings/Application-Settings/edit_collect_logs.cy.js

@@ -226,16 +226,10 @@ describe('Automate Collect logs Edit form operations', () => {
   describe('Settings > Application Settings > Diagnostics > Manage IQ Region > Zone > Collect logs > Edit', () => {
     beforeEach(() => {
       // Select "Zone:" accordion item
-      cy.interceptApi({
-        alias: 'treeSelectApi',
-        urlPattern:
-          /ops\/tree_select\?id=.*&text=.*Zone.*Default.*Zone.*(current).*/,
-        triggerFn: () =>
-          cy.selectAccordionItem([
-            MANAGEIQ_REGION_ACCORDION_ITEM,
-            ZONE_ACCORDION_ITEM,
-          ]),
-      });
+      cy.selectAccordionItem([
+        MANAGEIQ_REGION_ACCORDION_ITEM,
+        ZONE_ACCORDION_ITEM,
+      ]);
       // Select collect logs tab and open edit form
       goToCollectLogsTabAndOpenEditForm();
     });

cypress/e2e/ui/validate-intercept-api-command.cy.js

@@ -10,18 +10,11 @@ describe('Validate intercept command', () => {
 
   it('Should register the alias, intercept, wait & validate response status code when an API is fired', () => {
     cy.accordion('Diagnostics');
-    cy.interceptApi({
-      alias: 'treeSelectApi',
-      urlPattern: /\/ops\/tree_select\?id=.*&text=.*/,
-      triggerFn: () => cy.selectAccordionItem([/^ManageIQ Region:/, /^Zone:/]),
-      onApiResponse: (interception) => {
-        expect(interception.response.statusCode).to.equal(200);
-      },
-    }).then(() => {
-      // verifies that the alias is set and the request is intercepted & awaited
-      cy.getInterceptedApiAliases().then((interceptedAliasesObject) => {
-        expect(interceptedAliasesObject).to.have.property('post-treeSelectApi');
-      });
+    // Tree select api wait is handled from selectAccordionItem with alias 'treeSelectApi'
+    cy.selectAccordionItem([/^ManageIQ Region:/, /^Zone:/]);
+    // verifies that the alias is set and the request is intercepted & awaited
+    cy.getInterceptedApiAliases().then((interceptedAliasesObject) => {
+      expect(interceptedAliasesObject).to.have.property('post-treeSelectApi');
     });
   });
 
@@ -32,19 +25,14 @@ describe('Validate intercept command', () => {
       urlPattern: /\/ops\/accordion_select\?id=.*/,
       triggerFn: () => cy.accordion('Diagnostics'),
     });
-    // second api with alias 'treeSelectApi'
-    cy.interceptApi({
-      alias: 'treeSelectApi',
-      urlPattern: /\/ops\/tree_select\?id=.*&text=.*/,
-      triggerFn: () => cy.selectAccordionItem([/^ManageIQ Region:/, /^Zone:/]),
-    }).then(() => {
-      // verifies that both the aliases are set and the request is intercepted & awaited
-      cy.getInterceptedApiAliases().then((interceptedAliasesObject) => {
-        expect(interceptedAliasesObject).to.include.all.keys(
-          'post-accordionSelectApi',
-          'post-treeSelectApi'
-        );
-      });
+    // second api with alias 'treeSelectApi'(Tree select api wait is handled from selectAccordionItem with alias 'treeSelectApi')
+    cy.selectAccordionItem([/^ManageIQ Region:/, /^Zone:/]);
+    // verifies that both the aliases are set and the request is intercepted & awaited
+    cy.getInterceptedApiAliases().then((interceptedAliasesObject) => {
+      expect(interceptedAliasesObject).to.include.all.keys(
+        'post-accordionSelectApi',
+        'post-treeSelectApi'
+      );
     });
   });
 
@@ -59,15 +47,10 @@ describe('Validate intercept command', () => {
         expect(Object.keys(interceptedAliasesObject).length).to.equal(1);
       });
     });
-    // second first api with alias 'treeSelectApi'
-    cy.interceptApi({
-      alias: 'treeSelectApi',
-      urlPattern: /\/ops\/tree_select\?id=.*&text=.*/,
-      triggerFn: () => cy.selectAccordionItem([/^ManageIQ Region:/, /^Zone:/]),
-    }).then(() => {
-      cy.getInterceptedApiAliases().then((interceptedAliasesObject) => {
-        expect(Object.keys(interceptedAliasesObject).length).to.equal(2);
-      });
+    // second api with alias 'treeSelectApi'(Tree select api wait is handled from selectAccordionItem with alias 'treeSelectApi')
+    cy.selectAccordionItem([/^ManageIQ Region:/, /^Zone:/]);
+    cy.getInterceptedApiAliases().then((interceptedAliasesObject) => {
+      expect(Object.keys(interceptedAliasesObject).length).to.equal(2);
     });
     // third api with a duplicate alias as above 'accordionSelectApi'
     cy.interceptApi({

cypress/support/commands/explorer.js

@@ -48,7 +48,7 @@ Cypress.Commands.add('selectAccordionItem', (accordionPath) => {
       const isClickableNode = accordionPathIndex === accordionPath.length - 1;
 
       for (let i = searchStartIndex; i < listItems.length; i++) {
-        /* @RemoveLater: Remove logger once the command is confirmed to be stable */
+        /* TODO: Remove logger once the command is confirmed to be stable */
         Cypress.log({
           name: 'selectAccordionItem',
           message: `Loop index: ${i} & Searching for label: ${accordionLabel}`,
@@ -65,7 +65,7 @@ Cypress.Commands.add('selectAccordionItem', (accordionPath) => {
         }
 
         if (isMatch) {
-          /* @RemoveLater: Remove logger once the command is confirmed to be stable */
+          /* TODO: Remove logger once the command is confirmed to be stable */
           Cypress.log({
             name: 'selectAccordionItem',
             message: `Matched "${liText}" at index ${i}`,
@@ -75,8 +75,13 @@ Cypress.Commands.add('selectAccordionItem', (accordionPath) => {
           const currentLiElement = Cypress.$(listItems[i]);
           // If it's the last label in the path, then that is the desired item to click
           if (isClickableNode) {
-            // Click the node corresponding to the last label in the given path and terminate
-            cy.wrap(currentLiElement).click();
+            // Click the node corresponding to the last label in the given path,
+            // intercept & wait for the Tree-Select api and then terminate
+            cy.interceptApi({
+              alias: 'treeSelectApi',
+              urlPattern: /\/[^\/]+\/tree_select\?id=.*&text=.*/,
+              triggerFn: () => cy.wrap(currentLiElement).click(),
+            });
             return;
           }