Utilities for debugging Sema

[frantic0]

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

microsoft/vscode#52763

sveltejs/sapper-legacy.svelte.dev#37

[frantic0]

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

[frantic0]

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

[smilo7]

I am moving this to the wiki as I think its more suited there. https://github.com/mimic-sussex/sema/wiki/Debugging-Sema

but will leave it pinned for the moment as it might be useful for people