await Async function with selenium Nodejs

Question

I'm creating a small program to return the name of all the link titles when you search for something on google using selenium

here's the code:

const {Builder,By, Key, until} = require('selenium-webdriver');

driver = new Builder().forBrowser("firefox").build();

var search_query='tigers';

(async()=>{

await driver.get(`https://www.google.com/search?q=${search_query}`);

await driver.findElements(By.css('h3')).then((search_results)=>{ 
 for (var i = 0; i < search_results.length; i++)
  search_results[i].getText().then((text)=>{console.log(text);})
});

console.log('...Task Complete!')
})();

and when you run it the output is as follows:-

 ...Task Complete. Tiger - Wikipedia Top stories Tigers (2014 film) - Wikipedia Detroit Tigers (@tigers) · Twitter Tiger | Species | WWF Videos Official Detroit Tigers Website | MLB:com Tiger | WWF Tiger - National Geographic Kids Tiger guide, species facts. how they hunt and where to see in... Related searches Images Description

Clearly the ...Task Complete! should be logged after the entire function is completed

I don't understand what I'm doing wrong I've used the appropriate await keywords to keep the flow of code orderly, is the error in then() ?

Answer 1

Since your .then(()=>...) doesn't return a Promise, the await keyword at the beginning does nothing. Node has started the Promises of getting the h3's, getting their text content, and logging them, but your misplaced await doesn't tell Node to wait for all that to finish. You'll want to await getting the elements, then synchronously loop through all the elements, await ing the text, then synchronously print the text, and finally synchronously print "...Task Complete!"

const { Builder, By, Key, until } = require('selenium-webdriver');

const driver = new Builder().forBrowser("firefox").build();

const search_query = 'tigers';

(async () => {
    await driver.get(`https://www.google.com/search?q=${search_query}`);

    const h3Elements = await driver.findElements(By.css('h3'));
    for (const h3 of h3Elements) {
        const text = await h3.getText();
        console.log(text);
    }

    console.log('...Task Complete!')
})();

If you wanted to reduce extra variables, you can do this instead:

const { Builder, By, Key, until } = require('selenium-webdriver');

const driver = new Builder().forBrowser("firefox").build();

const search_query = 'tigers';

(async () => {
    await driver.get(`https://www.google.com/search?q=${search_query}`);

    const h3Elements = await driver.findElements(By.css('h3'));
    for (const h3 of h3Elements) {
        console.log(await h3.getText());
    }

    console.log('...Task Complete!')
})();