How to access internal functions of a website’s bundled JavaScript from a Tampermonkey userscript without using DevTools breakpoints?

1 day ago 1
ARTICLE AD BOX

I’m writing a Tampermonkey userscript for "https://wplace.live".

The site renders a world map on an HTML <canvas>. I want to overlay an image that stays aligned with the map while the user pans and zooms.

The problem is that the <canvas> element itself does not move in the DOM when the user pans the map, so I cannot determine the current map position directly from DOM changes.

While debugging in DevTools, I found an internal function inside one of the site’s bundled JavaScript files that places a marker on the map. That marker correctly stays attached to map coordinates during pan/zoom.

When I set a breakpoint inside that function (inside class zv, method place), I can access some internal variables. From the console at that breakpoint, I can expose a helper to window:

window.PlaceMarker = (x, y) => { H.setLngLat({ lat: y / 10000, lng: x / 10000 }).addTo(T); };

After doing this once, I can call PlaceMarker(0, 0) from my userscript and it works correctly.

However, this currently requires the user to:

Open DevTools

Set a breakpoint

Wait for execution to pause

Manually define the function in the console

I want to avoid this entirely.

Question:

From a Tampermonkey userscript, is it possible to programmatically access or hook into internal variables/functions of a site’s bundled JavaScript (that are not exposed on window) without using manual breakpoints?

I’m looking for a general approach (e.g., script interception, monkey-patching, overriding constructors, etc.) that works in this situation.

In the source file of interest, I noticed this type of line this.markers.set(k, theVariableINeed) so from here I should be able to achieve what I need by overriding the set function. Even though this might work, it's a very specific solution and I would still like to know some more general approach to this problem.

Read Entire Article