customXHR eventListener not working

[StuBlackett2022]

Just noticed this was a change from 2 days ago.

I've tried it in a Vue application and the eventListener is just not firing. The upload still works, but the console.logs do not appear at anytime throughout the process.

My code

async upload(file, imageService)
        {
            this.loadImage = true;

            var fileSize = file.size;
            var customXHR = new XMLHttpRequest();

            customXHR.upload.addEventListener('progress', function (e)
            {
                console.log(e);

                if (e.loaded <= fileSize)
                {
                    var percent = Math.round(e.loaded / fileSize * 100);
                    console.log(`Uploaded ${percent}%`);

                    this.percentage = Math.round(e.loaded / fileSize * 100);
                }

                if(e.loaded == e.total)
                {
                    console.log("Upload done");
                }
            });

            var imagekit = new ImageKit({
                publicKey : imageService.publicKey,
                urlEndpoint : imageService.urlEndpoint,
                authenticationEndpoint : imageService.authenticationEndpoint,
            });

            return await imagekit.upload({
                xhr: customXHR,
                file : file,
                fileName : file.name,
                folder: "Nautique"+"/"+this.folderPath,
            });
        }

[imagekitio]

Please share a hosted working application where I can see this.

The sample app in SDK uses same code and work. See if you are doing it the same way.

[imagekitio]

Please feel free to reopen with minimum code to reproduce this issue.