How to pause on code of inline script tag?

Question

Unless there's a bug, Chrome devtools does not seem to want to pause on code within <script> tags for me. Hoping I didn't miss something.

Try this page: https://threejs.org/docs/scenes/material-browser.html#MeshPhysicalMaterial

Then in the HTML payload, in the inline script code, try putting a debugger in devtools.

For me, it never pauses.

For example, there is a line that starts with function guiMeshPhysicalMaterial, on which I put a debugger:

When I hit refresh, the script never pauses there.

Have I missed something? Or should I open a bug in Chrome's tracker?

Knotts

Does this answer your question? Chrome javascript debugger breakpoints don't do anything? – Teazel

@Teazel it doesn't seem to. – Knotts

function declaration is not a statement - due to hoisting - so you can't stop on it. – Walkover

You did not miss anything. It is a bug in Chrome. I created a bug report for this crbug.com/1342111 – Eyrir

@Walkover It doesn't pause on any line at all. Plus normally Chrome DevTools automatically puts the debugger (after clicking) at the next pausable line. – Knotts

@Teazel That does not answer the question, while this thread includes a link to a more useful Chrome bug report. Perhaps the other one should be closed in favor of this one instead, and this one should be closed too. – Knotts

I voted to close because it turned out to be a Chrome bug, and the link to the bug report is here in the question's comments. – Knotts

Answer 1

Here is what helped me (running latest Chrome 121.0.. in 2024). Once you provide the name of your script the debugger is able to show it as a separate file and breakpoints start to work.

<script>
    //# sourceURL=name_this_script.js
    ...
</script>

Mettlesome