How to mock axios put or post request with onUploadProgress config using MSW

[chetankondawle]

I have an file upload API, which has a config to check the progress of file being uplaoded using onUploadProgress. It takes a callback, which takes a progressEvent as ain argument, which gives me total file size and uploaded file size.

I tried mocking this particular upload api request with MSW. MSW does not intercept the request and directly the catch block is called in test case. When, I remvoe the onUploadProgress config, MSW intercepts the request and returns the resposne correctly.

How to mock the request which has onUploadProgress config using MSW?

Here is the code snippet for axios config.

axiosClient.put(
    `/uploadFile/files`,
    formData,
    {
        timeout: 35000,
        headers: {
            "Content-Type": "multipart/form-data",
        },
        onUploadProgress: (progressEvent) => {
            const progress: number = Math.round(
                (progressEvent.loaded * 100) / progressEvent.total
            );
            console.log("progress");
            setProgressMap((prev) => new Map(prev.set(fileName, progress)));
        },
    }).then((res) => {
        console.log("Here");
        return res.data;
    }).catch((error) => {
        console.log("error);
    });

Form data holds the file object .