Issue encountered when attempting to chain promises with async/await functionality

Question

Issue encountered when attempting to chain promises with async/await functionality

Here is my current code snippet:

await enterName();
await enterCity();
await submit();

async enterName() {
element.sendKeys('name');
}
async submit() {
element.submit();
waitForAngular();
}

The problem I am facing is that when calling the submit function asynchronously, it fails to make any network calls. I attempted using controlFlow, but it only seems to work if I fetch the URL right before submitting.

protractor.promise.controlFlow.execute( driver.get(url));
        await submit();

----------> this solves the issue!

However, my requirement is to first open the URL, fill out the form, and then initiate the asynchronous submit call. Is there anyone who can assist with this?

typescript async-await protractor

Answer 1

Answer №1

It is important to remember to await all functions that return promises, even those from protractor:

class y {
    element = element(".test");
    async fillOutForm() {
        await this.element.sendKeys('name');
    }

    async saveData() {
        return Promise.resolve();
    }

    async waitForPageLoad() {
        return Promise.resolve();
    }
    async finalizeSubmission() {
        await this.element.submit();
        await this.waitForPageLoad();  // Making sure this is also asynchronous.
    }

    async performTest() {
        await this.fillOutForm();
        await this.saveData();
        await this.finalizeSubmission();
    }
}

Answer 2

It is important to remember to await all functions that return promises, even those from protractor:

class y {
    element = element(".test");
    async fillOutForm() {
        await this.element.sendKeys('name');
    }

    async saveData() {
        return Promise.resolve();
    }

    async waitForPageLoad() {
        return Promise.resolve();
    }
    async finalizeSubmission() {
        await this.element.submit();
        await this.waitForPageLoad();  // Making sure this is also asynchronous.
    }

    async performTest() {
        await this.fillOutForm();
        await this.saveData();
        await this.finalizeSubmission();
    }
}

Answer 3

Answer №2

To effectively use `async/await`, it is imperative to turn off Control Flow.
A function must be declared as `async` if it contains a promise that needs to be handled using `await`.

Answer 4

To effectively use `async/await`, it is imperative to turn off Control Flow.
A function must be declared as `async` if it contains a promise that needs to be handled using `await`.

Issue encountered when attempting to chain promises with async/await functionality

Answer №1

Answer №2

Similar questions

What is the best way to transform HTML into a PDF using Angular 2?

Tips for merging individual Koa-Routers using Typescript

Is there a way to utilize an Event Emitter to invoke a function that produces a result, and pause until the answer is provided before continuing?

Guide on how to show the index value of an array on the console in Angular 2

An error occurs when attempting to access a property that does not exist on type 'never'. Why is this considered an error rather than a warning?

How should testable functions be exported in Typescript through an effective class design?

Having Trouble with React, TypeScript, and MUI Tabs? Dealing with Overload Errors?

React form submissions are not saving the state

Ways to fetch data based on a specific relationship criterion

Retrieve a prepared response from a TypeORM query

Utilizing a string variable as a property name for dynamic typing

The performance of linting has significantly decreased following the upgrade of nx/angular, particularly for the plugin import/no-deprecated

Steps for setting up single sign on in an Angular 2 application

An issue has occurred: changes.forEach does not function as expected

Utilizing Optional Generics in TypeScript

Retrieve a particular item using the NGXS selector and incorporate it into the template

Why is the return type for the always true conditional not passing the type check in this scenario?

Incorporating ng2-bootstrap into an Angular2 project with SystemJS starter template

utilize undefined files are assigned (Typescript, Express, Multer)

Return the subclass from the constructor function