Error fetching file content: RangeError: Maximum call stack size exceeded, when trying to get files from a link

Question

In my extension, I'm trying to fetch file content from a list of links I have from the HTML of a website, which is updated on document change using an MutationObserver object.

I'm looking for getting the file content, from the link.

In small sized files my code works perfectly, but when i tried to fetch a PowerPoint file it crashed.

Instead, I'm getting this error : Error fetching file content: RangeError: Maximum call stack size exceeded.

content.js:

const observer = new MutationObserver((mutations) => {
    mutations.forEach(async (mutation) => {
        let files = [];
        const fileLinks = document.getElementsByClassName("dO");

        if (fileLinks.length !== 0) {
            for (let i = 0; i < fileLinks.length; i++) {
                const obj = {};
        
                let subs = fileLinks[i].querySelectorAll('*');
                obj.filename = subs[0].textContent;
                obj.filetype = obj.filename.slice(obj.filename.lastIndexOf('.') + 1);
                obj.size = subs[1].textContent;
        
                try {
                    const response = await fetch(fileLinks[i].href);
        
                    if (!response.ok) {
                        obj.file_content = '';
                    } else {
                        const fileContent = await response.arrayBuffer();
                        obj.file_content = btoa(String.fromCharCode(...new Uint8Array(fileContent)));
                    }
                } catch (error) {
                    console.error('Error fetching file content:', error);
                    obj.file_content = '';
                }
        
                console.log(obj.file_content);
                files.push(obj);
            }
            data.files = files;
        }