diff --git a/packages/syntax-playground/index.html b/packages/syntax-playground/index.html
index 1f41f96..32fc8f8 100644
--- a/packages/syntax-playground/index.html
+++ b/packages/syntax-playground/index.html
@@ -24,5 +24,6 @@
     <p>
       Source code: <a href="src/index.js">index.js</a>
     </p>
+    <div id="extra"></div>
   </body>
 </html>
diff --git a/packages/syntax-playground/src/index.js b/packages/syntax-playground/src/index.js
index 1972656..69d3a42 100644
--- a/packages/syntax-playground/src/index.js
+++ b/packages/syntax-playground/src/index.js
@@ -59,3 +59,12 @@ spawn named 'controller' {
     ^ SetSortColumn(JSON.parse(e.target.dataset.column));
   }
 }
+
+spawn named 'alerter' {
+  let ui = new UI.Anchor();
+  assert ui.html('#extra', <button>Click me</button>);
+
+  on message UI.UIEvent(ui.fragmentId, '.', 'click', $e) {
+    alert("Hello!");
+  }
+}