How to handle Promises in do…while loop in Protractor

Question

it('AddnewSupplier1',function() {       
    var i =0;
    var isenabled=false;
    var count=0;

    element(by.css("path[d*='M20.995']")).click();
    element(by.cssContainingText('div[class="mat-step-text-label ng-star-inserted"]','Supplier Maintenance')).getText().then(function(text) {
        console.log(text);
    }).then(function() {
        do {
            if (i>0) {
                console.log("Clicking on NextButton");
                element(by.css("button[class='mat-paginator-navigation-next mat-icon-button']")).click();
            }

            (element.all(by.xpath("//table[@class='mat-table']/tbody/tr/td[1]"))).each(function(webelement) {
                webelement.getText().then(function(text) {                  
                    if(text=="IACE") {
                        count++;
                        console.log("Element is found");
                        //break;
                    }
                });
            });

            var nextbutton = element(by.css("button[aria-label='Next page']"));
            nextbutton.isEnabled().then(function(isEnabled) {               
                var isenabled=isEnabled;
                console.log(isenabled);             
            }).then(function() {
                i++;
                console.log(i);
            });
        }
        while(isenabled);
    })
});

I have to check if Supplier ID "IACE" is present in the table.

For that I have written code taking all the values in the first column of the table and check using "each".

If the element is present in the first page the code works. But if it is in second page or third then I have to click on the next button. Before clicking on the next button I need to check if the button is enabled or disabled. If the button is enabled, then I click on the next button and check if the element is present in that page and so on. If the button is disabled, then it means element is not present and I have to fail the testcase.

For this I have written code below. I have used Do...while because i the first page it has to check without condition (ie next button is enabled or not).

The issue happening is:

I have stored the isEnabled() value in isenabled variable.I have initialised this variable to false.

But when I run the testcase, though my value is in second page, it is not going to second page. Instead it checks in the first page and stops the test. This is happening because in while(isenabled) , isenabled is stored as false . I think before executing the isEnabled() function while(isenabled) is getting executed. Therefor while(isenabled) is getting false value which is initialised value.

I am unable to find where and how to resolve the promise here.

Answer 1

Still not sure what it is you are trying to accomplish but resolving the promise should work if you change your code like this:

    }).then(async function() { //add async
        do {
            // your code here up until var nextbutton = see next line

            var nextbutton = element(by.css("button[aria-label='Next page']"));

            isenabled = await nextbutton.isEnabled(); // await isEnabled and store result in isenabled variable
            console.log(isenabled);             
            i++;
            console.log(i);
        }
        while(isenabled);

if you can't use async/await you could also do the following:

.then(function() {
        function repeatMe() { // replace do with a function
            if (i>0) {
                console.log("Clicking on NextButton");
                element(by.css("button[class='mat-paginator-navigation-next mat-icon-button']")).click();
            }

            (element.all(by.xpath("//table[@class='mat-table']/tbody/tr/td[1]"))).each(function(webelement) {
                webelement.getText().then(function(text) {                  
                    if(text=="IACE") {
                        count++;
                        console.log("Element is found");
                        //break;
                    }
                });
            });

            var nextbutton = element(by.css("button[aria-label='Next page']"));
            nextbutton.isEnabled().then(function(isEnabled) {               
                console.log(isEnabled); // no need for isenabled variable anymore      
                i++;
                console.log(i);
                if (isEnabled) {
                    repeatMe(); // call repeatMe if isEnabled is true
                }
            });
        }
        repeatMe(); // replace while with calling function repeatMe once 
    })

Answer 2

I tried adding async and await,But when i add these it shows error (red cross mark).Di need to import anything before i add these async and await to my protractor scripts. I have done (SELENIUM_PROMISE_MANAGER: false, ) this in my configuration file.What else i need to do other than this to add async and await.