When writing WebAssembly, one of the issues we hit is with debugging workflows. We can actually get this raw WebAssembly format in the browser console and step through it, but it's often not very useful for finding a problem.
We're going to just define that signature. When we build our WebAssembly, we'll see that this function is automatically treated as an external and it becomes available as an input within our module. It's importing console.log from a module called environment.
This is just a default module namespace name for the externals of a C code compilation process. In our instantiation code here, we've got this wasm import object going into the instance creation. I'm going to change this to be a direct object literal and set that environment value to contain a console.log.
Normally, we'd set this to the console.log function, but because I'm in WasmFiddle, I want to use the WasmFiddle log function, which is just called log. We can now execute this code, and we can see the input value logged before we log the output value.
The optional second argument to this helper is the imports object. This is where we can set that environment module. I'm going to set the console.log function of the environment module, this time just to be the direct console.log function in the browser. The promise we get back for this fetchAndInstantiate call is our executed WebAssembly module with the exports available on the objects.
I can now call the get_square_root function directly with any input value. If I log the output as well, we should see both the input and the output being logged in the browser.