I am writing a browser extension that needs to get some info from an existing site. The site is exposed to me in the Chrome inspector as a collection of JavaScript files under the Sources tab. Fortuitously, all the info I need is logged via console.log from this existing website. Less fortuitously, I do not know of a way to "hot load" in hooks to these source files and though I can see the data in the console, I can't directly get the data in my extension where I can process it.

The answer to this question about accessing the console output does work to replace console.log within the file scope of my Main.js for my extension and causes a "console.logs" array to be built. But any console.log events occurring in the site's js files still appear to be default - I've tried a few permutations but they appear to just be vanilla log with no extra data capturing possible.

I assume my problem is one of scope. So, how could I inject this console.log replacement into a higher scope such that the site's js files also are affected? Failing this, is there another way to hook into this console data, or "hot swap" the site's source files with my own (e.g. replace the text of the JS files by regex prior to execution? I doubt it...)