title: Mapping over array using Async/Await with Puppeteer to return result
body: <p>I'm new to working with async programming, so there may be something simple I'm missing out on here.</p>
  
  <p>I have an express project, I'm passing an array in the body of my request.</p>
  
  <p>Inside my function, I validate the body then parse the array and use a promise as I map over the array.</p>
  
  <pre><code>const games = JSON.parse(JSON.stringify(req.body.games));
  
  const gamesMap = games.map((game) =&gt; gameSearch(game));
  
  return Promise.all(gamesMap)
      .then(function(g) {
          // async is still running here, I want to wait until it returns 
          console.log(g); // returns [ undefined, undefined, ... ]
      });
  </code></pre>
  
  <p>The game search function uses <code>puppeteer</code> to use a headless browser to return prices of the game passed in array. However, it doesn't wait until the array is returned before <code>Promise.all</code> is called, so the <code>console.log(g);</code> above returns an undefined array. I assume it is something to do with using async await inside the <code>gameSearch</code> function, although I'm not sure what I am supposed to do here? Any help would be greatly appreciated.</p>
  
  <pre><code>function gameSearch(game) {
    (async () =&gt; {
      const url = '.....' + game;
      try {
        const browser = await puppeteer.launch();
        const page = await browser.newPage();
        await page.setUserAgent('Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36');
        await page.goto(url);
        const selector = '.searchRcrd';
        await page.waitForSelector(selector);
  
        const searchRcrds = await page.$$(selector);
  
        const records = [];
  
        for (let i = 0; i &lt; searchRcrds.length; i++) {
          const searchRcrd = searchRcrds[i];
          const title = await searchRcrd.$eval('h1', (h1) =&gt; h1.innerText.trim());
          const buyFor = await searchRcrd.$eval('.desc .prodPrice div:nth-child(2) .priceTxt:nth-child(1)', (buy) =&gt; buy.innerText.trim());
          const inStoreFor = await searchRcrd.$eval('.desc .priceTxt:nth-child(2)', (inStore) =&gt; inStore.innerText.trim());
          const imgSrc = await searchRcrd.$eval('div.thumb &gt; a &gt; img', (img) =&gt; img.src.trim());
  
          records.push({
            'title': title,
            'buyFor': buyFor,
            'inStoreFor': inStoreFor,
            'imgSrc': imgSrc
          });
        }
  
        await browser.close();
  
        return records;
      } catch (err) {
        next(err);
      }
    })();
  }
  </code></pre>