Chrome or Firefox provide tools for debugging WebAssembly. They decompile “.wasm“ to the text format. Take Chrome for example. If you want to debug the program in implementing an array, expand the wasm node.
Each function uses a node name followed by an index. If you want to set a breakpoint at $main
, click the node with an index 6.
The way to set a breakpoint has no difference from debugging JavaScript. Because the program will run $main
after loading and initializing the module, just refresh the page to start debugging.
You can step into, step out or step over as usual. Notice a Scope section at the right. In Chrome, you can watch memory, local variables, stack values, etc. These are helpful when debugging, especially for checking bytes in memory.
If JavaScript initializes modules or invokes functions defined in modules, you can set breakpoints in JavaScript and step into modules directly.