Javascript-Edge browser- TypeError: Function expected

Question

This code will show an error: TypeError: Function expected

function btnUploadImageEvent() {
    $(document).on("click", "#btn-upload-image", function () {

        // Iterate all td's in second column
        $("#table-image tbody tr:not(:first-child)").each(function (index, value) {
            var blob = value.cells[5].innerText;
            var fileName = (index + 1) + ".jpg";

            srcToFile(blob, fileName, "image/jpeg")
                .then(function (file) {
                    var formData = new FormData();
                    formData.append("file", file);

                    PassingBlobToServer(formData);
                }, function (error) {
                    MsgBox("Error", error, "error", "#upload-image-modal");
                }).then(function () {
                });
        });
    });
}

function srcToFile(src, fileName, mimeType) {
    return (fetch(src)
        .then(function (res) { return res.arrayBuffer(); })
        .then(function (buf) { return new File([buf], fileName, { type: mimeType }); })
    );
}

I read this article already: https://learn.microsoft.com/en-us/scripting/javascript/misc/function-expected

However, I'm still not understanding what MS say. This must be something wrong in my code. Please help me, thanks a lot.

Which line cause error? Are you able to create codepen or fiddle? And the function `PassingBlobToServer` is defined somewhere? — Tan Duong, Apr 18 '18 at 03:13
This error is showed here: MsgBox("Error", error, "error", "#upload-image-modal"); — Nguyễn Minh Vương, Apr 18 '18 at 03:16
Can you show us this function `MsgBox`? I think pure Javascript not support this function. — Tan Duong, Apr 18 '18 at 03:22
It doesn't matter in the function MsgBox. Without the function, it's still error. Something wrong must be here: `return new File([buf], fileName, { type: mimeType })` in `srcToFile` function. — Nguyễn Minh Vương, Apr 18 '18 at 03:26
`File()` contructor is not supported in Egde https://developer.mozilla.org/en-US/docs/Web/API/File/File — Tan Duong, Apr 18 '18 at 03:35
oke thanks you, I'm thinking the way to change this. Do you have any ideas? — Nguyễn Minh Vương, Apr 18 '18 at 03:46
Maybe [this link](https://stackoverflow.com/questions/40911927/instantiate-file-object-in-microsoft-edge) will help you — Tan Duong, Apr 18 '18 at 03:53

score 10 · Accepted Answer · edited Nov 08 '18 at 23:49

10

(As @Tan Duong's help.)

Problem is browser compatibility.

File() constructor is not supported by Edge or IE.

Workaround: we can use Blob constructor (supported) instead:

var blob = new Blob([blobContent], {type : 'image/jpeg'});

Refer: https://stackoverflow.com/a/43241922/9156186

edited Nov 08 '18 at 23:49

Geoffrey Hale

10,597
5
44
45

answered Oct 19 '18 at 02:29

Nguyễn Minh Vương

359
5
17

this was a live saver, thanks – ManuEl Magak Jan 13 '21 at 08:25

Javascript-Edge browser- TypeError: Function expected

1 Answers1