UPDATE: Adds Web browser wasm bindings (#30)

* UPDATE: Adds Web browser wasm bindings

* FIX: install wasm-pack in the GitHub actions

bindings/wasm/.gitignore

@@ -0,0 +1 @@
+target/*

bindings/wasm/Cargo.toml

@@ -0,0 +1,23 @@
+[package]
+name = "wasm"
+version = "0.1.3"
+authors = ["Nicolas Hatcher <nicolas@theuniverse.today>"]
+description = "IronCalc Web bindings"
+license = "MIT/Apache-2.0"
+repository = "https://github.com/ironcalc/web-bindings"
+edition = "2021"
+
+[lib]
+crate-type = ["cdylib"]
+
+[dependencies]
+# Uses `../ironcalc/base` when used locally, and uses
+# the inicated version from crates.io when published.
+# https://doc.rust-lang.org/cargo/reference/specifying-dependencies.html#multiple-locations
+ironcalc_base = { path = "../../base", version = "0.1" }
+serde = { version = "1.0", features = ["derive"] }
+wasm-bindgen = "0.2.92"
+serde-wasm-bindgen = "0.4"
+
+[dev-dependencies]
+wasm-bindgen-test = "0.3.38"

bindings/wasm/Makefile

@@ -0,0 +1,14 @@
+all:
+	wasm-pack build --target web --scope ironcalc
+	cp README.pkg.md pkg/README.md
+
+lint:
+	cargo check
+	cargo fmt -- --check
+	cargo clippy --all-targets --all-features -- -D warnings
+
+clean:
+	cargo clean
+	rm -rf pkg
+
+.PHONY: all web lint

bindings/wasm/README.md

@@ -0,0 +1,31 @@
+# IronCalc Web bindings
+
+This crate is used to build the web bindings for IronCalc.
+Note that it does not contain the xlsx writer and reader, only the engine.
+
+https://www.npmjs.com/package/@ironcalc/wasm?activeTab=readme
+
+## Building
+
+```bash
+make
+```
+
+## Testing
+
+Right now this is a manual process and only carries out a smoke test:
+
+1. Build the package
+2. Run `python -m http.server`
+3. In your browser open <http://0.0.0.0:8000/test.html>
+
+## Publishing
+
+Follow the commands:
+
+```bash
+wasm-pack login
+make
+cd pkg
+npm publish --access=public
+```

bindings/wasm/README.pkg.md

@@ -0,0 +1,33 @@
+# IronCalc Web bindings
+
+This package contains web bindings for IronCalc. Note that it does not contain the xlsx writer and reader, only the engine.
+
+
+## Usage
+
+In your project
+
+```
+npm install @ironcalc/wasm
+```
+
+And then in your TypeScript
+
+```TypeScript
+import init, { Model } from "@ironcalc/wasm";
+
+await init();
+
+function compute() {
+    const model = new Model('en', 'UTC');
+    
+    model.setUserInput(0, 1, 1, "23");
+    model.setUserInput(0, 1, 2, "=A1*3+1");
+    
+    const result = model.getFormattedCellValue(0, 1, 2);
+    
+    console.log("Result: ", result);
+}
+
+compute();
+```

bindings/wasm/src/lib.rs

@@ -0,0 +1,254 @@
+use wasm_bindgen::{
+    prelude::{wasm_bindgen, JsError},
+    JsValue,
+};
+
+use ironcalc_base::{expressions::types::Area, UserModel as BaseModel};
+
+fn to_js_error(error: String) -> JsError {
+    JsError::new(&error.to_string())
+}
+#[wasm_bindgen]
+pub struct Model {
+    model: BaseModel,
+}
+
+#[wasm_bindgen]
+impl Model {
+    #[wasm_bindgen(constructor)]
+    pub fn new(locale: &str, timezone: &str) -> Result<Model, JsError> {
+        let model = BaseModel::new_empty("workbook", locale, timezone).map_err(to_js_error)?;
+        Ok(Model { model })
+    }
+
+    pub fn undo(&mut self) -> Result<(), JsError> {
+        self.model.undo().map_err(to_js_error)
+    }
+
+    pub fn redo(&mut self) -> Result<(), JsError> {
+        self.model.redo().map_err(to_js_error)
+    }
+
+    #[wasm_bindgen(js_name = "canUndo")]
+    pub fn can_undo(&self) -> bool {
+        self.model.can_undo()
+    }
+
+    #[wasm_bindgen(js_name = "canRedo")]
+    pub fn can_redo(&self) -> bool {
+        self.model.can_redo()
+    }
+
+    #[wasm_bindgen(js_name = "pauseEvaluation")]
+    pub fn pause_evaluation(&mut self) {
+        self.model.pause_evaluation()
+    }
+
+    #[wasm_bindgen(js_name = "resumeEvaluation")]
+    pub fn resume_evaluation(&mut self) {
+        self.model.resume_evaluation()
+    }
+
+    pub fn evaluate(&mut self) {
+        self.model.evaluate();
+    }
+
+    #[wasm_bindgen(js_name = "flushSendQueue")]
+    pub fn flush_send_queue(&mut self) -> String {
+        self.model.flush_send_queue()
+    }
+
+    #[wasm_bindgen(js_name = "applyExternalDiffs")]
+    pub fn apply_external_diffs(&mut self, diffs: &str) -> Result<(), JsError> {
+        self.model.apply_external_diffs(diffs).map_err(to_js_error)
+    }
+
+    #[wasm_bindgen(js_name = "getCellContent")]
+    pub fn get_cell_content(&self, sheet: u32, row: i32, column: i32) -> Result<String, JsError> {
+        self.model
+            .get_cell_content(sheet, row, column)
+            .map_err(to_js_error)
+    }
+
+    #[wasm_bindgen(js_name = "newSheet")]
+    pub fn new_sheet(&mut self) {
+        self.model.new_sheet()
+    }
+
+    #[wasm_bindgen(js_name = "deleteSheet")]
+    pub fn delete_sheet(&mut self, sheet: u32) -> Result<(), JsError> {
+        self.model.delete_sheet(sheet).map_err(to_js_error)
+    }
+
+    #[wasm_bindgen(js_name = "renameSheet")]
+    pub fn rename_sheet(&mut self, sheet: u32, name: &str) -> Result<(), JsError> {
+        self.model.rename_sheet(sheet, name).map_err(to_js_error)
+    }
+
+    #[wasm_bindgen(js_name = "rangeClearAll")]
+    pub fn range_clear_all(
+        &mut self,
+        sheet: u32,
+        start_row: i32,
+        start_column: i32,
+        end_row: i32,
+        end_column: i32,
+    ) -> Result<(), JsError> {
+        let range = Area {
+            sheet,
+            row: start_row,
+            column: start_column,
+            width: end_column - start_column + 1,
+            height: end_row - start_row + 1,
+        };
+        self.model.range_clear_all(&range).map_err(to_js_error)
+    }
+
+    #[wasm_bindgen(js_name = "rangeClearContents")]
+    pub fn range_clear_contents(
+        &mut self,
+        sheet: u32,
+        start_row: i32,
+        start_column: i32,
+        end_row: i32,
+        end_column: i32,
+    ) -> Result<(), JsError> {
+        let range = Area {
+            sheet,
+            row: start_row,
+            column: start_column,
+            width: end_column - start_column + 1,
+            height: end_row - start_row + 1,
+        };
+        self.model.range_clear_contents(&range).map_err(to_js_error)
+    }
+
+    #[wasm_bindgen(js_name = "insertRow")]
+    pub fn insert_row(&mut self, sheet: u32, row: i32) -> Result<(), JsError> {
+        self.model.insert_row(sheet, row).map_err(to_js_error)
+    }
+
+    #[wasm_bindgen(js_name = "insertColumn")]
+    pub fn insert_column(&mut self, sheet: u32, column: i32) -> Result<(), JsError> {
+        self.model.insert_column(sheet, column).map_err(to_js_error)
+    }
+
+    #[wasm_bindgen(js_name = "deleteRow")]
+    pub fn delete_row(&mut self, sheet: u32, row: i32) -> Result<(), JsError> {
+        self.model.delete_row(sheet, row).map_err(to_js_error)
+    }
+
+    #[wasm_bindgen(js_name = "deleteColumn")]
+    pub fn delete_column(&mut self, sheet: u32, column: i32) -> Result<(), JsError> {
+        self.model.delete_column(sheet, column).map_err(to_js_error)
+    }
+
+    #[wasm_bindgen(js_name = "setRowHeight")]
+    pub fn set_row_height(&mut self, sheet: u32, row: i32, height: f64) -> Result<(), JsError> {
+        self.model
+            .set_row_height(sheet, row, height)
+            .map_err(to_js_error)
+    }
+
+    #[wasm_bindgen(js_name = "setColumnWidth")]
+    pub fn set_column_width(&mut self, sheet: u32, column: i32, width: f64) -> Result<(), JsError> {
+        self.model
+            .set_column_width(sheet, column, width)
+            .map_err(to_js_error)
+    }
+
+    #[wasm_bindgen(js_name = "getRowHeight")]
+    pub fn get_row_height(&mut self, sheet: u32, row: i32) -> Result<f64, JsError> {
+        self.model.get_row_height(sheet, row).map_err(to_js_error)
+    }
+
+    #[wasm_bindgen(js_name = "getColumnWidth")]
+    pub fn get_column_width(&mut self, sheet: u32, column: i32) -> Result<f64, JsError> {
+        self.model
+            .get_column_width(sheet, column)
+            .map_err(to_js_error)
+    }
+
+    #[wasm_bindgen(js_name = "setUserInput")]
+    pub fn set_user_input(
+        &mut self,
+        sheet: u32,
+        row: i32,
+        column: i32,
+        input: &str,
+    ) -> Result<(), JsError> {
+        self.model
+            .set_user_input(sheet, row, column, input)
+            .map_err(to_js_error)
+    }
+
+    #[wasm_bindgen(js_name = "getFormattedCellValue")]
+    pub fn get_formatted_cell_value(
+        &self,
+        sheet: u32,
+        row: i32,
+        column: i32,
+    ) -> Result<String, JsError> {
+        self.model
+            .get_formatted_cell_value(sheet, row, column)
+            .map_err(to_js_error)
+    }
+
+    #[wasm_bindgen(js_name = "getFrozenRowsCount")]
+    pub fn get_frozen_rows_count(&self, sheet: u32) -> Result<i32, JsError> {
+        self.model.get_frozen_rows_count(sheet).map_err(to_js_error)
+    }
+
+    #[wasm_bindgen(js_name = "getFrozenColumnsCount")]
+    pub fn get_frozen_columns_count(&self, sheet: u32) -> Result<i32, JsError> {
+        self.model
+            .get_frozen_columns_count(sheet)
+            .map_err(to_js_error)
+    }
+
+    #[wasm_bindgen(js_name = "setFrozenRowsCount")]
+    pub fn set_frozen_rows_count(&mut self, sheet: u32, count: i32) -> Result<(), JsError> {
+        self.model
+            .set_frozen_rows_count(sheet, count)
+            .map_err(to_js_error)
+    }
+
+    #[wasm_bindgen(js_name = "setFrozenColumnsCount")]
+    pub fn set_frozen_columns_count(&mut self, sheet: u32, count: i32) -> Result<(), JsError> {
+        self.model
+            .set_frozen_columns_count(sheet, count)
+            .map_err(to_js_error)
+    }
+
+    #[wasm_bindgen(js_name = "updateRangeStyle")]
+    pub fn update_range_style(
+        &mut self,
+        range: JsValue,
+        style_path: &str,
+        value: &str,
+    ) -> Result<(), JsError> {
+        let range: Area =
+            serde_wasm_bindgen::from_value(range).map_err(|e| to_js_error(e.to_string()))?;
+        self.model
+            .update_range_style(&range, style_path, value)
+            .map_err(to_js_error)
+    }
+
+    #[wasm_bindgen(js_name = "getCellStyle")]
+    pub fn get_cell_style(
+        &mut self,
+        sheet: u32,
+        row: i32,
+        column: i32,
+    ) -> Result<JsValue, JsError> {
+        self.model
+            .get_cell_style(sheet, row, column)
+            .map_err(to_js_error)
+            .map(|x| serde_wasm_bindgen::to_value(&x).unwrap())
+    }
+
+    #[wasm_bindgen(js_name = "getWorksheetsProperties")]
+    pub fn get_worksheets_properties(&self) -> JsValue {
+        serde_wasm_bindgen::to_value(&self.model.get_worksheets_properties()).unwrap()
+    }
+}

bindings/wasm/test.html

@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Test IronCalc Web Bindings</title>
+    <script type="module">
+        import init, { Model } from "./pkg/wasm.js";
+
+        await init();
+
+        function test() {
+            const model = new Model('en', 'UTC');
+            model.setUserInput(0, 1, 1, "23");
+            model.setUserInput(0, 1, 2, "=A1*3+1");
+            
+            const result = model.getFormattedCellValue(0, 1, 2);
+            console.assert(result === "70");
+            console.log("Hoooray! Tests passed");
+        }
+
+        test();
+    </script>
+</head>
+<body>
+    <div>Please have a look at the console</div>
+</body>
+</html>

bindings/wasm/tests/test.mjs

@@ -0,0 +1,123 @@
+import test from 'node:test';
+import assert from 'node:assert'
+import { Model } from "../pkg/wasm.js";
+
+test('Frozen rows and columns', () => {
+    let model = new Model('en', 'UTC');
+    assert.strictEqual(model.getFrozenRowsCount(0), 0);
+    assert.strictEqual(model.getFrozenColumnsCount(0), 0);
+
+    model.setFrozenColumnsCount(0, 4);
+    model.setFrozenRowsCount(0, 3)
+
+    assert.strictEqual(model.getFrozenRowsCount(0), 3);
+    assert.strictEqual(model.getFrozenColumnsCount(0), 4);
+});
+
+test('Row height', () => {
+    let model = new Model('en', 'UTC');
+    assert.strictEqual(model.getRowHeight(0, 3), 21);
+
+    model.setRowHeight(0, 3, 32);
+    assert.strictEqual(model.getRowHeight(0, 3), 32);
+
+    model.undo();
+    assert.strictEqual(model.getRowHeight(0, 3), 21);
+
+    model.redo();
+    assert.strictEqual(model.getRowHeight(0, 3), 32);
+
+    model.setRowHeight(0, 3, 320);
+    assert.strictEqual(model.getRowHeight(0, 3), 320);
+});
+
+test('Evaluates correctly', (t) => {
+    const model = new Model('en', 'UTC');
+    model.setUserInput(0, 1, 1, "23");
+    model.setUserInput(0, 1, 2, "=A1*3+1");
+
+    const result = model.getFormattedCellValue(0, 1, 2);
+    assert.strictEqual(result, "70");
+});
+
+test('Styles work', () => {
+    const model = new Model('en', 'UTC');
+    let style = model.getCellStyle(0, 1, 1);
+    assert.deepEqual(style, {
+        num_fmt: 'general',
+        fill: { pattern_type: 'none' },
+        font: {
+            sz: 11,
+            color: '#000000',
+            name: 'Calibri',
+            family: 2,
+            scheme: 'minor'
+        },
+        border: {},
+        quote_prefix: false
+    });
+    model.setUserInput(0, 1, 1, "'=1+1");
+    style = model.getCellStyle(0, 1, 1);
+    assert.deepEqual(style, {
+        num_fmt: 'general',
+        fill: { pattern_type: 'none' },
+        font: {
+            sz: 11,
+            color: '#000000',
+            name: 'Calibri',
+            family: 2,
+            scheme: 'minor'
+        },
+        border: {},
+        quote_prefix: true
+    });
+});
+
+test("Add sheets", (t) => {
+    const model = new Model('en', 'UTC');
+    model.newSheet();
+    model.renameSheet(1, "NewName");
+    let props = model.getWorksheetsProperties();
+    assert.deepEqual(props, [{
+        name: 'Sheet1',
+        sheet_id: 1,
+        state: 'visible'
+    },
+    {
+        name: 'NewName',
+        sheet_id: 2,
+        state: 'visible'
+    }
+    ]);
+});
+
+test("invalid sheet index throws an exception", () => {
+    const model = new Model('en', 'UTC');
+    assert.throws(() => {
+        model.setRowHeight(1, 1, 100);
+    }, {
+        name: 'Error',
+        message: 'Invalid sheet index',
+    });
+});
+
+test("invalid column throws an exception", () => {
+    const model = new Model('en', 'UTC');
+    assert.throws(() => {
+        model.setRowHeight(0, -1, 100);
+    }, {
+        name: 'Error',
+        message: "Row number '-1' is not valid.",
+    });
+});
+
+test("floating column numbers get truncated", () => {
+    const model = new Model('en', 'UTC');
+    model.setRowHeight(0.8, 5.2, 100.5);
+
+    assert.strictEqual(model.getRowHeight(0.11, 5.99), 100.5);
+    assert.strictEqual(model.getRowHeight(0, 5), 100.5);
+});
+
+
+