This is my code:

fetch(profilePictureURL, { mode: "no-cors" })
        .then(function (res) {
          return res.arrayBuffer();
        })
        .then(function (buf) {
          var file = new File([buf], "new.png", { type: "image/png" });
          console.log(file);
          const reader = new FileReader();
          reader.readAsDataURL(file);
          reader.addEventListener("load", () => {
            console.log(reader.result);
            uploadBytes(storageProfileBusinessRef, file);
          });
        });

console.log(reader.result) gives output data:.

While, console.log(file) gives output:

File {name: 'new.png', lastModified: 1657861829861, lastModifiedDate: Fri Jul 15 2022 10:40:29 GMT+0530 (India Standard Time), webkitRelativePath: '', size: 0, …}
lastModified: 1657861829861
lastModifiedDate: Fri Jul 15 2022 10:40:29 GMT+0530 (India Standard Time) {}
name: "new.png"
size: 0
type: "image/png"
webkitRelativePath: ""
[[Prototype]]: File

From the above output it seems that the size of file is 0. For that I did, console.log(buf), strangely it had a output ArrayBuffer(0).

But I have verified, that the image URL is perfectly alright. What could be the error here?