@meshagent/meshagent 0.0.11

package/server.js

@@ -0,0 +1,310 @@
+import * as Y from "yjs";
+import { v4 } from "uuid";
+
+const uuid = v4;
+
+export class ServerXmlDocument {
+    constructor(doc, notifyChanges) {
+        this._y = doc.get("xml", Y.XmlElement);
+        this.doc = doc;
+        this._y.observeDeep(yxmlEvents=> {
+            for(let yxmlEvent of yxmlEvents) {
+                const target = yxmlEvent.target;
+               
+                // Observe when child-elements are added or deleted. 
+               
+                if(target instanceof Y.XmlElement) {
+                    const nodeID = target.getAttribute("$id");
+
+                    const message = {
+                        root: target == this._y,
+                        target: nodeID,
+                        elements: [],
+                        attributes: {
+                            set: [],
+                            delete: []
+                        },
+                        text: []
+                    };
+
+                    // element changes
+                    for(let delta of yxmlEvent.changes.delta) {
+                        if(delta.insert) {
+                            message.elements.push({ retain: delta.retain, insert: delta.insert.map(i => this.serialize(i)) });
+                        } else if(delta.delete) {
+                            message.elements.push({ retain: delta.retain, delete: delta.delete });
+                        } else if(delta.retain) {
+                            message.elements.push({ retain: delta.retain });
+                        }
+                    }
+
+                    // attribute changes
+                    yxmlEvent.changes.keys.forEach((change, key) => {
+                        if (change.action === 'add') {
+                            message.attributes.set.push({ "name": key, "value": target.getAttribute(key) });
+                        } else if (change.action === 'update') {
+                            message.attributes.set.push({ "name": key, "value": target.getAttribute(key) });
+                        } else if (change.action === 'delete') {
+                            message.attributes.delete.push(key);
+                        }
+                    })
+                    notifyChanges(message);
+                    
+                } else if(target instanceof Y.XmlText) {
+                    const nodeID = target.parent.getAttribute("$id");
+
+                    const message = {
+                        root: target == this._y,
+                        target: nodeID,
+                        elements: [],
+                        attributes: {
+                            set: [],
+                            delete: []
+                        },
+                        text: []
+                    };
+                    
+                    // text changes
+                    for(let delta of yxmlEvent.changes.delta) {
+                        if(delta.insert) {
+                            message.text.push({ retain: delta.retain, insert: delta.insert, attributes: delta.attributes });
+                        } else if(delta.delete) {
+                            message.text.push({ retain: delta.retain, delete: delta.delete });
+                        } else if(delta.retain) {
+                            message.text.push({ retain: delta.retain, attributes: delta.attributes });
+                        }
+                    }
+                    notifyChanges(message);
+                } else {
+                    throw new Error("Unexpected target type")
+                }
+               
+            }
+        });
+    }
+
+    // changes should be Uint8Array
+    applyBackendChanges(changes) {
+        // TODO: need to set transaction origin?
+        Y.applyUpdate(this.doc, changes);
+    }
+
+    serialize(node) {
+
+        if(node instanceof Y.XmlElement) {
+            const children = [];
+            for(let n = node.firstChild; n != null; n = n.nextSibling) {
+                children.push(this.serialize(n));
+            }
+            return {
+                element: {
+                    tagName: node.nodeName,
+                    attributes: node.getAttributes(),
+                    children: children,
+                }
+            }
+        } else if(node instanceof Y.XmlText) {            
+            return {
+                text: {
+                    delta: node.toDelta()
+                }
+            }
+        } else {
+            throw new Error("Unexpected node type "+node);
+        }
+    }
+
+
+    doDelete(element) {
+        let i = 0;
+        if (element.parent) {        
+            for(let e = element.parent.firstChild; e != null; e = e.nextSibling) {
+                if(e == element) {
+                    element.parent.delete(i, 1)
+                    return;
+                }
+                i++;
+            }
+            throw new Error("element was not deleted" + element);
+        } else {
+            throw new Error("Cannot delete top level element");
+        }
+    }
+
+    createNodes(children) {
+        const nodes = [];
+        for(let child of children) {
+            if(child.text) {
+                const text = new Y.XmlText();
+                if(text.delta) {
+                    text.applyDelta(text.delta);
+                }
+                nodes.push(text);
+            } else if(child.element) {      
+                const element = new Y.XmlElement(child.element.name);
+                // assign a default node id
+                element.setAttribute("$id", child.element.attributes?.id ?? uuid()); 
+                if(child.element.attributes) {
+                    for(let k of Object.keys(child.element.attributes)) {
+                        element.setAttribute(k, child.element.attributes[k]);
+                    }
+                }
+                if(child.element.children) {
+                    element.insert(0, this.createNodes(child.element.children));
+                }
+                nodes.push(element);
+            } else {
+                throw new Error("Unexpected xml data encountered, item is not text or an element");
+            }
+        }
+        return nodes;
+    }
+
+    doInsertChildren(element, { after, index, children }) {     
+        let afterElement;
+        if(after) {
+            for(let e = element.firstChild; e != null; e = e.nextSibling) {
+                if(e instanceof Y.XmlElement ) {
+                    if(e.getAttribute("$id") == after) {
+                        afterElement = e;
+                        break;
+                    }
+                }
+            }
+            if(afterElement == null) {
+                throw new Error("Unable to find child element to insert after: "+after);
+            }
+        }
+
+        if(afterElement) {
+            element.insertAfter(afterElement, this.createNodes(children));
+        } else {
+            if(index !== undefined && index != null) {
+                element.insert(index, this.createNodes(children));
+            } else {
+                element.push(this.createNodes(children));
+            }
+        }
+    }
+
+    doDeleteChildren(element, { after, index, length }) {
+        let afterElement;
+        if(after) {
+            let i = 0;
+            for(let e = element.firstChild; e != null; e = e.nextSibling) {
+                if(e instanceof Y.XmlElement ) {
+                    if(e.getAttribute("$id") == after) {
+                        afterElement = e;
+                        break;
+                    }
+                }
+                i++;
+            }
+            if(afterElement == null) {
+                throw new Error("Unable to find child element to insert after: "+after);
+            }
+            element.delete(i, length);
+        } else {
+            element.delete(index, length);
+        }
+    }
+
+
+    doRemoveAttributes(element, attributes) {
+        for(let k of attributes) {
+            element.removeAttribute(k);
+        }
+    }
+
+    doSetAttributes(element, attributes) {
+        for(let k of Object.keys(attributes)) {
+            element.setAttribute(k, attributes[k]);
+        }
+    }
+
+    findNode(nodeID, root = this._y) {
+        if(!nodeID) {
+            return root;
+        }
+        if(root instanceof Y.XmlElement) {
+            if(root.getAttribute("$id") == nodeID) {
+                return root;
+            }
+            for(let e = root.firstChild; e != null; e = e.nextSibling) {
+                let child = this.findNode(nodeID, e);
+                if(child) {
+                    return child;
+                }
+            }
+        }
+        return null;
+    }
+
+    doInsertText(element, {index, text, attributes}) {
+        if(typeof text != "string") {
+            throw new Error("Inserted text must be a string");
+        }
+        if(element.nodeName != "text") {
+            throw new Error("text can only be inserted in a text element");
+        }
+        const xmlText = element.firstChild;
+        xmlText.insert(index, text, attributes);
+    }
+
+    doFormatText(element, {from, length, attributes}) {
+        if(element.nodeName != "text") {
+            throw new Error("text can only be inserted in a text element");
+        }
+        const xmlText = element.firstChild;
+        xmlText.format(from, length, attributes);
+    }
+
+    doDeleteText(element, {index, length}) {
+        if(element.nodeName != "text") {
+            throw new Error("text can only be inserted in a text element");
+        }
+        const xmlText = element.firstChild;
+        xmlText.delete(index, length);
+    }
+
+    applyChanges(changes) {
+        for(let change of changes) {
+            const element = change.nodeID ? this.findNode(change.nodeID) : this._y;        
+            if(element == null) {
+                throw new Error("Element was not found "+change.nodeID);
+            }
+
+            if(change.delete) {
+                this.doDelete(element);
+            }
+            
+            if(change.insertChildren) {
+                this.doInsertChildren(element, change.insertChildren);
+            }
+
+            if(change.deleteChildren) {
+                this.doDeleteChildren(element, change.deleteChildren);
+            }
+
+            if(change.removeAttributes) {
+                this.doRemoveAttributes(element, change.removeAttributes);
+            }
+
+            if(change.setAttributes) {
+                this.doSetAttributes(element, change.setAttributes);
+            }
+
+            if(change.insertText) {
+                this.doInsertText(element, change.insertText);
+            }
+
+            if(change.formatText) {
+                this.doFormatText(element, change.formatText);
+            }
+
+            if(change.deleteText) {
+                this.doDeleteText(element, change.deleteText);
+            }
+        }
+    }
+}

package/test/assert.js

@@ -0,0 +1,19 @@
+export function assertEqual(v1,v2, message) {
+    if(v1 != v2) {
+        throw new Error(v1 + "!="+v2 +": expected "+ message);
+    }
+}
+
+export function assertDeltaEqual(d1, d2) {
+
+    // make sure our deltas match
+   
+    assertEqual(d1.length, d2.length, "same length delta");
+    for(let i = 0; i < d1.length; i++) {
+        assertEqual(d1[i].insert, d2[i].insert, "delta insert is equal");  
+        assertEqual(Object.keys(d1[i].attributes ?? {}).length, Object.keys(d2[i].attributes ?? {}).length, "same attribute count");
+        for(let k of Object.keys(d1[i].attributes ?? {})) {
+            assertEqual(d1[i].attributes[k], d2[i].attributes[k], "deltas attributes are equal");
+        }
+    }
+}

package/test/document-server-client.test.js

@@ -0,0 +1,33 @@
+import { Protocol, WebSocketProtocolChannel, Completer } from "../protocol";
+import { RoomClient } from "../document-server-client";
+import WebSocket from "ws";
+import * as runtime from "../entrypoint";
+
+globalThis.WebSocket = WebSocket;
+
+test('can sync changes',async () => {
+
+    const client = new RoomClient({protocol: new Protocol({channel: new WebSocketProtocolChannel({url: "ws://localhost:8080/rooms/room_name"})}), runtime: runtime});
+    const client2 = new RoomClient({protocol: new Protocol({channel:  new WebSocketProtocolChannel({url: "ws://localhost:8080/rooms/room_name"})}), runtime: runtime});
+
+    client.start();
+    client2.start();
+
+    const doc = await client.sync.open("/rooms/room_name");
+    const doc2 = await client2.connect("/rooms/room_name");
+
+    console.log("CONNECTED");
+    doc.root.createChildElement("test", {"hello":"world"});
+
+    const completer = new Completer();
+
+    setTimeout(() => {
+        completer.resolve();
+    }, 1000*1);
+
+    await completer.fut;
+        
+    if((doc2.root.getChildren()[0]).getAttribute("hello")!="world") {
+        throw new Error("attribute was not set")
+    }
+})

package/test/document.test.js

@@ -0,0 +1,313 @@
+import * as Y from "yjs";
+import { ServerXmlDocument } from "../server.js";
+import { ClientXmlDocument, XmlElement, XmlText } from "../client.js";
+import { assertEqual, assertDeltaEqual } from "./assert.js";
+import { v4 } from "uuid";
+
+function makeDoc() {
+    const doc = new Y.Doc();
+    const root = doc.get("xml", Y.XmlElement);
+
+    const server = new ServerXmlDocument(doc, (message) => {
+        client.receiveChanges(message);
+    });
+
+    const client = new ClientXmlDocument({ id: v4(), sendChanges: (changes) => {
+        server.applyChanges(changes.changes);
+    }});
+    return [ root, client, server ];
+}
+
+test('set attribute', () => {
+    const [ root, client, server] = makeDoc();
+
+    client.root.setAttribute("test", "v1");
+
+    assertEqual(client.root.getAttribute("test"), "v1", "root attributes are equal");
+});
+
+
+test('insert and delete element', () => {
+    const [ serverRoot, client, server] = makeDoc();
+    const xmlElement = client.root.createChildElement("child", { "hello" : "world" });
+
+    // Can insert
+    let child = client.root.getChildren()[0];
+    assertEqual(child instanceof XmlElement, true, "inserted an element");
+    assertEqual(xmlElement instanceof XmlElement, true, "inserted an element");
+    assertEqual(xmlElement.id, child.id, "child id matches returned id");
+    assertEqual(child.tagName, "child", "inserted child tag names are equal");
+    assertEqual(child.getAttribute("hello"), "world", "inserted child attributes are equal");
+
+    // Can delete node
+    child.delete();
+    assertEqual(client.root.getChildren().length, 0, "can delete element");
+
+});
+
+
+test('update attribute', () => {
+    const [ serverRoot, client, server] = makeDoc();
+
+    const child = client.root.createChildElement("child", { "hello" : "world" });
+
+    // Can update attribute
+    child.setAttribute("hello","mod");
+    assertEqual(child.getAttribute("hello"), "mod", "child attributes are equal");
+
+})
+
+test('remove attribute', () => {
+    const [ serverRoot, client, server] = makeDoc();
+
+    const child = client.root.createChildElement("child", { "hello" : "world" });
+    child.setAttribute("hello","mod");
+
+    // Can remove attribute
+    child.removeAttribute("hello");
+    assertEqual(child.getAttribute("hello") == null, true, "child attribute was removed");
+
+});
+
+test('insert, extend, and shrink text delta', () => {
+
+    const [ serverRoot, client, server] = makeDoc();
+
+    // Can insert text
+    const child = client.root.createChildElement("text", { "hello" : "world" });
+    assertEqual(child instanceof XmlElement, true, "inserted an element");
+    
+    let text = child.getChildren()[0];
+    assertDeltaEqual(serverRoot.firstChild.firstChild.toDelta(), text.delta);
+    assertEqual(text instanceof XmlText, true, "added a text element inside the element");
+    assertEqual(child.tagName, "text", "inserted text tag names are equal");
+    assertEqual(child.getAttribute("hello"), "world", "inserted child attributes are equal");
+
+    assertEqual(text.delta.length, 0, "deltas are empty");
+    text.insert(0, "hello world");
+    assertDeltaEqual(serverRoot.firstChild.firstChild.toDelta(), text.delta);
+    assertEqual(text.delta.length, 1, "inserted a delta");
+    assertEqual(text.delta[0].insert, "hello world", "text matches");
+
+    text.insert(0, "hello world");
+    assertDeltaEqual(serverRoot.firstChild.firstChild.toDelta(), text.delta);
+    assertEqual(text.delta.length, 1, "extended delta");
+    assertEqual(text.delta[0].insert, "hello worldhello world", "text was extended");
+
+    text.delete("hello world".length, "hello world".length);
+    assertDeltaEqual(serverRoot.firstChild.firstChild.toDelta(), text.delta);
+
+    assertEqual(text.delta.length, 1, "trimmed a delta");
+    assertEqual(text.delta[0].insert, "hello world", "text matches");
+
+});
+
+
+test('format text deltas', () => {
+
+    const [ serverRoot, client, server] = makeDoc();
+
+    // Can insert text
+    const child = client.root.createChildElement("text", { "hello" : "world" });
+    assertEqual(child instanceof XmlElement, true, "inserted an element");
+    
+    let text = child.getChildren()[0];
+    assertDeltaEqual(serverRoot.firstChild.firstChild.toDelta(), text.delta);
+    assertEqual(text instanceof XmlText, true, "added a text element inside the element");
+    assertEqual(child.tagName, "text", "inserted text tag names are equal");
+    assertEqual(child.getAttribute("hello"), "world", "inserted child attributes are equal");
+
+    assertEqual(text.delta.length, 0, "deltas are empty");
+    text.insert(0, "hello world");
+    // format whole item
+    text.format(0, "hello world".length, { 
+        "bold" : true
+    });
+
+    assertDeltaEqual(serverRoot.firstChild.firstChild.toDelta(), text.delta);
+
+    assertEqual(text.delta.length, 1, "kept delta");
+    assertEqual(text.delta[0].insert, "hello world", "text matches");
+    assertEqual(text.delta[0].attributes["bold"], true, "attribute matches");
+
+    // format start
+    text.format(0, "hello".length, { 
+        "italic" : true
+    });
+
+    assertDeltaEqual(serverRoot.firstChild.firstChild.toDelta(), text.delta);
+
+    assertEqual(text.delta.length, 2, "split delta");
+    assertEqual(text.delta[0].insert, "hello", "first word matches");
+    assertEqual(text.delta[1].insert, " world", "second word matches");
+    assertEqual(text.delta[0].attributes["bold"], true, "attribute matches");
+    assertEqual(text.delta[0].attributes["italic"], true, "attribute matches");
+    assertEqual(text.delta[1].attributes["bold"], true, "attribute matches");
+    assertEqual(text.delta[1].attributes["italic"], null, "attribute matches");
+
+    // format end
+    text.format(3, 2, { 
+        "underline" : true
+    });
+
+    assertDeltaEqual(serverRoot.firstChild.firstChild.toDelta(), text.delta);
+
+    assertEqual(text.delta.length, 3, "split delta");
+    assertEqual(text.delta[0].insert, "hel", "first word matches");
+    assertEqual(text.delta[1].insert, "lo", "second word matches");
+    assertEqual(text.delta[2].insert, " world", "third word matches");
+
+    assertEqual(text.delta[0].attributes["bold"], true, "attribute matches");
+    assertEqual(text.delta[0].attributes["italic"], true, "attribute matches");
+    assertEqual(text.delta[0].attributes["underline"], null, "attribute matches");
+
+    assertEqual(text.delta[1].attributes["bold"], true, "attribute matches");
+    assertEqual(text.delta[1].attributes["italic"], true, "attribute matches");
+    assertEqual(text.delta[1].attributes["underline"], true, "attribute matches");
+
+    assertEqual(text.delta[2].attributes["bold"], true, "attribute matches");
+    assertEqual(text.delta[2].attributes["italic"], null, "attribute matches");
+    assertEqual(text.delta[2].attributes["underline"], null, "attribute matches");
+
+
+    // format across items
+    text.format(0, "hello world".length, { 
+        "strikethrough" : true
+    });
+
+    assertDeltaEqual(serverRoot.firstChild.firstChild.toDelta(), text.delta);
+    assertEqual(text.delta.length, 3, "retain delta");
+    assertEqual(text.delta[0].insert, "hel", "first word matches");
+    assertEqual(text.delta[1].insert, "lo", "second word matches");
+    assertEqual(text.delta[2].insert, " world", "third word matches");
+
+    assertEqual(text.delta[0].attributes["bold"], true, "attribute matches");
+    assertEqual(text.delta[0].attributes["italic"], true, "attribute matches");
+    assertEqual(text.delta[0].attributes["underline"], null, "attribute matches");
+    assertEqual(text.delta[0].attributes["strikethrough"], true, "attribute matches");
+
+    assertEqual(text.delta[1].attributes["bold"], true, "attribute matches");
+    assertEqual(text.delta[1].attributes["italic"], true, "attribute matches");
+    assertEqual(text.delta[1].attributes["underline"], true, "attribute matches");
+    assertEqual(text.delta[1].attributes["strikethrough"], true, "attribute matches");
+
+    assertEqual(text.delta[2].attributes["bold"], true, "attribute matches");
+    assertEqual(text.delta[2].attributes["italic"], null, "attribute matches");
+    assertEqual(text.delta[2].attributes["underline"], null, "attribute matches");
+    assertEqual(text.delta[2].attributes["strikethrough"], true, "attribute matches");
+
+    // format across items
+    text.format(1, 1, { 
+        "dot" : true
+    });
+
+    assertDeltaEqual(serverRoot.firstChild.firstChild.toDelta(), text.delta);
+    assertEqual(text.delta.length, 5, "split delta");
+    assertEqual(text.delta[0].insert, "h", "first word matches");
+    assertEqual(text.delta[1].insert, "e", "second word matches");
+    assertEqual(text.delta[2].insert, "l", "third word matches");
+});
+
+test('delete start of delta text', () => {
+
+    const [ serverRoot, client, server] = makeDoc();
+    
+    // Text Delete
+    client.root.createChildElement("text", { "hello" : "world" });
+    assertEqual(client.root.getChildren().length, 1, "inserted text element");
+    let child = client.root.getChildren()[0];
+
+    // Delete start
+    assertEqual(child instanceof XmlElement, true, "inserted an element");
+    let text = child.getChildren()[0];
+    assertEqual(text instanceof XmlText, true, "inserted a text element");
+    text.insert(0, "hello world");
+    assertDeltaEqual(serverRoot.firstChild.firstChild.toDelta(), text.delta);
+    assertEqual(text.delta.length, 1, "inserted a delta");
+    assertEqual(text.delta[0].insert, "hello world", "text matches");
+    text.delete(0, "hello ".length);
+    assertEqual(text.delta.length, 1, "kept delta");
+    assertEqual(text.delta[0].insert, "world", "text matches");
+
+});
+
+test('delete end of delta text', () => {
+
+    const [ serverRoot, client, server] = makeDoc();
+    
+    // Text Delete
+    client.root.createChildElement("text", { "hello" : "world" });
+    assertEqual(client.root.getChildren().length, 1, "inserted text element");
+    let child = client.root.getChildren()[0];
+    let text = child.getChildren()[0];
+    text.insert(0, "world");
+
+    // Delete end
+    text.delete("world".length - 1, 1);
+    assertDeltaEqual(serverRoot.firstChild.firstChild.toDelta(), text.delta);
+    assertEqual(text.delta.length, 1, "kept delta");
+    assertEqual(text.delta[0].insert, "worl", "text matches");
+
+});
+
+test('delete center of delta text', () => {
+
+    const [ serverRoot, client, server] = makeDoc();
+    
+    client.root.createChildElement("text", { "hello" : "world" });
+    assertEqual(client.root.getChildren().length, 1, "inserted text element");
+    let child = client.root.getChildren()[0];
+    let text = child.getChildren()[0];
+    text.insert(0, "worl");
+
+    // Delete center
+    text.delete(2, 1);
+    assertDeltaEqual(serverRoot.firstChild.firstChild.toDelta(), text.delta);
+    assertEqual(text.delta.length, 1, "kept delta");
+    assertEqual(text.delta[0].insert, "wol", "text matches");
+
+});
+
+test('insert elements at positions', () => {
+
+    const [ serverRoot, client, server] = makeDoc();
+    
+    // Inserts at end
+    client.root.createChildElement("child2", { "hello2" : "world2" });
+
+    let child = client.root.getChildren()[0];
+    assertEqual(child.tagName, "child2", "inserted child tag names are equal");
+    assertEqual(child.getAttribute("hello2"), "world2", "inserted child attributes are equal");
+
+
+    // Inserts deep
+    child.createChildElement("child3", { "hello3" : "world3" });
+
+    const deepChild = child;
+
+    child = child.getChildren()[0];
+    assertEqual(child.tagName, "child3", "inserted child tag names are equal");
+    assertEqual(child.getAttribute("hello3"), "world3", "inserted child attributes are equal");
+
+    // Inserts after deep
+    child.parent.createChildElement("child4", { "hello4" : "world4" });
+
+    child = deepChild.getChildren()[1];
+    assertEqual(child.tagName, "child4", "inserted child tag names are equal");
+    assertEqual(child.getAttribute("hello4"), "world4", "inserted child attributes are equal");
+
+    // Inserts after element deep
+    deepChild.createChildElementAfter(deepChild.getChildren()[0], "child5", { "hello5" : "world5" });
+
+    child = deepChild.getChildren()[1];
+    assertEqual(child.tagName, "child5", "inserted child tag names are equal");
+    assertEqual(child.getAttribute("hello5"), "world5", "inserted child attributes are equal");
+
+
+    // Inserts after element deep
+    deepChild.createChildElementAt(2, "child6", { "hello6" : "world6" });
+
+    child = deepChild.getChildren()[2];
+    assertEqual(child.tagName, "child6", "inserted child tag names are equal");
+    assertEqual(child.getAttribute("hello6"), "world6", "inserted child attributes are equal");
+});