Tuesday, December 12Be an Automation Engineer

async / await to avoid control flow

Many of us might have heard of control flow while using selenium based automation tools like selenium-webdriver(Javascript), protractor etc..

A brief idea about control flow for those who does not know about control flow.

What is control flow?
“WebDriverJS (and thus, Protractor) APIs are entirely asynchronous. All functions return promises. WebDriverJS maintains a queue of pending promises, called the control flow, to keep execution organized.”

How control flow maintains creates a queue of promises while executing our code?

Assume that we have created a protractor script by following jasmine framework as below.

describe('Control flow explanation example spec', function() {
    it('should find an element by text input model', function () {
        browser.get('http://www.angularjs.org');

        element(by.model('yourName')).sendKeys('Jane Doe');

        var welcomeText = element(by.binding('yourName')).getText();

        expect(welcomeText).toEqual('Hello Jane Doe!');

    });
});

All the Protractor code written above are asynchronous by nature. Protractor will arrange the above code as chain of promises to let it execute in a sequential way. So that our code will hit the browser in a synchronous manner as written line by line. 

The protractor converted code will look like below.

describe('Control flow explanation example spec', function () {
    it('should find an element by text input model', function () {
        browser.get('http://www.angularjs.org')
            .then(function () {
                return element(by.model('yourName')).sendKeys('Jane Doe');
            }).then(function () {
                return element(by.binding('yourName')).getText();
            }).then(function (welcomeText) {
                expect(welcomeText).toEqual('Hello Jane Doe!');
            });
    });
});

Here you can observe that all your code lines are moved to then block of previous line. This is how protractor executes asynchronous code in a synchronous way. This is called control flow. 

Note: Control flow is actually designed by selenium-webdriver. Protractor is using control flow to execute it’s code in a synchronous way. 

Why protractor is deprecating control flow?

Protractor is ultimately depends on selenium-webdriver’s control flow as I said in my note about. Selenium-webdriver is deprecating the control flow to avoid few known and unavoidable issues with it particularly while writing native javascript code along with protractor code. Also, Node.js is now supporting async /await since it’s 7.6 release. So promises world will be easy with async / await. 

How to use async /await in protractor?

If we want to use async / await, we should disable the control flow. We can not use the mix of both. Control flow becomes unreliable if we use it along with async await. So, first we should disable the control flow. We should add the below line into the protractor config file to disable the control flow.

SELENIUM_PROMISE_MANAGER: false

I WILL ADD EXAMPLE SOON…..

%d bloggers like this: