I would like to know if there is a way to check in Javascript if a bitmap image is a valid mask image?

I want to place a main bitmap on canvas (jpg,png) and I also want to upload a bitmap file that is going to perform as a mask of the main bitmap.

I would like to know if there is a way to check in Javascript if a bitmap image is a valid mask image? (Like the uploaded image)

I have created a codepen and upload a mask image. If you upload a mask image, you can see the changes on main bitmap on canvas, and if you upload a non mask image nothing will change. I need to validade the mask image by code in some way

`context.drawImage(bg, 0, 0, canvas.width, canvas.height);
maskInput.addEventListener('change', () => {
    mask.src = URL.createObjectURL(maskInput.files[0]);
    mask.onload = function() {  
        maskImage.setAttribute('src', mask.src)
        isMaskValid(maskImage)
     draw()
    }
})

function isMaskValid(maskImage){
//   todo
}
//You can check all code here
https://codepen.io/thaisdsilve/pen/zYaENbx`

enter image description here