I'm trying to build a tool that allows me to upload hundreds of less than 1 mb files to my website with "<input type="file" multiple"

It works perfectly but when I select more than 40 files it completely stops (apparently type="file" multiple uploaded multiple files simultaneously so I thought THIS was the problem).

So I did a loop and instead and ONLY uploaded 1 file at a time and waited until complete before uploading next. IT HAS THE SAME PROBLEM. It seems every time it comes up to AROUND 40 files, it just stops. I even killed the upload process in PHP File to see if it's the upload it self or not.

    <input type="file" multiple id="file-input" accept=".jpg, .jpeg, .png"><br>
<button id="upload-button">Upload File</button><br>
    
<script stuff below:>

    document.querySelector('#upload-button').addEventListener('click', function() {
    
    files_total = document.querySelector('#file-input').files.length;
    
    files_completed = 0;
    Upload_the_file(files_completed);   // upload only the 1st file
    }); 
    
    function Upload_the_file(i){        // this is a function called to upload 1 file
    
        let data = new FormData();
        data.append('file', document.querySelector('#file-input').files[i]);

        let request = new XMLHttpRequest();
        request.open('POST', 'upload.php'); 

        request.upload.addEventListener('progress', function(e) {       //this only shows progress
            let percent_complete = (e.loaded / e.total)*100;
            //Add_log('file ' + (i+1) + ': ' + percent_complete.toFixed());
        });
        
    
        request.addEventListener('load', function(e) {      // this load when PHP is done with uploading

            if (!(request.response=="File uploaded successfully")){
                alert("error");
                return;
            }
            files_completed += 1;

            if (files_completed==files_total){ 
                Add_log("Done!");
                alert('completely done');
            }else{
                Upload_the_file(files_completed);       // upload next file. This will call upon this same function until we're done
            }
        });

        request.send(data); 
    }   // end of function

Do I have to end or close a addEventListener ? I have no idea why it stops exactly around 40 files :( Thought it was calling the upload.php too often but it's only doing so every 5-6 seconds. Is there some type of timeout or something I'm missing? Please note, the functions to upload a new file is ONLY called after it's done uploading and the "request.addEventListener('load', function(e) { " has been fired! Please help :( Thank you so much!