So I've kind of run into a brick wall with my attempts to get our source maps to make JS debuggers display original AS3 field/property names instead of the modified JS names. There doesn't seem to be any real documentation about exactly how web browser devtools (or other debuggers, like VSCode) use the name mappings from source maps. Other parts of source maps are better documented than name mappings, if still a little sparse. I was able to get some local variables renamed in my experiments, but never members of classes. I'm kind of starting to suspect that browsers/debuggers ignore the name mappings for anything more complex than locals.
That being said, it's possible that the structure of our generated JS is a little wonky due to the use of Closure library for classes/inheritance. I may experiment a bit more with hand-written code to see if I can do more. It's possible that I can tweak our generated JS to conform more closely to something that ends up working better with name mappings. The one thing that I successfully implemented was a feature that is Chrome-only, called "Friendly Call Frames": https://developer.chrome.com/blog/devtools-modern-web-debugging#friendly_call_frames In short, when using Chrome's devtools debugger, when stopped at a breakpoint, you can use specifically-positioned name mappings to modify the call stack view to show the original AS3 names. royale-compiler commit here: https://github.com/apache/royale-compiler/commit/0ea4001e55ebe1930de4c52b1669e7d96f13b112 Unfortunately, VSCode's debugger does not support Friendly Call Frames, and I don't think other browsers do either (except maybe ones that are Chrome forks). However, I opened a feature request for VSCode's debugger, and the developer seemed open to supporting it. https://github.com/microsoft/vscode-js-debug/issues/2054 -- Josh Tynjala Bowler Hat LLC <https://bowlerhat.dev> On Mon, Jul 22, 2024 at 12:24 PM Harbs <harbs.li...@gmail.com> wrote: > > I can look into adding name mapping to our debug build source maps. > > That would be amazing! > > > On Jul 22, 2024, at 6:17 PM, Josh Tynjala <joshtynj...@bowlerhat.dev> > wrote: > > > > As I recall, the main thing that I focused on when implementing source > maps > > was ensuring that breakpoints worked properly. It is possible that the > > Royale compiler renames some things, and we don't map the original AS3 > > names to the generated JS names yet. (Generally, we try to keep the same > > variable names in JS, but I recall that there are some special cases > where > > we rename). That's for debug builds. However, for release builds, source > > maps are generated by Closure Compiler. I don't think that we have a lot > of > > control over how Closure Compiler generates source maps (nor could we > take > > over for it, since we wouldn't know the new names it generates for > > variables and things). > > > > I can look into adding name mapping to our debug build source maps. > > > > -- > > Josh Tynjala > > Bowler Hat LLC <https://bowlerhat.dev> > > > > > > On Sun, Jul 21, 2024 at 6:24 AM Gabe Harbs <harbs.li...@gmail.com> > wrote: > > > >> I’ve never really tried debugging with source-maps enabled. I figured > I’d > >> give it a try and while cool, it doesn’t feel so useful because > identifiers > >> are not mapped to qualified names. > >> > >> That includes qualified names of classes and functions and even simple > >> things like instance variables not being mapped to “this”. > >> > >> Is there any way around this limitation? What do other frameworks do? > >> > >> Harbs > >
