What Is The Best Way To Handle: Onload Not Being Triggered For Images With Size Zero In JavaScript?

To make sure an image is load on our page and then proceed to the next state, we have used the onload method as mentioned here:

image = new Image();

image.onload = function(){
  // go to the next state
};

image.src = image_url;

The issue is the event is not triggered for images with size zero and as a result the page stays in the halt mode and does not progress to the next state.

What is the best way to handle the issue with onload function not being triggered for images with size zero?

Related questions:

1- new Image(), how to know if image 100% loaded or not?

If you want your process to proceed when the image either finishes loading or fails to load, you can add your event handler to the .onerror event:

var image = new Image();

image.onload = image.onerror = function () { 
    // go to the next state
};

image.src = image_url;