How to get and save images from cache – chrome extension

I would like to be able to download an image that has be cached by chrome to a specified folder using a chrome extension. Currently I am getting the url of the image and passing it to the background.js which then downloads the image. Yet on this specific website (the website this chrome extension is being built around), does not allow you to get the url of the image.

What changes to my code will I need to be able to do this?

(the extension flips to another page, and attempts to download around 50 images per subsection of the site. this site also does not have 1 class for each image, and regularly makes the class name or Id the token of the individual)

popup.js

 const scriptCodeCollect =
  `(function() {
        // collect all images 
    let images = document.querySelectorAll('img');
        let srcArray = Array.from(images).map(function(image) {
            return image.currentSrc;
        });
        chrome.storage.local.get('savedImages', function(result) {
                // remove empty images
                imagestodownload = [];
                for (img of srcArray) {
                    if (img) {
                        img.substring("data:image/".length, img.indexOf(";base64"));
                        console.log(img);   
                    }imagestodownload.push(img);
                };
                result.savedImages = imagestodownload;
                chrome.storage.local.set(result);
                console.log("local collection setting success:"+result.savedImages.length); 
            });
    })();`;

    const scriptCodeDownload =
    `(function() {
      chrome.storage.local.get('savedImages', function(result) {
        let message = {
          "savedImages" : result.savedImages
        };
        chrome.runtime.sendMessage(message, function(){
          console.log("sending success");
        });
        
      });
      })();`;

      function injectTheScript() {
        // Gets all tabs that have the specified properties, or all tabs if no properties are specified (in our case we choose current active tab)
        chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
            // Injects JavaScript code into a page
            chrome.tabs.executeScript(tabs[0].id, {file: "content_script.js"});
        });
    }
    // adding listener to your button in popup window
    document.getElementById('flipbtn').addEventListener('click', injectTheScript);
    


document.getElementById("startbtn").addEventListener("click", function() {
if((url.includes('http://127.0.0.1:5500/example%20test/physics/'))) {
    document.getElementById("success").innerHTML = "<strong><u>In progress<br></u></strong> Currently downloading: <br>" +urlfilename

  
      setInterval(function(){ //Loops download
        
      
        chrome.tabs.query({active: true, lastFocusedWindow: true}, tabs => {
          let urlfilename = tabs[0].url.replace('http://127.0.0.1:5500/example%20test/', '').replace('.html', '').replace('?','');
              document.getElementById("success").innerHTML = "<strong><u>In progress<br></u></strong> Currently downloading: <br>" +urlfilename
          let bknb= tabs[0].url.replace('http://127.0.0.1:5500/example%20test/', '').replace('.html', '').replace('/',' ').replace('?', '').replace(/D/g, '');

        chrome.storage.local.set({'foo': urlfilename, 'bar': bknb}, function() {
          console.log('Settings saved');
          console.log(urlfilename);
        });
        function sleep (time) {
          return new Promise((resolve) => setTimeout(resolve, time));
        }
        

        sleep(5000).then(() => {  //Pauses so URL can write and display correctly
          chrome.tabs.executeScript({code : scriptCodeCollect}); //Collects Image (page is saved as image on the website)
          
          let textCollect = document.getElementById('textCollect');
          chrome.storage.local.get('savedImages', function(result) {
            textCollect.innerHTML = "collected "+ result.savedImages.length + " images"; 
          });
        });
          chrome.tabs.executeScript({code : scriptCodeDownload}); //Downloads Image

          document.getElementById("warning").innerHTML = "test"

          sleep(5000).then(() => { //Waits so image can download fully
              chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
              chrome.tabs.executeScript(tabs[0].id, {file: "content_script.js"}); //Injects Script to flip page
          });
        });
        });
    }, 10000); //Waits 10s and then loops
  

background.js

let downloadsArray= [];
let initialState = {
    'savedImages': downloadsArray
};
chrome.runtime.onInstalled.addListener(function() {
    chrome.declarativeContent.onPageChanged.removeRules(undefined, function() {
        chrome.declarativeContent.onPageChanged.addRules([{
            conditions: [
                new chrome.declarativeContent.PageStateMatcher({
                    css: ['img'],
                    css: ['img[input[type="image"[aspect-ratio[attr(1000)/attr(1419)]]]]'],
                    css: ['id[image]']
                })],
            actions: [ new chrome.declarativeContent.ShowPageAction() ]
        }]);
    });
    chrome.storage.local.set(initialState);
    console.log("initialState set");
});


//chrome.downloads.onChanged.addListener(function() {
    chrome.storage.local.get(['foo', 'bar'], function(items) {
        var urlfilename = items.foo
        console.log(urlfilename)
        var bkpg= items.bar
//  });

    chrome.runtime.onMessage.addListener(
        function(message, callback) {
        console.log("message coming");
        console.log(message);
        let srcArray = message.savedImages;
        var counter = bkpg-1;
        for (let src of srcArray) {
            console.log(src);
            chrome.downloads.download({url:src, filename:urlfilename + ".png"});
        };
    });
    });