🪟 Glasspane
WASM Browser Engine — M1 Test Harness
events: idle
Loading WASM...
HTML
CSS
JS
<div id="app"> <h1>Todo App</h1> <input id="todo-input" type="text" placeholder="Add todo..." /> <button onclick="addTodo()">Add</button> <ul id="todo-list"></ul> </div> <style> body { font-family: sans-serif; margin: 20px; color: #333; } h1 { color: #1a73e8; margin-bottom: 12px; } #app { max-width: 400px; } input { padding: 8px; font-size: 14px; border: 1px solid #ccc; border-radius: 4px; } button { padding: 8px 16px; background: #1a73e8; color: white; border: none; border-radius: 4px; cursor: pointer; } ul { list-style: none; padding: 0; margin-top: 12px; } li { padding: 8px; border-bottom: 1px solid #eee; } </style> <script> var todoItems = ['Buy groceries', 'Walk the dog', 'Write some Rust', 'Deploy to Dokku', 'Fix hit testing']; var todoIndex = 0; function addTodo() { const list = document.getElementById('todo-list'); const li = document.createElement('li'); li.textContent = todoItems[todoIndex % todoItems.length]; todoIndex++; list.appendChild(li); } </script>
body { font-family: sans-serif; margin: 20px; color: #333; } h1 { color: #1a73e8; margin-bottom: 12px; }
// JavaScript to run inside Glasspane engine console.log('Hello from Glasspane JS!'); document.querySelector('h1').textContent = 'Modified by JS!';
▶ Render
⚡ Run JS
Clear
Todo Example
Rendered Output
DOM Tree
Toggle JSON
No content rendered yet.
Console
Clear