convert back to JS values

This commit is contained in:
2025-08-08 07:38:48 +02:00
parent 8453d50220
commit 1cce02a8eb
4 changed files with 78 additions and 72 deletions

View File

@@ -137,8 +137,8 @@ name + " is " + string(age) + " years old and " + (active ? "active" : "inactive
</div>
<div class="full-width">
<button onclick="evaluate()">Evaluate CEL Expression</button>
<button onclick="evaluateAsString()">Evaluate & Return as String</button>
<button onclick="evaluateAsJs()">Evaluate as JavaScript Value</button>
<button onclick="evaluateAsDebug()">Evaluate & Show Debug</button>
</div>
<div class="full-width">
@@ -208,7 +208,7 @@ name + " is " + string(age) + " years old and " + (active ? "active" : "inactive
<script type="module">
import init, {
evaluate_cel,
evaluate_cel_string,
evaluate_cel_debug,
} from "./pkg/cel_rust_wasm.js";
let wasmModule;
@@ -219,7 +219,7 @@ name + " is " + string(age) + " years old and " + (active ? "active" : "inactive
// Make functions globally available
window.evaluate_cel = evaluate_cel;
window.evaluate_cel_string = evaluate_cel_string;
window.evaluate_cel_debug = evaluate_cel_debug;
// Enable the evaluate button
document.querySelector("button").disabled = false;
@@ -229,13 +229,13 @@ name + " is " + string(age) + " years old and " + (active ? "active" : "inactive
initWasm().catch(console.error);
// Make functions globally available for onclick handlers
window.evaluate = evaluate;
window.evaluateAsString = evaluateAsString;
window.evaluateAsJs = evaluateAsJs;
window.evaluateAsDebug = evaluateAsDebug;
window.loadExample = loadExample;
</script>
<script>
function evaluate() {
function evaluateAsJs() {
if (!window.evaluate_cel) {
document.getElementById("result").textContent =
"WASM module not loaded yet...";
@@ -250,24 +250,23 @@ name + " is " + string(age) + " years old and " + (active ? "active" : "inactive
// Parse the context as JavaScript object
const context = contextStr.trim() ? JSON.parse(contextStr) : {};
// Evaluate using the string result version
// Evaluate and get the actual JavaScript value
const result = window.evaluate_cel(expression, context);
if (result.success) {
resultDiv.className = "result success";
resultDiv.textContent = `Success: ${result.result}`;
} else {
resultDiv.className = "result error";
resultDiv.textContent = `Error: ${result.error}`;
}
resultDiv.className = "result success";
resultDiv.textContent = `Success (JS Value): ${JSON.stringify(result, null, 2)}`;
// Log the actual JavaScript object to console for inspection
console.log("CEL Result as JavaScript value:", result);
console.log("Type:", typeof result);
} catch (e) {
resultDiv.className = "result error";
resultDiv.textContent = `JavaScript Error: ${e.message}`;
resultDiv.textContent = `Error: ${e}`;
}
}
function evaluateAsString() {
if (!window.evaluate_cel_string) {
function evaluateAsDebug() {
if (!window.evaluate_cel_debug) {
document.getElementById("result").textContent =
"WASM module not loaded yet...";
return;
@@ -281,11 +280,11 @@ name + " is " + string(age) + " years old and " + (active ? "active" : "inactive
// Parse the context as JavaScript object
const context = contextStr.trim() ? JSON.parse(contextStr) : {};
// Evaluate using the string result version
const result = window.evaluate_cel_string(expression, context);
// Evaluate and get debug string
const result = window.evaluate_cel_debug(expression, context);
resultDiv.className = "result success";
resultDiv.textContent = `Success (String): ${result}`;
resultDiv.textContent = `Debug Output: ${result}`;
} catch (e) {
resultDiv.className = "result error";
resultDiv.textContent = `Error: ${e}`;
@@ -301,15 +300,18 @@ name + " is " + string(age) + " years old and " + (active ? "active" : "inactive
document.getElementById("context").value = context;
// Auto-evaluate
setTimeout(evaluate, 100);
setTimeout(evaluateAsJs, 100);
}
// Auto-evaluate on input change
document.getElementById("expression").addEventListener("input", () => {
setTimeout(evaluate, 300);
setTimeout(evaluateAsJs, 300);
});
document.getElementById("context").addEventListener("input", () => {
setTimeout(evaluateAsJs, 300);
});
addEventListener("input", () => {
setTimeout(evaluate, 300);
});
</script>