maplibre-gl-js
maplibre-gl-js copied to clipboard
Worker created from blob URL does not have source map support
maplibre-gl-js version: 3.6.2
I recently noticed while trying to debug something in the web worker code that it doesn't have source map support. This means:
- Only minified code is available for breakpoints, etc.
- Since a refresh causes a new blob URL, breakpoints are lost.
Presumably this is because of the way the blob is created. I'd rather not have to switch to the CSP version. Has anyone looked into getting source map support working with workers created from the blob URL? Would such a thing even be possible?
I'll be surprised if there is another way besides CSP...
One thought I had is to add a source map comment to the worker blob that points to an external source map file. Not sure if that's doable, but I might tinker with it to see what I can accomplish.
What about inlining the sourcemap?
Wouldn't that result in a significant hit to the bundle size? For the external file though, I'm not sure how that would get picked up by whatever is consuming the library if using a bundler.
Yes, but if you want to debug something, this might help...? IDK, I'm missing a more detailed problem statement I guess...
That's fair. I'll try to shed some more light on what I ran into.
We have a web application that uses MapLibre to display vector tile data. However, some of that vector tile data is something that we serve up on request; tiles are not pre-generated. The server that generates the vector tiles is our own code. I was trying to debug in the MapLibre worker code so that I could see what that vector tile data looked like to MapLibre after it was downloaded and parsed. It was very difficult to do this without any source map support.
We are using the non-CSP version for a variety of reasons, not the least of which is that we have a reusable Angular map component (similar to ngx-maplibre-gl) that is used by more than just this application.
It would be very nice to be able to debug through the worker code with MapLibre out-of-the-box.
Why not use curl or some other code to see what you got, even parse it using vector tile js...?
I was trying to see not just the data, but also how MapLibre was processing it. It was very difficult to do this without source map support. Other infrastructure (mostly auth, but a couple other things too) that is in place made it a non-starter to simply stand up a CSP version of MapLibre. I was able to pick through the minified code, so all was not lost. Still, I think it would be great to get source maps working, if it's possible. I will be happy to spend some time looking at this when I can!
Feel free to dig into it! 😀