Haven Protocol Web App
Building Haven Wallet Web Assembly using Docker
The wallet functionality is provided by a C++ library thats compiled to WebAssembly using Emscripten see the index page for an overview of the ecosystem
To build the web assemblies I’m using Docker and I find the latest stable Debian release (v10 at time of writing) has worked well. Alpine may also be a good choice, I had issues using the latest Ubuntu releases (20.04+), some of the libraries seem not to build correctly. Make sure you have plenty of disk space as setting up the build process will eat up 10-20G.
First we’ll build the docker container then go into the environment and build the project (change the naming and tagging for your setup)
The Dockerfile can be found here, copy it into your working directory, then inside the directory with the Dockerfile in,
> docker build -t blueyred/debianhaven:v10 .
This takes around 7 mins to complete for me
[+] Building 392.2s (12/12)
Now we can enter the Docker container environment with the run command
> docker run -ti blueyred/debianhaven:v10 /bin/bash
-ti sets up a command line (-t Allocate a pseudo-TTY and -i Keep STDIN open even if not attached).
You may want to add in –rm to automatically remove the container when it exits which will clean the container back to its original state.
Once inside the container, lets clone the project along with all its sub (and sub sub) modules
> git clone --recursive https://github.com/haven-protocol-org/haven-web-core.git
Next we need to make sure the translation files are built for the main C++ project
> cd haven-web-core/external/haven-web-cpp/external/haven
> mkdir -p build/release
> cd build/release
> cmake ../..
> make obj_common
This will build the translation headers, and should be done in a minute or so. Ensure that the various language files are created and updated.
[ 22%] Performing install step for 'generate_translations_header'
[ 33%] Completed 'generate_translations_header'
[100%] Built target obj_common
now we can copy them into place
> cd ../..
> cp build/release/translations/translation_files.h src/common/translation_files.h
we can now build the web assemblies from the main haven-web-core folder
> cd ../../../..
First we need to modify a few of the build script files. There are a set of build shell scripts. Add a space between the parrallel core option, these files are for a mac environment and we’re in a linux one.
build_openssl_emscripten.sh change emmake make -j${HOST_NCORES} to emmake make -j ${HOST_NCORES}
build_wasm_emscripten.sh change source ../../utils/emsdk/emsdk_env.sh to source ../emsdk/emsdk_env.sh I also comment out the patching of the version as we’re likely doing some development and it causes issues updating the version in the web app everytime you build the assembly, so comment out the version and set it manually, to whatever the version is in the package.json file eg.
#NPM_VERSION=$(npm --no-git-tag-version version)
#NPM_VERSION=$(echo $NPM_VERSION | cut -c 2-)
NPM_VERSION=1.4.60
I also get build errors if I build with multiple cores so emmake cmake --build . -j$HOST_NCORES || exit 1 to emmake cmake --build . || exit 1 then from the main directory run
> bin/build_all.sh
once this has built correctly the first time then you can just run build_wasm_emscripten.sh and build_web_worker.sh as the boost and openssl have already been compiled.
The built files will be in the dist folder, something like HavenWebWorker1.4.60.js haven_offshore1.4.60.js haven_offshore1.4.60.wasm.
For development you’ll want to change the emscripten compilation flags to output debug information, there are some notes on debugging in the emscripten docs Add the EMCC_DEBUG environemtn variable with
export EMCC_DEBUG=1
you could add this into top of the build_wasm_emscripten.sh file to make sure its set.
To change the emscripten compiler flags edit the CMakeLists.txt in the top level directory, you can find the compiler switches around line 265 after EMCC_LINKER_FLAGS_BASE
I update
-s ASSERTIONS=1
-s EXCEPTION_DEBUG=1
-s DEMANGLE_SUPPORT=1
remove --g0 and add
-O2
-s WASM_BIGINT
-gseparate-dwarf
--source-map-base http://localhost:3000/
-gsource-map
-g
Copy files to the host
On your host (not inside the container) find the id for your running docker container with
docker ps
which should output something like
CONTAINER ID IMAGE COMMAND CREATED STATUS PORTS NAMES
4649156c832c blueyred/debianhaven:v10 "/bin/bash" 2 hours ago Up 2 hours objective_snyder
In this example my container id is 4649156c832c, then you need to copy each file individually
> docker cp 4649156c832c:/usr/local/haven-web-core/dist/haven_offshore1.4.50.js ~/Projects/haven-wasm-compiled/