title: How to return data from page.evaluate() in Puppeteer, when there is Promise.all() inside browser in JavaScript
body: <p>I want to find average color of all images in the page. I am using Puppeteer to launch chromium and then run javascript inside browser.</p>
  <p>Problem is that I am using Promies.all to asynchronously calculate all colors inside browser.</p>
  <p>I want to return calculated image colors to page.evaluate. How can I do that? Is it possible?</p>
  <p>Following code does not work, because imgcolors is no defined obviously, it is returned inside Promise.all callback.</p>
  <pre><code>   const returned = await page.evaluate(async () =&gt; {
     const fac = new FastAverageColor();
     const imgs = Array.from(document.querySelectorAll('img'));
     const imgpromises = imgs.map(img =&gt; fac.getColorAsync(img.src));
  
  
     Promise.all(imgpromises).then(imgcolors =&gt; { return imgcolors;});
  
     return {
       document:{
         height: document.body.scrollHeight, 
         width:document.body.scrollWidth 
       },
       imgcolors:imgcolors
     };
   });
  </code></pre>
  <p>I have tried following:</p>
  <pre><code>Promise.all(imgpromises).then(imgcolors =&gt; { 
        
        return {
          elements:elements, 
          document:{
            height: document.body.scrollHeight, 
            width:document.body.scrollWidth 
          },
          imgcolors:imgcolors
        };
      });
  
  </code></pre>
  <p>Now I am not returing data to page.evaluate puppeteer function. So const returned is undefined.</p>
  <p>How to do that? Thank you in advance!</p>