How to add breakpoints to local override JS web inspector

I'm on Safari 14.0.2 (16610.3.7.1.9) (with the latest Safari Technology Preview Release 118) and have just started using the web inspector to debug JS on my website. I have locally overridden mywebsite JS file with a locally edited version.

I have run my global code with breakpoints. However I am struggling to work out how to put breakpoints on the local version as well as getting the local code to be executed. It seems there must be a switch (or a step) from the global to the local version which I have missed.

Could anyone guide me as to how to get my local code engaged firstly & secondly, with break points?

It's currently not possible to set breakpoints inside the local override view itself, but you should be able to set breakpoints in the resource it overrides.

As far as the local override not replacing any resources, I'd double check to make sure that the URL of the local override isn't configured to something very specific (e.g. it may include a query parameter of the timestamp that it was requested which won't match future requests). Also make sure that the checkbox next to the local override in the navigation sidebar is checked, as otherwise it's is considered disabled and will not have any effect.

If you're still encountering issues after reading the above, please file a bug at feedbackassistant.apple.com :)
Thanks for coming back to me anonymous Developer Tools Engineer.

I can confirm the check box was checked for the local override. Thanks for confirming breakpoints cannot be used on the local override.

I am currently working on Google Chrome as i I couldn't waste any more time on Safari and ,more importantly, it seems to have far superior documentation. I could go back and give Safari another go if I could get documentation to the standard that Chrome Devtools produce as I feel this is the issue rather than it being a technical fault.

This is the quality of documentation I am referring to is at developers.google.com/web/tools/chrome-devtools/workspaces/?utm_source=devtools

If there is any precise atomic documentation like the example above rather than the more superficial safari documentation I have been using could you please reply with the link. (I have been referencing this https://webkit.org/web-inspector/local-overrides.)

If you still think I need to file a bug then could you confirm this?

Thank You :-)

I searched for the keyword "safari local override breakpoint" and found this thread, so I thought I would comment. Apologies if this isn't relevant.

I am using the OS language setting to Japanese. When I tried to override the JavaScript directly in the inspector, the MIME type of the JavaScript file changed to text/plain, and it failed to load. As a result, the breakpoints specified for the overridden resource were not working. However, if I save the override as a file and then import it, it works fine.

When I changed the OS language setting to English, everything loaded without problems, and the breakpoints worked.

It's still not possible to set breakpoints inside the local override view itself.

How to add breakpoints to local override JS web inspector
 
 
Q