javascript - Protractor :e2e : Allure report : Issue with allure.createStep

Question

I am using allure report and facing a issue with allure.createStep. When the report is generated then the attachment is not getting added to the first step 'Click on Add Button' infact it is getting added to the next step 'Candidate Add Button'
Here screenshot 1 shifted to next step and same happened for screenshot 2 :

Below is the code I am using :->

     async function attachScreenshot(filename: string) {
          browser.takeScreenshot().then(function (png) {
            allure.createAttachment(filename, function () {
              return Buffer.from(png, 'base64')
            }, 'image/png')();
          })
        }
    
    
        fit('Create Candidate', async () => {
            await browser.refresh();
    // First Step
             await allure.createStep("Click on Add Button ", async () => {
            await browser.wait(until.elementToBeClickable(SpadesPageObj.add), 20000, 'Add Button');
            await SpadesPageObj.add.click();
             await attachScreenshot('1');
            })();
            
    // Second Step
    
    await allure.createStep("Candidate Add Button", async () => {
              await browser.wait(until.elementToBeClickable(SpadesPageObj.candidate), 20000, 'Add Candidate Button');
              await SpadesPageObj.candidate.click();
              await attachScreenshot('2');
            })();
            // await browser.wait(until.elementToBeClickable(SpadesPageObj.candidate), 20000, 'Add Candidate Button');
            // await SpadesPageObj.candidate.click();
            // await allure.createAttachment('Candidate Add Button ', new Buffer(png, 'base64'));
            //});
//Third step
            await allure.createStep("Resume upload", async () => {
              var path = require('path');
              var remote = require('../../node_modules/selenium-webdriver/remote');
              browser.setFileDetector(new remote.FileDetector());
              var fileToUpload = './resume.docx';
              var absolutePath = path.resolve(process.cwd() + fileToUpload);
              await element(by.css('input[type="file"]')).sendKeys(absolutePath);
              await attachScreenshot('3');
        })();
          })

Any help will be appreciated :)

Answer 1

It was happening because I have not used await in the attachScreenshot function.

async function attachScreenshot(filename: string) {
     await browser.takeScreenshot().then(function (png) {
        allure.createAttachment(filename, function () {
          return Buffer.from(png, 'base64')
        }, 'image/png')();
      })
    }

Thank you very much :)