Debugging Sema

Here are some recommended utilities you may use to debug sema.

VS Code's built-in debugger configuration (launch.json)

If you want to use the handy VS Code's built-in debugger with Sema (breakpoints, inspection)

"debug.allowBreakpointsEverywhere": true to the VS Code global settings.json

and here's the config for the debuggers {} launch.json

{ // Use IntelliSense to learn about possible attributes. // Hover to view descriptions of existing attributes. // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 "version": "0.2.0", "configurations": [ { "type": "chrome", "request": "launch", "name": "Launch Chrome against localhost", "url": "http://localhost:8080", "webRoot": "${workspaceFolder}/" } ] }

these will fix the "Breakpoint set but not yet bound" on the Svelte components hierarchy

https://github.com/Microsoft/vscode/issues/52763

https://github.com/sveltejs/sapper-legacy.svelte.dev/issues/37

svelte-devtools

Chrome extension for the Svelte javascript framework. It allows you to inspect the Svelte state and component hierarchies in the Chrome Developer Tools.

https://chrome.google.com/webstore/detail/svelte-devtools

Install this on the Chrome instance spawned by the VS Code debugger

web-audio-inspector

Chrome extension adds a panel to Chrome Developer Tools that for inspecting the live web audio graph of a web page.

There is a shortcoming though there is no wrapper for AudioWorklet node wrappers.

https://chrome.google.com/webstore/detail/web-audio-inspector

Install this on the Chrome instance spawned by the VS Code debugger