Can my chrome extension upload images to a webpages?

Question

I am creating a chrome extension, that saves image urls from previous webpages. Is there any way for me, to upload the images for the user, to a webpages upload section, such as: Pages upload section

This is what the input html looks like:

<label>
 <form>
  <input accept="image/*,image/heif,image/heic" 
  class="mkhogb32" multiple="" type="file">
 </form>
</label>

Here is what I have so far:

  // load the image
       var img = new Image();
       img.setAttribute('crossOrigin', 'anonymous');
       img.src = result.products[pointer][3];

       // loaded
       img.onload = function() {
           // convert the image into a data url
           var dataUrl = getImageDataUrl(img);
           var blob = dataUrlToBlob(dataUrl);
           console.log(blob);

           var form = document.querySelectorAll('form');

           var formData = new FormData(form);
           formData.append("file", blob, "image_name.png");

           var request = new XMLHttpRequest();

           // upload
           request.open("POST", "/marketplace/create/item");
           request.send(formData);

          //  chrome.storage.local.get( function(result) {
          // })
       };

       //https://scontent-lga3-2.xx.fbcdn.net/v/t1.6435-9/194808255_1211628689294995_1686587396345915188_n.jpg?_nc_cat=107&ccb=1-3&_nc_sid=0d5531&_nc_ohc=mErP2svwNu0AX8Rb0uO&_nc_ht=scontent-lga3-2.xx&oh=c80e70ed525b3a956c4f5c8c70f58048&oe=60E32CCB


       // converts an image into a dataurl
       function getImageDataUrl(img) {
           // Create an empty canvas element
           var canvas = document.createElement("canvas");
           canvas.width = img.width;
           canvas.height = img.height;

           // Copy the image contents to the canvas
           var ctx = canvas.getContext("2d");
           ctx.drawImage(img, 0, 0);

           // NOTE:  this will throw a cross-origin security exception
           // if not done in an extension and if the image is cross-origin
           return canvas.toDataURL("image/png");
       }

       // converts a dataurl into a blob
       function dataUrlToBlob(dataUrl) {
           var binary = atob(dataUrl.split(',')[1]);
           var array = [];
           for(var i = 0; i < binary.length; i++) {
               array.push(binary.charCodeAt(i));
           }
           return new Blob([new Uint8Array(array)], {type: 'image/png'});
       }

I want the images to upload when the user clicks my html injected button on the page. This what I want to happen once my injected html button is clicked:

1. Send image to webpages server (WORKS FINE)

   • Here is image showing my image was sent to the pages server: My image uploaded to server

   • Here is what the image looks like if it were manually added: Manually uploaded image

2. Have that image uploaded to facebooks "Add Photos" section. (NO PHOTO IS BEING PREVIEWED ON THE ADD PHOTO SECTION)

Is it possible?