wasm: Fix Webpack compatibility for browser use, update package.json

Updating emsdk to v3.1.27 was necessary for emscripten-core/emscripten#17915,
which allows using the same WASM build for both browser and nodejs envs.

Author: shesek

.github/workflows/wasm-package.yml

@@ -28,7 +28,7 @@ jobs:
       - run: sudo ../../contrib/bullseye_deps.sh
 
       # Build NPM package into a tgz file (pack internally triggers the build/prepare script)
-      - run: npm pack --foreground-scripts
+      - run: npm install && npm pack --foreground-scripts
         name: Build & Pack
 
       # Report the SHA256 digest of the final package. This should be deterministic (including generated WASM),

.gitlab-ci.yml

@@ -1,5 +1,5 @@
 bullseye_release:
-  image: greenaddress/wallycore@sha256:100ff7b90a676f84357f519f2e4ebebff08277c74da711a70340bc58b118b3a0
+  image: greenaddress/wallycore@sha256:8ced27d7281cc9a98301dea544d3f9c64be1c3da013faa0a6c5fd16622f40942
   artifacts:
     expire_in: 1 day
     name: wallycore-bindings
@@ -28,7 +28,7 @@ bullseye_release:
     - gzip -9 wallycore-wasm.tar
 
 manylinux_release:
-  image: greenaddress/wallycore@sha256:100ff7b90a676f84357f519f2e4ebebff08277c74da711a70340bc58b118b3a0
+  image: greenaddress/wallycore@sha256:8ced27d7281cc9a98301dea544d3f9c64be1c3da013faa0a6c5fd16622f40942
   artifacts:
     expire_in: 1 day
     name: wallycore-bindings
@@ -119,7 +119,7 @@ osx_release:
 #    - tools\msvc\wheel.bat
 
 apidocs:
-  image: greenaddress/wallycore@sha256:100ff7b90a676f84357f519f2e4ebebff08277c74da711a70340bc58b118b3a0
+  image: greenaddress/wallycore@sha256:8ced27d7281cc9a98301dea544d3f9c64be1c3da013faa0a6c5fd16622f40942
   artifacts:
     expire_in: 14 days
     name: wallycore-apidocs

contrib/bullseye_deps.sh

@@ -22,8 +22,8 @@ unzip -qq ${NDK_FILENAME}
 rm ${NDK_FILENAME}
 git clone https://github.com/emscripten-core/emsdk
 cd emsdk
-./emsdk install 3.1.20
-./emsdk activate 3.1.20
+./emsdk install 3.1.27
+./emsdk activate 3.1.27
 source ./emsdk_env.sh
 
 apt-get remove --purge curl unzip -yqq

src/wasm_package/.gitignore

@@ -1 +1,2 @@
 libwally_wasm
+node_modules

src/wasm_package/README.md

@@ -11,6 +11,8 @@ $ npm install wallycore
 
 ## Example use
 
+With ES modules:
+
 ```js
 import wally from 'wallycore'
 
@@ -25,5 +27,18 @@ wally.tx_free(tx)
 
 If you're using CommonJS, the module can be loaded asynchronously using `const wally = await import('wallycore')` or `import('wallycore').then(wally => { ... })`.
 
+For browser use, you may use a bundler like [webpack](https://webpack.js.org/),
+or use the pre-bundled [`wallycore.bundle.js`](wallycore.bundle.js) file which exposes a global `WallyInit` promise that resolves to the module. For example:
+
+```html
+<script src="wallycore/wallycore.bundle.min.js"></script>
+<script>
+WallyInit.then(wally => {
+    console.log(wally.bip39_get_word(null, 10))
+})
+// or `const wally = await WallyInit`
+</script>
+```
+
 ## License
 [BSD/MIT](https://github.com/ElementsProject/libwally-core/blob/master/LICENSE)

src/wasm_package/browser/assert.js

@@ -0,0 +1,7 @@
+// Minimal shim for nodejs's assert module, for the browser
+// For some reason, this doesn't work with the https://github.com/browserify/commonjs-assert shim,
+// which causes the webpack bundle to hang when attempting to import it.
+
+export default function assert(val, err='assertion failed') {
+    if (!val) throw err
+}

src/wasm_package/build.sh

@@ -10,5 +10,7 @@ set -xeo pipefail
 # Build WASM (Elements is always enabled)
 (cd ../.. && ./tools/build_wasm.sh --enable-elements)
 mkdir -p libwally_wasm && cp ../../wally_dist/wallycore.{js,wasm} libwally_wasm/
-# Rename to force commonjs mode. See https://github.com/emscripten-core/emscripten/pull/17451
-mv libwally_wasm/wallycore.js libwally_wasm/wallycore.cjs
+touch libwally_wasm/index # necessary for webpack to work (fixes "Can't resolve './' in 'wasm_package/libwally_wasm'")
+
+# Build browser bundle (to dist/wallycore.bundle.js, see webpack.config.js)
+webpack --mode production

src/wasm_package/core.js

@@ -1,5 +1,5 @@
 import assert from 'assert'
-import InitWallyModule from './libwally_wasm/wallycore.cjs'
+import InitWallyModule from './libwally_wasm/wallycore.js'
 import { WALLY_OK, WALLY_ERROR, WALLY_EINVAL, WALLY_ENOMEM } from './const.js'
 
 // Initialize the underlying WASM module and expose it publicly