i´ve been trying puppetter package in nodejs, and when i use data function works pretty different in contrast to for loop
here is what im talking about:
map function
data.map(async(info) =>{
let browser = await puppeteer.launch({ ignoreHTTPSErrors: true });
let page = await browser.newPage();
await page.goto(info.url, { waitUntil: "networkidle2" })
await page.screenshot({ path: info.src })
await browser.close();
})
console.log("map function completed");
this is the input of the map function:
map function completed
first screenshot saved
second screenshot saved
For loop is working like this:
let browser = await puppeteer.launch({ ignoreHTTPSErrors: true });
let page = await browser.newPage();
for (let i = 0; i<=data.length-1; i++) {
console.log(data[i].url);
await page.goto(data[i].url, { waitUntil: "networkidle2" })
await page.screenshot({ path: data[i].src })
}
await browser.close();
console.log("for loop completed");
this is the input of the for loop:
first screenshot saved
second screenshot saved
for loop completed
Why is this happening? i thought they work in the same way. I would like if somebody explain why is this.
if you want to make it work in the same way you have to change your first code in this way
const promises = data.map(async(info) =>{
let browser = await puppeteer.launch({ ignoreHTTPSErrors: true });
let page = await browser.newPage();
await page.goto(info.url, { waitUntil: "networkidle2" })
await page.screenshot({ path: info.src })
await browser.close();
})
await Promise.all(promises)
console.log("map function completed");
when you use map and async your items are transformed into promises and they will execute in parallel (in your case that's not true because your are using puppeteer) so you have to await that all of them are resolved to log the success message.
Your second code is more synchronous because it's all wrapper in the same function and every await are executed one after one
In the first case, because you use an asynchronous function within the map function, the first synchronous console.log() function works. Because normally asynchronous operation works after synchronous operation.
In the second case, thefor loop, top-level await, and the console.log() function work sequentially because they are synchronous.