I have a simple form in html that looks like this:

<form method="post" id="postImageForm" action="storeImage.php">
    <input type="hidden" name="image" id="image-tag">
    <button class="capture-button" type="submit" value="submit"></button>
</form>

and a Javascript eventListner :

PostForm.addEventListener('submit', function(e){
    
    e.preventDefault();
    let imageTag = document.getElementById('image-tag');
    html2canvas(displayScreen).then(canvas=>{
        imageTag.value = canvas.toDataURL();
        appendThumbnail(canvas.toDataURL());
        console.log("inside the promise: "+imageTag.value) //valid results.
    });
    console.log("outside the promise: "+imageTag.value); //empty results.
})

my php file receives empty value and so is my console.log() outside the promise scope.

How can it be fixed to send the value into POST?