How to resolve the promise in protractor

Question

I have created a simple script on protractor but for me the script is not running correctly. Please find the code and output

 it('Test#5.5 - Select top 5 Email Dumps', async () => {
    let testId = 5.5;
    let timeKey = 'Select top 5 Email Dumps';
    console.time(timeKey);
    log.info('\n', 'Selecting top 5 Email Dumps one after one')
    // let email_dumps_list = await element.all(by.xpath('//*[contains(@data-selenium,"email_dump_item")]')).count();
    // log.info('list of email dumps are ' + email_dumps_list);
    for (let i = 0; i < 5; i++) {
      let email_dump_item = await element.all(by.xpath('//*[contains(@data-selenium,"email_dump_item")]/div/span')).get(i);
      selectElementAndCheckText(email_dump_item, testId + '_' + i)
}
});

 async function selectElementAndCheckText(obj, testId) {
    // const email_dump_0 = await element.all(by.xpath('//*[contains(@data-selenium,"email_dump_item")]/div/span')).get(element);
    let email_dump_name = await obj.getText()
    log.info('Clicking on ' + email_dump_name + ' email dump')
    obj.click().then(async function(){
    const email_header_name = element(by.css('div[data-testid="data-dump-page"] > * .MuiToolbar-gutters'));
    if (browser.wait(EC.visibilityOf(email_header_name), 5000)) {
      checkText(email_dump_name, await email_header_name.getText(), 'Email details shown doesn\'t match with the selected Dump', testId)
      log.info("Pass")
      return true;
    }
    else {
      log.error('Email dump details not loaded')
      return false;
    }
  });
  }

 async function checkText(actualText, expectedText, errorMessage, testId) {
    try {
      assert.equal(actualText, expectedText, errorMessage, '\n')
    } catch (error) {
      console.log(error);
    }
  }

Output

Selecting top 5 Email Dumps one after one
[1028/234735.013:INFO:CONSOLE(1)] "true SORT", source: https://webapp-dev-raven.ocp-nonprod.com/static/js/main.88ddd1a0.chunk.js (1)

Clicking on Selenium email dump email dump
Clicking on 10k email upload test email dump
Clicking on 191 emails test email dump
Clicking on another 100 emails email dump
Clicking on simulated 100 emails email dump

AssertionError [ERR_ASSERTION] [ERR_ASSERTION]: Email details shown doesn't match with the selected Dump
    at checkText (C:\Users\webapp\test\e2e\email-dumps-test.js:270:14)
    at C:\Users\webapp\test\e2e\email-dumps-test.js:114:7
    at processTicksAndRejections (internal/process/task_queues.js:95:5) {
  generatedMessage: false,
  code: 'ERR_ASSERTION',
  actual: 'Selenium email dump',
  expected: 'simulated 100 emails',
  operator: '=='
}
Pass

AssertionError [ERR_ASSERTION] [ERR_ASSERTION]: Email details shown doesn't match with the selected Dump
    at checkText (C:\Users\webapp\test\e2e\email-dumps-test.js:270:14)
    at C:\Users\webapp\test\e2e\email-dumps-test.js:114:7
    at processTicksAndRejections (internal/process/task_queues.js:95:5) {
  generatedMessage: false,
  code: 'ERR_ASSERTION',
  actual: '10k email upload test',
  expected: 'simulated 100 emails',
  operator: '=='
}
Pass

AssertionError [ERR_ASSERTION] [ERR_ASSERTION]: Email details shown doesn't match with the selected Dump
    at checkText (C:\Users\webapp\test\e2e\email-dumps-test.js:270:14)
    at C:\Users\webapp\test\e2e\email-dumps-test.js:114:7
    at processTicksAndRejections (internal/process/task_queues.js:95:5) {
  generatedMessage: false,
  code: 'ERR_ASSERTION',
  actual: '191 emails test',
  expected: 'simulated 100 emails',
  operator: '=='
}
Pass

If you notice the output, the for loop is executing first before going in to obj.click().then function and so its printing the log and then doing the actual test. Can you please let me know if I am doing anything wrong here.

Answer 1

Because your function selectElementAndCheckText() and selectElementAndCheckText () are Async, so you need to prefix await when call them.

await should be added into following place:

for (let i = 0; i < 5; i++) {
   let email_dump_item = await element.all(by.xpath('//*[contains(@data-selenium,"email_dump_item")]/div/span')).get(i);
   await selectElementAndCheckText(email_dump_item, testId + '_' + i)

....

    if (browser.wait(EC.visibilityOf(email_header_name), 5000)) {
      await checkText(email_dump_name, await email_header_name.getText(), 'Email details shown doesn\'t match with the selected Dump', testId)