[Codespaces] Make it possible to run wasm samples in the browser (#64277)

With these changes, running the following in the Codespace will open the local browser to a page served from the codespace hosting the WASM sample:

```console
cd src/mono/sample/wasm/browser
make
make run-browser
```

* Set EMSDK_PATH in .devcontainer.json

   We provision Emscripten as part of the devcontainer prebuild.

   Set EMSDK_PATH to allow rebuilding the wasm runtime to work without any additional ceremony

* Install dotnet-serve into .dotnet-tools-global

* [wasm] Don't try to open browser if running in Codespaces

* .devcontainer: add global tools dir to PATH

* .devcontainer: forward port 8000

   This enables running the mono wasm samples in the local browser:

* [wasm] samples: also check for dotnet-serve on the path

   On Codespaces we install dotnet-serve on the PATH but not where `dotnet tool list` can see it

* remove onAutoForward: notify - it's the default

* Adjust the path of v8 depends if running in a dev container

* Check if we're running in any Docker container, not just Codespaces

Co-authored-by: Fan Yang <52458914+fanyang-mono@users.noreply.github.com>

diff --git a/.devcontainer/devcontainer.json b/.devcontainer/devcontainer.json
index 41e9c94..d7b5a8b 100644 (file)
--- a/.devcontainer/devcontainer.json
+++ b/.devcontainer/devcontainer.json
@@ -4,7 +4,7 @@
        "name": "C# (.NET)",
        "build": {
                "dockerfile": "Dockerfile",
-               "args": { 
+               "args": {
                        // Update 'VARIANT' to pick a .NET Core version: 2.1, 3.1, 5.0
                        "VARIANT": "5.0",
                }
@@ -32,11 +32,22 @@
 
        // Add the locally installed dotnet to the path to ensure that it is activated
        // This allows developers to just use 'dotnet build' on the command-line, and the local dotnet version will be used.
+       // Add the global tools dir to the PATH so that globally installed tools will work
        "remoteEnv": {
-               "PATH": "${containerWorkspaceFolder}/.dotnet:${containerEnv:PATH}",
-               "DOTNET_MULTILEVEL_LOOKUP": "0"
+               "PATH": "${containerWorkspaceFolder}/.dotnet:${containerWorkspaceFolder}/.dotnet-tools-global:${containerEnv:PATH}",
+               "DOTNET_MULTILEVEL_LOOKUP": "0",
+               // Path to provisioned Emscripten SDK, for rebuilding the wasm runtime
+               "EMSDK_PATH": "${containerWorkspaceFolder}/src/mono/wasm/emsdk",
        },
 
        // Comment out connect as root instead. More info: https://aka.ms/vscode-remote/containers/non-root.
-       "remoteUser": "vscode"
+       "remoteUser": "vscode",
+
+       // Forward mono samples port
+       "forwardPorts": [8000],
+       "portsAttributes": {
+               "8000": {
+                       "label": "mono wasm samples (8000)",
+               }
+       }
 }

diff --git a/.devcontainer/scripts/onCreateCommand.sh b/.devcontainer/scripts/onCreateCommand.sh
index 9a7e671..48850f5 100755 (executable)
--- a/.devcontainer/scripts/onCreateCommand.sh
+++ b/.devcontainer/scripts/onCreateCommand.sh
@@ -12,5 +12,8 @@ make -C src/mono/wasm provision-wasm
 export EMSDK_PATH=$PWD/src/mono/wasm/emsdk
 ./build.sh mono+libs -os Browser -c release
 
+# install dotnet-serve for running wasm samples
+./dotnet.sh tool install dotnet-serve --tool-path ./.dotnet-tools-global
+
 # save the commit hash of the currently built assemblies, so developers know which version was built
 git rev-parse HEAD > ./artifacts/prebuild.sha

diff --git a/.gitignore b/.gitignore
index 6627d2c..a4848da 100644 (file)
--- a/.gitignore
+++ b/.gitignore
@@ -7,6 +7,7 @@ syntax: glob
 #       instead of directories), git will still ignore them.
 .dotnet
 .dotnet-mono
+.dotnet-tools-global
 .packages
 .tools
 

diff --git a/src/mono/sample/wasm/wasm.mk b/src/mono/sample/wasm/wasm.mk
index 89759c3..ea466c3 100644 (file)
--- a/src/mono/sample/wasm/wasm.mk
+++ b/src/mono/sample/wasm/wasm.mk
@@ -10,6 +10,15 @@ CONFIG?=Release
 
 WASM_DEFAULT_BUILD_ARGS?=/p:TargetArchitecture=wasm /p:TargetOS=Browser /p:Configuration=$(CONFIG)
 
+# if we're in a container, don't try to open the browser
+ifneq ("$(wildcard /.dockerenv)", "")
+  OPEN_BROWSER=
+  V8_PATH=v8
+else
+  OPEN_BROWSER=-o
+  V8_PATH=~/.jsvu/v8
+endif
+
 all: publish
 
 build:
@@ -22,15 +31,15 @@ clean:
        rm -rf bin $(TOP)/artifacts/obj/mono/$(PROJECT_NAME:%.csproj=%)
 
 run-browser:
-       if ! $(DOTNET) tool list --global | grep dotnet-serve; then \
+       if ! $(DOTNET) tool list --global | grep dotnet-serve && ! which dotnet-serve ; then \
                echo "The tool dotnet-serve could not be found. Install with: $(DOTNET) tool install --global dotnet-serve"; \
                exit 1; \
        else  \
-               $(DOTNET) serve -d:bin/$(CONFIG)/AppBundle -o -p:8000; \
+               $(DOTNET) serve -d:bin/$(CONFIG)/AppBundle $(OPEN_BROWSER) -p:8000; \
        fi
 
 run-console:
-       cd bin/$(CONFIG)/AppBundle && ~/.jsvu/v8 --stack-trace-limit=1000 --single-threaded --expose_wasm $(MAIN_JS) -- $(DOTNET_MONO_LOG_LEVEL) --run $(CONSOLE_DLL) $(ARGS)
+       cd bin/$(CONFIG)/AppBundle && $(V8_PATH) --stack-trace-limit=1000 --single-threaded --expose_wasm $(MAIN_JS) -- $(DOTNET_MONO_LOG_LEVEL) --run $(CONSOLE_DLL) $(ARGS)
 
 run-console-node:
        cd bin/$(CONFIG)/AppBundle && node --stack-trace-limit=1000 --single-threaded --expose_wasm $(MAIN_JS) -- $(DOTNET_MONO_LOG_LEVEL) --run $(CONSOLE_DLL) $(ARGS)