I’ve been doing some experiments recently that led me to prototype an external debugger frontend that controls Brython execution from JavaScript (With the help of Cursor and some free time for vibe-coding).
The idea is to have a generator-function based debugging backend in Brython which can be driven entirely from JS:
A diff of a prototype implementation is attached.
external_debugger.patch
It expose a small JS API like:
__BRYTHON__.pause()
__BRYTHON__.continue()
__BRYTHON__.step()
__BRYTHON__.setBreakpoint(module_id, line_no)
__BRYTHON__.debug_status()
- Preserve state (locals, control flow, stack) across pauses via the generator.
<html>
<head>
<meta charset="utf-8">
<script type="text/javascript" src="brython.js"> </script>
<script type="text/javascript" src="brython_stdlib.js"> </script>
</head>
<body>
<pre>
<script type="text/javascript">
__BRYTHON__.pause();
__BRYTHON__.runPythonSource(`
from browser import document, console
console.log("continue1");
console.log("continue2");
console.log("continue3");
console.log("continue4");
console.log("continue5");
console.log("continue6");
console.log("continue7");
console.log("continue8");
console.log("continue9");
console.log("continue10");
`);
console.log("pause before execution", __BRYTHON__.debug_status());
__BRYTHON__.setBreakpoint(__BRYTHON__.debug_status().module_id, 5);
__BRYTHON__.continue();
console.log("paused after breakpoint reached", __BRYTHON__.debug_status());
__BRYTHON__.step()
console.log("pause after step", __BRYTHON__.debug_status());
__BRYTHON__.continue();
console.log("done", __BRYTHON__.debug_status());
</script>
</body>
</html>
Actual browser console output of the above:
test.html:27 pause before execution {status: 'paused', module_id: 'python_script_741023741735828', line_no: 2}
brython.js:11057 continue1
brython.js:11057 continue2
test.html:30 paused after breakpoint reached {status: 'paused', module_id: 'python_script_741023741735828', line_no: 5}
brython.js:11057 continue3
test.html:32 pause after step {status: 'paused', module_id: 'python_script_741023741735828', line_no: 6}
brython.js:11057 continue4
brython.js:11057 continue5
brython.js:11057 continue6
brython.js:11057 continue7
brython.js:11057 continue8
brython.js:11057 continue9
brython.js:11057 continue10
test.html:34 done {status: 'idle', module_id: 'python_script_741023741735828', line_no: 12}
Correct me if I'm wrong but I don't think that such functionality is achievable using Pdb.
I guess an extensive change as such might break a lot of stuff in Brython but I have a feeling it might become very useful for online Brython IDEs.
I’ve been doing some experiments recently that led me to prototype an external debugger frontend that controls Brython execution from JavaScript (With the help of Cursor and some free time for vibe-coding).
The idea is to have a generator-function based debugging backend in Brython which can be driven entirely from JS:
A diff of a prototype implementation is attached.
external_debugger.patch
It expose a small JS API like:
__BRYTHON__.pause()__BRYTHON__.continue()__BRYTHON__.step()__BRYTHON__.setBreakpoint(module_id, line_no)__BRYTHON__.debug_status()Actual browser console output of the above:
Correct me if I'm wrong but I don't think that such functionality is achievable using Pdb.
I guess an extensive change as such might break a lot of stuff in Brython but I have a feeling it might become very useful for online Brython IDEs.