Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

add one way to run wasm module in chrome #148

Merged
merged 6 commits into from
Mar 5, 2024
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -286,18 +286,20 @@ const importObject = {
}
},
env: {
console_log: (obj) => {
Console_log: (obj) => {
/** TODO: cant log reference type variable */
console.log(obj);
},
console_constructor: (obj) => {},
Console_constructor: (obj) => {},
strcmp(a, b) {
let lhs = cstringToJsString(a);
let rhs = cstringToJsString(b);
return lhs.localeCompare(rhs);
},
setTimeout: (obj) => {},
clearTimeout: (obj) => {},
malloc: (size)=>{},
free: (size)=>{},

array_push_generic: (ctx, obj, elem) => {},
array_pop_f64: (ctx, obj) => {},
Expand Down Expand Up @@ -367,4 +369,22 @@ const importObject = {
},
};

export { importObject, setWasmMemory };
if (typeof window === 'undefined') {
module.exports = {
importObject: importObject,
setWasmMemory: setWasmMemory
};
}

function run_wasm_module(wasmFilePath, wasmFuncName, ...funcArgs) {
fetch(wasmFilePath)
.then((response) => response.arrayBuffer())
.then((bytes) => WebAssembly.instantiate(bytes, importObject))
.then((results) => {
const exports = results.instance.exports;
const exportedFunc = exports[wasmFuncName];
const res = exportedFunc(...funcArgs);
const resultElement = document.getElementById('result');
resultElement.innerHTML = `The result is: ${res}`;
});
}
45 changes: 45 additions & 0 deletions tools/validate/run_module_on_v8/run_module_on_chrome.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
<!--
Copyright (C) 2023 Intel Corporation. All rights reserved.
SPDX-License-Identifier: Apache-2.0 WITH LLVM-exception
-->

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>run wasm module</title>
</head>
<body>
<form id="processForm">
<table>
<tr>
<td><label for="pathInput">path:</label></td>
<td><input type="text" id="pathInput" required></td>
</tr>
<tr>
<td><label for="funcNameInput">function name:</label></td>
<td><input type="text" id="funcNameInput" required></td>
</tr>
<tr>
<td><label for="argsInput">arguments:</label></td>
<td><input type="text" id="argsInput"></td>
</tr>
</table>
<button type="submit">submit</button>
</form>

<script src="import_object.cjs"></script>
<script>
document.getElementById("processForm").addEventListener("submit", function(event) {
event.preventDefault();

var path = document.getElementById("pathInput").value;
var funcName = document.getElementById("funcNameInput").value;
var args = document.getElementById("argsInput").value.split(",");

run_wasm_module(path, funcName, ...args);
});
</script>
<p id="result"></p>
</body>
</html>
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,9 @@
* SPDX-License-Identifier: Apache-2.0 WITH LLVM-exception
*/

import fs from 'fs';
import minimist from 'minimist';
import { importObject, setWasmMemory } from './import_object.js';
const fs = require('fs');
const minimist = require('minimist');
const { importObject, setWasmMemory } = require('./import_object.cjs');

function showHelp() {
console.log(`Options:
Expand Down
Original file line number Diff line number Diff line change
@@ -1,12 +1,14 @@
# Run generated WASM module on Node.js
# Run generated WASM module on v8

yviansu marked this conversation as resolved.
Show resolved Hide resolved
This document describes how to execute WASM module on Node.js.
This document describes how to execute WASM module on v8, including on node.js and on chrome.

> Note: Wasmnizer-ts follows the latest WasmGC spec, which requires `V8 v11.9+`, but the latest nodejs (v21.5.0) is using `V8 11.8.172.17`, so currently the generated WASM module can't execute on any nodejs releases.

> If you do want to try on nodejs, you can reset to commit `94cf9929421d47a9976fa6edf74b25ef2a00ee12` to build the compiler, which is compatible to older V8 versions.

## Prerequisites
## Run module on node

### Prerequisites
- node.js version 20.0.0 or higher

to enable support for `stringref` feature, node.js version 20.0 or higher is necessary.
Expand All @@ -16,7 +18,7 @@ This document describes how to execute WASM module on Node.js.
- `--experimental-wasm-gc`: This flag is required to enable support for the WASM GC feature.
- `--experimental-wasm-stringref`: This flag is needed to enable support for the `stringref` feature.

## How to Run
### How to Run

To run your WebAssembly file, use the following command:

Expand All @@ -31,7 +33,7 @@ This document describes how to execute WASM module on Node.js.
- `-f`: specify the exported WASM function you want to execute in Node.js.
- `-s`: specify to execute the `_start` WASM function to initialize global variables if necessary.

## Example
### Example

Here is an example.

Expand All @@ -52,3 +54,14 @@ This document describes how to execute WASM module on Node.js.
```

it will output `1`.

## Run module on chrome

### Prerequisites
- Set chrome flags by `chrome://flags`, should set these flags as enabled:
- Experimental WebAssembly
- WebAssembly Garbage Collection
- WebAssembly Stringref

### How to Run
Start a server, open the `run_module_on_chrome.html` on chrome, fill in with the wasm path, the wasm function name, and arguments(must be separated by commas), then click `submit` button, and the result will be print on the page.
Loading