async.series and async.each not working as expected

Question

I am attempting to build a web scraper using nodeJS that searches a website's HTML for images, caches the image source URLs, then searches for the one with largest size.

The problem I am having is deliverLargestImage() is firing before the array of image source URLs is looped through to get their file sizes. I am attempting to use both async.series and async.each to have this work properly.

How do I force deliverLargestImage() to wait until the async.each inside getFileSizes() is finished?

JS

var async, request, cheerio, gm;
async = require('async');
request = require('request');
cheerio = require('cheerio');
gm = require('gm').subClass({ imageMagick: true });

function imageScraper () {
  var imgSources, largestImage;
  imgSources = [];
  largestImage = {
    url: '',
    size: 0
  };

  async.series([
    function getImageUrls (callback) {
      request('http://www.example.com/', function (error, response, html) {
        if (!error && response.statusCode === 200) {
          var $ = cheerio.load(html);
          $('img').each(function (i, elem) {
            if ( $(this).attr('src').indexOf('http://') > -1 ) {
              var src = $(this).attr('src');
              imgSources.push(src);
            }
          });
        }
        callback();
      });
    },
    function getFileSizes (callback) {
      async.each(imgSources, function (img, _callback) {
        gm(img).filesize(function (err, value) {
          checkSize(img, value);
          _callback();
        });
      });
      callback();
    },
    function deliverLargestImage (callback) {
      callback();
      return largestImage;
    }
  ]);

  function checkSize (imgUrl, value) {
    var r, raw;
    if (value !== undefined) {
      r = /\d+/;
      raw = value.match(r)[0];
      if (raw >= largestImage.size) {
        largestImage.url = imgUrl;
        largestImage.size = raw;
      }
    }
  }
}

imageScraper();

Answer 1

Try moving the callback() here:

function getFileSizes (callback) {
  async.each(imgSources, function (img, _callback) {
    gm(img).filesize(function (err, value) {
      checkSize(img, value);
      _callback();
    });
  }, function(err){ callback(err); }); /* <-- put here */
  /* callback(); <-- wrong here */
},

each accepts a callback as a third parameter that gets executed when the inner loop over each element is finished:

Arguments

• arr - An array to iterate over.
• iterator(item, callback) - A function to apply to each item in arr. The iterator is passed a callback(err) which must be called once it has completed. If no error has occured, the callback should be run without arguments or with an explicit null argument.
• callback(err) - A callback which is called when all iterator functions have finished, or an error occurs.