lively 0.4.0 → 0.6.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 2eb71ca34e43090f3b06b4577cc5c29ed82d3282df6fb26c69adb02cc5eff5fe
-  data.tar.gz: 7df1288ae0defc42656da59f5a12e92f3619adc9993e54a4b5e55ac7d10cd795
+  metadata.gz: 5792cd3cb017762c79c0c8efcf99724db21dd444aa0e6e1f0c7f4f8e0e61774a
+  data.tar.gz: 0275c27630c5e0af1408771737e9fa87276ce3b6e2f06de788eaa9e45d60a6a5
 SHA512:
-  metadata.gz: dafdbe14c26702f71de2bc519ac398d141ffc2d1b7f2d1b94f32c44602ea9efc6c083282268f48c7d08798269947322d13bc7005d664b02863fb7bf4f041f031
-  data.tar.gz: d65fd9f4c15cd6992c67bf2ffb1ee21d4d86d15643b71e092f38f55386f438bea86e1aa1b0a535a1c0fbd48836e6ec99e77575e751eec513f7c74f77d89064f5
+  metadata.gz: 3c0f91c91d6d25d138aa78332cfb9c51d4f5793f5134c059bed8d1b6d1dd4b327a70f3d8e47106a49965534157d58913952b60f7508e903b461d3e15d48381bb
+  data.tar.gz: c4b7817e61109d157bb68c157e8c50590776db6c1eca1c4d7f65936339ba2d02da62f07dfc903cd939d8807231dc382e6b7f18702ef0096266b3bd458b25f4cd

data/bin/lively

@@ -0,0 +1,16 @@
+#!/usr/bin/env ruby
+
+require 'async/service'
+require_relative '../lib/lively/environment/application'
+
+ARGV.each do |path|
+	require(path)
+end
+
+configuration = Async::Service::Configuration.build do
+	service "lively" do
+		include Lively::Environment::Application
+	end	
+end
+
+Async::Service::Controller.run(configuration)

data/lib/lively/application.rb

@@ -4,12 +4,32 @@
 # Copyright, 2021-2024, by Samuel Williams.
 
 require 'live'
+require 'protocol/http/middleware'
 require 'async/websocket/adapters/http'
 
 require_relative 'pages/index'
+require_relative 'hello_world'
 
 module Lively
 	class Application < Protocol::HTTP::Middleware
+		def self.[](tag)
+			klass = Class.new(self)
+			
+			klass.define_singleton_method(:resolver) do
+				Live::Resolver.allow(tag)
+			end
+			
+			klass.define_method(:body) do
+				tag.new
+			end
+			
+			return klass
+		end
+		
+		def self.resolver
+			Live::Resolver.allow(HelloWorld)
+		end
+		
 		def initialize(delegate, resolver: self.class.resolver)
 			super(delegate)
 			
@@ -24,19 +44,23 @@ module Lively
 			self.class.name
 		end
 		
-		def body
-			"Hello World"
+		def body(...)
+			HelloWorld.new(...)
+		end
+		
+		def index(...)
+			Pages::Index.new(title: self.title, body: self.body(...))
 		end
 		
-		def index
-			Pages::Index.new(title: self.title, body: self.body)
+		def handle(request, ...)
+			return Protocol::HTTP::Response[200, [], [self.index(...).call]]
 		end
 		
 		def call(request)
 			if request.path == '/live'
 				return Async::WebSocket::Adapters::HTTP.open(request, &self.method(:live)) || Protocol::HTTP::Response[400]
 			else
-				return Protocol::HTTP::Response[200, [], [self.index.call]]
+				return handle(request)
 			end
 		end
 	end

data/lib/lively/environment/application.rb

@@ -3,13 +3,18 @@
 # Released under the MIT License.
 # Copyright, 2021-2024, by Samuel Williams.
 
+require_relative '../application'
+require_relative '../assets'
+
+require 'falcon/environment/server'
+
 module Lively
 	module Environment
 		module Application
 			include Falcon::Environment::Server
 			
 			def application
-				if Object.const_defined?(:Application, false)
+				if Object.const_defined?(:Application)
 					::Application
 				else
 					Console.warn(self, "No Application class defined, using default.")

data/lib/lively/hello_world.rb

@@ -0,0 +1,59 @@
+module Lively
+	class HelloWorld < Live::View
+		def initialize(...)
+			super
+			
+			@clock = nil
+		end
+		
+		def bind(page)
+			super
+			
+			@clock ||= Async do
+				while true
+					self.update!
+					
+					sleep 1
+				end
+			end
+		end
+		
+		def close
+			@clock&.stop
+			
+			super
+		end
+		
+		def render(builder)
+			builder.tag(:h1) do
+				builder.text("Hello, I'm Lively!")
+			end
+			
+			builder.tag(:p) do
+				builder.text("The time is #{Time.now}.")
+			end
+			
+			builder.tag(:p) do
+				builder.text(<<~TEXT)
+					Lively is a simple client-server SPA framework. It is designed to be easy to use and understand, while providing a solid foundation for building interactive web applications. Create an `application.rb` file and define your own `Application` class to get started.
+				TEXT
+			end
+			
+			builder.inline_tag(:pre) do
+				builder.text(<<~TEXT)
+					#!/usr/bin/env lively
+					
+					class Application < Lively::Application
+						def body
+							Lively::HelloWorld.new
+						end
+					end
+				TEXT
+			end
+			
+			builder.tag(:p) do
+				builder.text("Check the `examples/` directory for... you guessed it... more examples.")
+			end
+		end
+	end
+end

data/lib/lively/version.rb

@@ -4,5 +4,5 @@
 # Copyright, 2021-2024, by Samuel Williams.
 
 module Lively
-	VERSION = "0.4.0"
+	VERSION = "0.6.0"
 end

data/public/_components/@socketry/live/Live.js

@@ -1,6 +1,13 @@
 import morphdom from 'morphdom';
 
 export class Live {
+	#window;
+	#document;
+	#server;
+	#events;
+	#failures;
+	#reconnectTimer;
+	
 	static start(options = {}) {
 		let window = options.window || globalThis;
 		let path = options.path || 'live'
@@ -13,210 +20,253 @@ export class Live {
 	}
 	
 	constructor(window, url) {
-		this.window = window;
-		this.document = window.document;
+		this.#window = window;
+		this.#document = window.document;
 		
 		this.url = url;
-		this.events = [];
+		this.#server = null;
+		this.#events = [];
 		
-		this.failures = 0;
+		this.#failures = 0;
+		this.#reconnectTimer = null;
 		
 		// Track visibility state and connect if required:
-		this.document.addEventListener("visibilitychange", () => this.handleVisibilityChange());
-		this.handleVisibilityChange();
+		this.#document.addEventListener("visibilitychange", () => this.#handleVisibilityChange());
+		
+		this.#handleVisibilityChange();
+		
+		const elementNodeType = this.#window.Node.ELEMENT_NODE;
 		
 		// Create a MutationObserver to watch for removed nodes
-		this.observer = new this.window.MutationObserver((mutationsList, observer) => {
+		this.observer = new this.#window.MutationObserver((mutationsList, observer) => {
 			for (let mutation of mutationsList) {
 				if (mutation.type === 'childList') {
 					for (let node of mutation.removedNodes) {
+						if (node.nodeType !== elementNodeType) continue;
+						
 						if (node.classList?.contains('live')) {
-							this.unbind(node);
+							this.#unbind(node);
 						}
 						
 						// Unbind any child nodes:
 						for (let child of node.getElementsByClassName('live')) {
-							this.unbind(child);
+							this.#unbind(child);
 						}
 					}
 					
 					for (let node of mutation.addedNodes) {
-						if (node.classList?.contains('live')) {
-							this.bind(node);
+						if (node.nodeType !== elementNodeType) continue;
+						
+						if (node.classList.contains('live')) {
+							this.#bind(node);
 						}
 						
 						// Bind any child nodes:
 						for (let child of node.getElementsByClassName('live')) {
-							this.bind(child);
+							this.#bind(child);
 						}
 					}
 				}
 			}
 		});
 		
-		this.observer.observe(this.document.body, {childList: true, subtree: true});
-		
-		this.attach();
+		this.observer.observe(this.#document.body, {childList: true, subtree: true});
 	}
 	
 	// -- Connection Handling --
 	
 	connect() {
-		if (this.server) return this.server;
+		if (this.#server) {
+			return this.#server;
+		}
 		
-		let server = this.server = new this.window.WebSocket(this.url);
+		let server = this.#server = new this.#window.WebSocket(this.url);
+		
+		if (this.#reconnectTimer) {
+			clearTimeout(this.#reconnectTimer);
+			this.#reconnectTimer = null;
+		}
 		
 		server.onopen = () => {
-			this.failures = 0;
-			this.flush();
+			this.#failures = 0;
+			this.#flush();
+			this.#attach();
 		};
 		
 		server.onmessage = (message) => {
-			const [name, ..._arguments] = JSON.parse(message.data);
+			const [name, ...args] = JSON.parse(message.data);
 			
-			this[name](..._arguments);
+			this[name](...args);
 		};
 		
 		// The remote end has disconnected:
 		server.addEventListener('error', () => {
-			this.failures += 1;
+			this.#failures += 1;
 		});
 		
 		server.addEventListener('close', () => {
-			// Explicit disconnect will clear `this.server`:
-			if (this.server) {
+			// Explicit disconnect will clear `this.#server`:
+			if (this.#server && !this.#reconnectTimer) {
 				// We need a minimum delay otherwise this can end up immediately invoking the callback:
-				const delay = Math.max(100 * (this.failures + 1) ** 2, 60000);
-				setTimeout(() => this.connect(), delay);
+				const delay = Math.max(100 * (this.#failures + 1) ** 2, 60000);
+				this.#reconnectTimer = setTimeout(() => {
+					this.#reconnectTimer = null;
+					this.connect();
+				}, delay);
 			}
 			
-			this.server = null;
+			if (this.#server === server) {
+				this.#server = null;
+			}
 		});
 		
 		return server;
 	}
 	
 	disconnect() {
-		if (this.server) {
-			const server = this.server;
-			this.server = null;
+		if (this.#server) {
+			const server = this.#server;
+			this.#server = null;
 			server.close();
 		}
+		
+		if (this.#reconnectTimer) {
+			clearTimeout(this.#reconnectTimer);
+			this.#reconnectTimer = null;
+		}
 	}
 	
-	send(message) {
-		if (this.server) {
+	#send(message) {
+		if (this.#server) {
 			try {
-				return this.server.send(message);
+				return this.#server.send(message);
 			} catch (error) {
-				// Ignore.
+				// console.log("Live.send", "failed to send message to server", error);
 			}
 		}
 		
-		this.events.push(message);
+		this.#events.push(message);
 	}
 	
-	flush() {
-		if (this.events.length === 0) return;
+	#flush() {
+		if (this.#events.length === 0) return;
 		
-		let events = this.events;
-		this.events = [];
+		let events = this.#events;
+		this.#events = [];
 		
 		for (var event of events) {
-			this.send(event);
+			this.#send(event);
 		}
 	}
 	
-	handleVisibilityChange() {
-		if (this.document.hidden) {
+	#handleVisibilityChange() {
+		if (this.#document.hidden) {
 			this.disconnect();
 		} else {
 			this.connect();
 		}
 	}
 	
-	bind(element) {
+	#bind(element) {
 		console.log("bind", element.id, element.dataset);
 		
-		this.send(JSON.stringify(['bind', element.id, element.dataset]));
+		this.#send(JSON.stringify(['bind', element.id, element.dataset]));
 	}
 	
-	unbind(element) {
+	#unbind(element) {
 		console.log("unbind", element.id, element.dataset);
 		
-		this.send(JSON.stringify(['unbind', element.id]));
+		if (this.#server) {
+			this.#send(JSON.stringify(['unbind', element.id]));
+		}
 	}
 	
-	attach() {
-		for (let node of this.document.getElementsByClassName('live')) {
-			this.bind(node);
+	#attach() {
+		for (let node of this.#document.getElementsByClassName('live')) {
+			this.#bind(node);
 		}
 	}
 	
-	createDocumentFragment(html) {
-		return this.document.createRange().createContextualFragment(html);
+	#createDocumentFragment(html) {
+		return this.#document.createRange().createContextualFragment(html);
 	}
 	
-	reply(options) {
+	#reply(options, ...args) {
 		if (options?.reply) {
-			this.send(JSON.stringify(['reply', options.reply]));
+			this.#send(JSON.stringify(['reply', options.reply, ...args]));
 		}
 	}
 	
 	// -- RPC Methods --
 	
+	script(id, code, options) {
+		let element = this.#document.getElementById(id);
+		
+		try {
+			let result = this.#window.Function(code).call(element);
+			
+			this.#reply(options, result);
+		} catch (error) {
+			this.#reply(options, null, {name: error.name, message: error.message, stack: error.stack});
+		}
+	}
+	
 	update(id, html, options) {
-		let element = this.document.getElementById(id);
-		let fragment = this.createDocumentFragment(html);
+		let element = this.#document.getElementById(id);
+		let fragment = this.#createDocumentFragment(html);
 		
 		morphdom(element, fragment);
 		
-		this.reply(options);
+		this.#reply(options);
 	}
 	
 	replace(selector, html, options) {
-		let elements = this.document.querySelectorAll(selector);
-		let fragment = this.createDocumentFragment(html);
+		let elements = this.#document.querySelectorAll(selector);
+		let fragment = this.#createDocumentFragment(html);
 		
 		elements.forEach(element => morphdom(element, fragment.cloneNode(true)));
 		
-		this.reply(options);
+		this.#reply(options);
 	}
 	
 	prepend(selector, html, options) {
-		let elements = this.document.querySelectorAll(selector);
-		let fragment = this.createDocumentFragment(html);
+		let elements = this.#document.querySelectorAll(selector);
+		let fragment = this.#createDocumentFragment(html);
 		
 		elements.forEach(element => element.prepend(fragment.cloneNode(true)));
 		
-		this.reply(options);
+		this.#reply(options);
 	}
 	
 	append(selector, html, options) {
-		let elements = this.document.querySelectorAll(selector);
-		let fragment = this.createDocumentFragment(html);
+		let elements = this.#document.querySelectorAll(selector);
+		let fragment = this.#createDocumentFragment(html);
 		
 		elements.forEach(element => element.append(fragment.cloneNode(true)));
 		
-		this.reply(options);
+		this.#reply(options);
 	}
 	
 	remove(selector, options) {
-		let elements = this.document.querySelectorAll(selector);
+		let elements = this.#document.querySelectorAll(selector);
 		
 		elements.forEach(element => element.remove());
 		
-		this.reply(options);
+		this.#reply(options);
 	}
 	
 	dispatchEvent(selector, type, options) {
-		let elements = this.document.querySelectorAll(selector);
+		let elements = this.#document.querySelectorAll(selector);
 		
 		elements.forEach(element => element.dispatchEvent(
-			new this.window.CustomEvent(type, options)
+			new this.#window.CustomEvent(type, options)
 		));
 		
-		this.reply(options);
+		this.#reply(options);
+	}
+	
+	error(message) {
+		console.error("Live.error", ...arguments);
 	}
 	
 	// -- Event Handling --
@@ -224,19 +274,19 @@ export class Live {
 	forward(id, event) {
 		this.connect();
 		
-		this.send(
+		this.#send(
 			JSON.stringify(['event', id, event])
 		);
 	}
 	
-	forwardEvent(id, event, detail) {
-		event.preventDefault();
+	forwardEvent(id, event, detail, preventDefault = false) {
+		if (preventDefault) event.preventDefault();
 		
 		this.forward(id, {type: event.type, detail: detail});
 	}
 	
-	forwardFormEvent(id, event, detail) {
-		event.preventDefault();
+	forwardFormEvent(id, event, detail, preventDefault = true) {
+		if (preventDefault) event.preventDefault();
 		
 		let form = event.form;
 		let formData = new FormData(form);

data/public/_components/@socketry/live/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@socketry/live",
   "type": "module",
-  "version": "0.10.0",
+  "version": "0.13.0",
   "description": "Live HTML tags for Ruby.",
   "main": "Live.js",
   "repository": {

data/public/_components/@socketry/live/test/Live.js

@@ -1,13 +1,52 @@
-import {describe, before, after, it} from 'node:test';
+import {describe, before, beforeEach, after, it} from 'node:test';
 import {ok, strict, strictEqual, deepStrictEqual} from 'node:assert';
 
 import {WebSocket} from 'ws';
 import {JSDOM} from 'jsdom';
 import {Live} from '../Live.js';
 
+class Queue {
+	constructor() {
+		this.items = [];
+		this.waiting = [];
+	}
+
+	push(item) {
+		if (this.waiting.length > 0) {
+			let resolve = this.waiting.shift();
+			resolve(item);
+		} else {
+			this.items.push(item);
+		}
+	}
+
+	pop() {
+		return new Promise(resolve => {
+			if (this.items.length > 0) {
+				resolve(this.items.shift());
+			} else {
+				this.waiting.push(resolve);
+			}
+		});
+	}
+	
+	async popUntil(callback) {
+		while (true) {
+			let item = await this.pop();
+			if (callback(item)) return item;
+		}
+	}
+	
+	clear() {
+		this.items = [];
+		this.waiting = [];
+	}
+}
+
 describe('Live', function () {
 	let dom;
 	let webSocketServer;
+	let messages = new Queue();
 
 	const webSocketServerConfig = {port: 3000};
 	const webSocketServerURL = `ws://localhost:${webSocketServerConfig.port}/live`;
@@ -18,13 +57,24 @@ describe('Live', function () {
 			webSocketServer.on('error', reject);
 		});
 		
-		dom = new JSDOM('<!DOCTYPE html><html><body><div id="my"><p>Hello World</p></div></body></html>');
+		dom = new JSDOM('<!DOCTYPE html><html><body><div id="my" class="live"><p>Hello World</p></div></body></html>');
 		// Ensure the WebSocket class is available:
 		dom.window.WebSocket = WebSocket;
 		
 		await new Promise(resolve => dom.window.addEventListener('load', resolve));
 		
 		await listening;
+		
+		webSocketServer.on('connection', socket => {
+			socket.on('message', message => {
+				let payload = JSON.parse(message);
+				messages.push(payload);
+			});
+		});
+	});
+	
+	beforeEach(function () {
+		messages.clear();
 	});
 	
 	after(function () {
@@ -35,9 +85,9 @@ describe('Live', function () {
 		const live = Live.start({window: dom.window, base: 'http://localhost/'});
 		ok(live);
 		
-		strictEqual(live.window, dom.window);
-		strictEqual(live.document, dom.window.document);
 		strictEqual(live.url.href, 'ws://localhost/live');
+		
+		live.disconnect();
 	});
 	
 	it('should connect to the WebSocket server', function () {
@@ -49,23 +99,51 @@ describe('Live', function () {
 		live.disconnect();
 	});
 	
-	it('should handle visibility changes', function () {
+	it('should handle visibility changes', async function () {
+		const live = new Live(dom.window, webSocketServerURL);
+		
+		// It's tricky to test the method directly.
+		// - Changing document.hidden is a hack.
+		// - Sending custom events seems to cause a hang.
+		
+		live.connect();
+		deepStrictEqual(await messages.pop(), ['bind', 'my', {}]);
+		
+		live.disconnect();
+		
+		live.connect()
+		deepStrictEqual(await messages.pop(), ['bind', 'my', {}]);
+		
+		live.disconnect();
+	});
+	
+	it('can execute scripts', async function () {
 		const live = new Live(dom.window, webSocketServerURL);
 		
-		var hidden = false;
-		Object.defineProperty(dom.window.document, "hidden", {
-			get() {return hidden},
+		live.connect();
+		
+		const connected = new Promise(resolve => {
+			webSocketServer.on('connection', resolve);
 		});
 		
-		live.handleVisibilityChange();
+		let socket = await connected;
 		
-		ok(live.server);
+		socket.send(
+			JSON.stringify(['script', 'my', 'return 1+2', {reply: true}])
+		);
+		
+		let successReply = await messages.popUntil(message => message[0] == 'reply');
+		strictEqual(successReply[2], 3);
 		
-		hidden = true;
+		socket.send(
+			JSON.stringify(['script', 'my', 'throw new Error("Test Error")', {reply: true}])
+		);
 		
-		live.handleVisibilityChange();
+		let errorReply = await messages.popUntil(message => message[0] == 'reply');
+		strictEqual(errorReply[2], null);
+		console.log(errorReply);
 		
-		ok(!live.server);
+		live.disconnect();
 	});
 	
 	it('should handle updates', async function () {
@@ -79,18 +157,11 @@ describe('Live', function () {
 		
 		let socket = await connected;
 		
-		const reply = new Promise((resolve, reject) => {
-			socket.on('message', message => {
-				let payload = JSON.parse(message);
-				if (payload[0] == 'reply') resolve(payload);
-			});
-		});
-		
 		socket.send(
 			JSON.stringify(['update', 'my', '<div id="my"><p>Goodbye World!</p></div>', {reply: true}])
 		);
 		
-		await reply;
+		await messages.popUntil(message => message[0] == 'reply');
 		
 		strictEqual(dom.window.document.getElementById('my').innerHTML, '<p>Goodbye World!</p>');
 		
@@ -108,21 +179,11 @@ describe('Live', function () {
 		
 		let socket = await connected;
 		
-		const reply = new Promise((resolve, reject) => {
-			socket.on('message', message => {
-				let payload = JSON.parse(message);
-				console.log("message", payload);
-				if (payload[0] == 'bind') resolve(payload);
-				else console.log("ignoring", payload);
-			});
-		});
-		
 		socket.send(
 			JSON.stringify(['update', 'my', '<div id="my"><div id="mychild" class="live"></div></div>'])
 		);
 		
-		let payload = await reply;
-		
+		let payload = await messages.popUntil(message => message[0] == 'bind');
 		deepStrictEqual(payload, ['bind', 'mychild', {}]);
 		
 		live.disconnect();
@@ -135,25 +196,11 @@ describe('Live', function () {
 		
 		live.connect();
 		
-		const connected = new Promise(resolve => {
-			webSocketServer.on('connection', resolve);
-		});
-		
-		let socket = await connected;
-		
-		const reply = new Promise((resolve, reject) => {
-			socket.on('message', message => {
-				let payload = JSON.parse(message);
-				if (payload[0] == 'unbind') resolve(payload);
-				else console.log("ignoring", payload);
-			});
-		});
-		
-		live.attach();
-		
 		dom.window.document.getElementById('my').remove();
 		
-		let payload = await reply;
+		let payload = await messages.popUntil(message => {
+			return message[0] == 'unbind' && message[1] == 'my';
+		});
 		
 		deepStrictEqual(payload, ['unbind', 'my']);
 		
@@ -173,20 +220,11 @@ describe('Live', function () {
 		
 		let socket = await connected;
 		
-		const reply = new Promise((resolve, reject) => {
-			socket.on('message', message => {
-				let payload = JSON.parse(message);
-				if (payload[0] == 'reply') resolve(payload);
-				else console.log("ignoring", payload);
-			});
-		});
-		
 		socket.send(
 			JSON.stringify(['replace', '#my p', '<p>Replaced!</p>', {reply: true}])
 		);
 		
-		await reply;
-		
+		await messages.popUntil(message => message[0] == 'reply');
 		strictEqual(dom.window.document.getElementById('my').innerHTML, '<p>Replaced!</p>');
 		
 		live.disconnect();
@@ -207,20 +245,11 @@ describe('Live', function () {
 			JSON.stringify(['update', 'my', '<div id="my"><p>Middle</p></div>'])
 		);
 		
-		const reply = new Promise((resolve, reject) => {
-			socket.on('message', message => {
-				let payload = JSON.parse(message);
-				if (payload[0] == 'reply') resolve(payload);
-				else console.log("ignoring", payload);
-			});
-		});
-		
 		socket.send(
 			JSON.stringify(['prepend', '#my', '<p>Prepended!</p>', {reply: true}])
 		);
 		
-		await reply;
-		
+		await messages.popUntil(message => message[0] == 'reply');
 		strictEqual(dom.window.document.getElementById('my').innerHTML, '<p>Prepended!</p><p>Middle</p>');
 		
 		live.disconnect();
@@ -241,20 +270,11 @@ describe('Live', function () {
 			JSON.stringify(['update', 'my', '<div id="my"><p>Middle</p></div>'])
 		);
 		
-		const reply = new Promise((resolve, reject) => {
-			socket.on('message', message => {
-				let payload = JSON.parse(message);
-				if (payload[0] == 'reply') resolve(payload);
-				else console.log("ignoring", payload);
-			});
-		});
-		
 		socket.send(
 			JSON.stringify(['append', '#my', '<p>Appended!</p>', {reply: true}])
 		);
 		
-		await reply;
-		
+		await messages.popUntil(message => message[0] == 'reply');
 		strictEqual(dom.window.document.getElementById('my').innerHTML, '<p>Middle</p><p>Appended!</p>');
 		
 		live.disconnect();
@@ -275,19 +295,11 @@ describe('Live', function () {
 			JSON.stringify(['update', 'my', '<div id="my"><p>Middle</p></div>'])
 		);
 		
-		const reply = new Promise((resolve, reject) => {
-			socket.on('message', message => {
-				let payload = JSON.parse(message);
-				if (payload[0] == 'reply') resolve(payload);
-			});
-		});
-		
 		socket.send(
 			JSON.stringify(['remove', '#my p', {reply: true}])
 		);
 		
-		await reply;
-		
+		await messages.popUntil(message => message[0] == 'reply');
 		strictEqual(dom.window.document.getElementById('my').innerHTML, '');
 		
 		live.disconnect();
@@ -304,18 +316,11 @@ describe('Live', function () {
 		
 		let socket = await connected;
 		
-		const reply = new Promise((resolve, reject) => {
-			socket.on('message', message => {
-				let payload = JSON.parse(message);
-				if (payload[0] == 'reply') resolve(payload);
-			});
-		});
-		
 		socket.send(
 			JSON.stringify(['dispatchEvent', '#my', 'click', {reply: true}])
 		);
 		
-		await reply;
+		await messages.popUntil(message => message[0] == 'reply');
 		
 		live.disconnect();
 	});
@@ -331,24 +336,22 @@ describe('Live', function () {
 		
 		let socket = await connected;
 		
-		const reply = new Promise((resolve, reject) => {
-			socket.on('message', message => {
-				let payload = JSON.parse(message);
-				if (payload[0] == 'event') resolve(payload);
-			});
-		});
-		
 		dom.window.document.getElementById('my').addEventListener('click', event => {
 			live.forwardEvent('my', event);
 		});
 		
 		dom.window.document.getElementById('my').click();
 		
-		let payload = await reply;
-		
+		let payload = await messages.popUntil(message => message[0] == 'event');
 		strictEqual(payload[1], 'my');
 		strictEqual(payload[2].type, 'click');
 		
 		live.disconnect();
 	});
+	
+	it ('can log errors', function () {
+		const live = new Live(dom.window, webSocketServerURL);
+		
+		live.error('my', 'Test Error');
+	});
 });

data/public/_static/index.css

@@ -1 +1,5 @@
-/* Default Stylesheet */
+/*
+
+Create your own `public/static/index.css` to override the default stylesheet.
+
+*/

data/public/_static/site.css

@@ -1,6 +1,6 @@
 
 html {
-	font-family: Monaco, monospace;
+	font-family: Arial, sans-serif;
 	font-size: 16px;
 	
 	/* Fix odd text-size in `display: flex` elements on Safari iOS */

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: lively
 version: !ruby/object:Gem::Version
-  version: 0.4.0
+  version: 0.6.0
 platform: ruby
 authors:
 - Samuel Williams
@@ -37,7 +37,7 @@ cert_chain:
   Q2K9NVun/S785AP05vKkXZEFYxqG6EW012U4oLcFl5MySFajYXRYbuUpH6AY+HP8
   voD0MPg1DssDLKwXyt1eKD/+Fq0bFWhwVM/1XiAXL7lyYUyOq24KHgQ2Csg=
   -----END CERTIFICATE-----
-date: 2024-05-05 00:00:00.000000000 Z
+date: 2024-05-06 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: falcon
@@ -59,14 +59,14 @@ dependencies:
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: '0.8'
+        version: '0.9'
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: '0.8'
+        version: '0.9'
 - !ruby/object:Gem::Dependency
   name: xrb
   requirement: !ruby/object:Gem::Requirement
@@ -83,14 +83,17 @@ dependencies:
         version: '0'
 description:
 email:
-executables: []
+executables:
+- lively
 extensions: []
 extra_rdoc_files: []
 files:
+- bin/lively
 - lib/lively.rb
 - lib/lively/application.rb
 - lib/lively/assets.rb
 - lib/lively/environment/application.rb
+- lib/lively/hello_world.rb
 - lib/lively/pages/index.rb
 - lib/lively/pages/index.xrb
 - lib/lively/version.rb
@@ -104,6 +107,7 @@ files:
 - public/_components/morphdom/morphdom-umd.js
 - public/_components/morphdom/morphdom-umd.min.js
 - public/_components/morphdom/morphdom.js
+- public/_static/Falcon.png
 - public/_static/icon.png
 - public/_static/index.css
 - public/_static/site.css

metadata.gz.sig

@@ -1,4 +1,4 @@
-I���
-��O�roT�J�nЉ�)X>_�
-$,
-C*"\����4������84���_ o8z��������8�LB 3+����.|��a��$�+�^�-�'rr��V�uo�X�%��3�@�F����B4�,��1����N���~t2H@�ӋEJ�.���ȗn'N7�����%�Fy����i��g�|�[�a.PB�~v��]I���M��
�~�X>�V����`�6Xf�ݵ���;	*ڕ��M0�q��
	�����y|p��h �P��wl���$gԴuyީ~ʚ{kf�Z~#�5Pf#9=4_���3y�_��x�_��Zc�����%���o�;�<S�d�C!���/�������!�
+dW��8u�q�v_�CY:	����-��F�Ǒf�L���:Dž6�
+��$�K~i)�:�/R/,�%�P�
+�0���A�W�f��Po�
+�;)j6k?r6=��`����Wi�h<�1T�9F�W�0���"�s��1c���z��b+��3���ͻ��%Ǚ��"'�v�&l��DނATV�l���L���Y������%����}�8�,��R�����p�:�y�7�+�v��r��za|�)�UrU۴/��D��"Z,��]���Ω�Z�|X
�@��`�Eu�����R8����m^w�N�-��{�@L�