Запускается ли событие, когда элемент HTML-ссылки (‹a/›), содержащий данные base64 в виде href, готов?

Я создал веб-страницу, которая в основном отображает два изображения рядом.

У него есть кнопка «загрузить», которая запускает обычную функцию Javascript, которая создает <canvas> HTML-элемент и объединяет два изображения внутри него. Затем он создает ссылку с изображением результата в кодировке base64 как href и щелкает по нему:

<a download="image.png" id="dllink" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABQAAAAMnCAYAAABhnf9DAAAgAElEQVR4nOzdR48kD3rn96j03pfv6qo21dVd3qT3JryP9Jll281..."></a>

Вот как выглядит функция, которую я использую:

/** 
 * Create canvas, draw both images in it, create a link with the result
 * image in base64 in the "href" field, append the link to the document,
 * and click on it
 */
function saveImage() {

    // Get left image
    var imgLeft = new Image();
    imgLeft.setAttribute('crossOrigin', 'anonymous');
    imgLeft.src = "imgleft/" + idxImageShownLeft + ".jpg";
    imgLeft.onload = function() {

        // Once the left image is ready, get right image
        var imgRight = new Image()
        imgRight.setAttribute('crossOrigin', 'anonymous');
        imgRight.src = "imgright/" + idxImageShownRight + ".jpg";
        imgRight.onload = function() {

            // Once the right image is ready, create the canvas
            var canv = document.createElement("canvas");
            var widthLeft = parseInt(imgLeft.width);
            var widthRight = parseInt(imgRight.width);
            var width = widthLeft + widthRight;
            var height = imgLeft.height;

            canv.setAttribute("width", width);
            canv.setAttribute("height", height);
            canv.setAttribute("id", "myCanvas");
            canv.setAttribute('crossOrigin', 'anonymous');
            var ctx = canv.getContext("2d");

            // Draw both images in canvas
            ctx.drawImage(imgLeft, 0, 0);
            ctx.drawImage(imgRight, widthLeft, 0);

            // Create PNG image out of the canvas
            var img = canv.toDataURL("image/png");

            // Create link element
            var aHref = document.createElement('a');
            aHref.href = img;
            aHref.setAttribute("id", "dllink");
            aHref.download = "image.png";

            // Append link to document
            var renderDiv = document.getElementById("render");
            renderDiv.replaceChild(aHref, document.getElementById("dllink"));

            // Click on link
            aHref.click();
        }
    }
}

Моя проблема в том, что это отлично работает в Firefox, но не в Chrome.

После небольшого исследования я понял, что установка точки останова перед строкой aHref.click(); в Chrome работает нормально. Я думаю, что это означает, что aHref.click(); вызывается до того, как <a href="data:image/png;base64,...></a> готов для нажатия, но я не знаю наверняка.

• Мне не удалось найти дубликата этой темы. Какие ключевые слова мне следует использовать, чтобы быть уверенным на 100%?
• Я веду расследование в правильном направлении?
• Есть ли событие, на которое я мог бы положиться, чтобы вызвать aHref.click(); только тогда, когда он будет готов?