@elicdavis/node-flow 0.1.19 → 0.1.20

package/package.json

@@ -2,7 +2,7 @@
   "name": "@elicdavis/node-flow",
   "description": "build node graphs",
   "author": "Eli C Davis",
-  "version": "0.1.19",
+  "version": "0.1.20",
   "license": "MIT",
   "keywords": [
     "nodes",

package/src/node.ts

@@ -454,7 +454,8 @@ export class FlowNode {
 
     public setProperty(name: string, value: any): void {
         const oldValue = this.#data[name];
-        if (oldValue === value) {
+        // Object.is, not ===: NaN never equals itsel.
+        if (Object.is(oldValue, value)) {
             return;
         }
 
@@ -974,11 +975,6 @@ export class FlowNode {
     }
 
     setTitle(newTitle: string): void {
-        if (!this.#canEditTitle) {
-            console.warn("setTitle instruction ignored, as node has been marked un-editable");
-            return;
-        }
-
         let cleaned = newTitle;
         if (cleaned === null || cleaned === undefined) {
             cleaned = "";
@@ -999,10 +995,6 @@ export class FlowNode {
     }
 
     setInfo(newInfo: string): void {
-        if (!this.#canEditInfo) {
-            console.warn("setInfo instruction ignored, as node has been marked un-editable");
-        }
-
         let cleaned = newInfo;
         if (cleaned === null || cleaned === undefined) {
             cleaned = "";

package/src/nodes/subsystem.ts

@@ -684,6 +684,16 @@ export class NodeSubsystem {
         this.#removeNodeConnections(nodeIndex);
         const node = this.#nodes[nodeIndex];
         this.#nodes.splice(nodeIndex, 1);
+
+        // Hover is only recomputed on render, which is lazy, so it must follow the splice.
+        if (this.#nodeHovering === nodeIndex) {
+            this.#nodeHovering = -1;
+        } else if (this.#nodeHovering > nodeIndex) {
+            this.#nodeHovering--;
+        }
+        if (this.#portHovering?.Node === node) {
+            this.#portHovering = null;
+        }
         requestRender();
         for (let i = 0; i < this.#nodeRemovedCallbacks.length; i++) {
             this.#nodeRemovedCallbacks[i](node);

package/src/widgets/number.ts

@@ -79,7 +79,7 @@ export class NumberWidget {
     }
 
     Set(newNumber: number): void {
-        if (this.#value === newNumber) {
+        if (Object.is(this.#value, newNumber)) {
             return;
         }
 

package/src/widgets/slider.ts

@@ -112,7 +112,7 @@ export class SliderWidget {
 
     SetValue(newValue: number): void {
         const cleanedValue = Clamp(newValue, this.#min, this.#max);
-        if (this.#value === cleanedValue) {
+        if (Object.is(this.#value, cleanedValue)) {
             return;
         }
 

package/test/hover_after_removal.test.ts

@@ -0,0 +1,72 @@
+import { strict as assert } from 'assert';
+import { NodeSubsystem } from '../src/nodes/subsystem';
+import { PassSubsystem } from '../src/pass/subsystem';
+import { FlowNode } from '../src/node';
+import { Camera } from '../src/camera';
+import { ContextMenuConfig } from '../src/contextMenu';
+import { Vector2 } from '../src/types/vector2';
+
+function stubCtx(): CanvasRenderingContext2D {
+    const ctx: any = {
+        canvas: { width: 800, height: 600 },
+        lineWidth: 1,
+        font: '',
+        textAlign: 'left',
+        textBaseline: 'top',
+        fillStyle: '',
+        strokeStyle: '',
+        globalAlpha: 1,
+        measureText: () => ({ width: 40 }),
+        save: () => { }, restore: () => { }, translate: () => { }, scale: () => { },
+        beginPath: () => { }, closePath: () => { }, roundRect: () => { }, rect: () => { },
+        moveTo: () => { }, lineTo: () => { }, arc: () => { }, ellipse: () => { },
+        bezierCurveTo: () => { }, quadraticCurveTo: () => { },
+        fill: () => { }, stroke: () => { }, fillText: () => { }, strokeText: () => { },
+        clip: () => { }, drawImage: () => { }, setLineDash: () => { },
+        createLinearGradient: () => ({ addColorStop: () => { } }),
+    };
+    return ctx as CanvasRenderingContext2D;
+}
+
+function hoverOver(graph: NodeSubsystem, node: FlowNode, ctx: CanvasRenderingContext2D, camera: Camera): Vector2 {
+    graph.render(ctx, camera, undefined);
+    const bounds = node.calculateBounds(ctx, camera);
+    const over = { x: bounds.Position.x + bounds.Size.x / 2, y: bounds.Position.y + bounds.Size.y / 2 };
+    graph.render(ctx, camera, over);
+    return over;
+}
+
+function deleteNodeItem(menu: ContextMenuConfig | null) {
+    return menu?.subMenus?.find((m) => m.name === 'Delete')?.items?.find((i) => i.name === 'Node');
+}
+
+describe('the hovered node going away before the next render', () => {
+    it('opens the context menu without it', () => {
+        const graph = new NodeSubsystem(new PassSubsystem());
+        const node = new FlowNode({ title: 'gone', position: { x: 100, y: 100 } });
+        graph.addNode(node);
+        const ctx = stubCtx();
+        const camera = new Camera();
+        const over = hoverOver(graph, node, ctx, camera);
+
+        graph.removeNode(node);
+
+        assert.equal(deleteNodeItem(graph.openContextMenu(ctx, over)), undefined);
+    });
+
+    it('keeps pointing at the same node when an earlier one is removed', () => {
+        const graph = new NodeSubsystem(new PassSubsystem());
+        const earlier = new FlowNode({ title: 'earlier', position: { x: 100, y: 100 } });
+        const hovered = new FlowNode({ title: 'hovered', position: { x: 400, y: 100 } });
+        graph.addNode(earlier);
+        graph.addNode(hovered);
+        const ctx = stubCtx();
+        const camera = new Camera();
+        const over = hoverOver(graph, hovered, ctx, camera);
+
+        graph.removeNode(earlier);
+        deleteNodeItem(graph.openContextMenu(ctx, over))?.callback?.();
+
+        assert.deepEqual(graph.getNodes(), []);
+    });
+});

package/test/property_binding.test.ts

@@ -0,0 +1,49 @@
+import { strict as assert } from 'assert';
+import { FlowNode } from '../src/node';
+import { NumberWidget } from '../src/widgets/number';
+import { SliderWidget } from '../src/widgets/slider';
+
+describe('property binding', () => {
+    it('settles when a number widget is bound to a property set to NaN', () => {
+        const node = new FlowNode({ title: 'test', position: { x: 0, y: 0 } });
+        new NumberWidget(node, { property: 'x' });
+
+        node.setProperty('x', NaN);
+
+        assert.ok(Number.isNaN(node.getProperty('x')));
+    });
+
+    it('settles when a slider is bound to a property set to NaN', () => {
+        const node = new FlowNode({ title: 'test', position: { x: 0, y: 0 } });
+        new SliderWidget(node, { property: 'x', min: 0, max: 1 });
+
+        node.setProperty('x', NaN);
+    });
+
+    it('does not report a NaN property as changed when it stays NaN', () => {
+        const node = new FlowNode({ title: 'test', position: { x: 0, y: 0 } });
+        let changes = 0;
+        node.addPropertyChangeListener('x', () => { changes++; });
+
+        node.setProperty('x', NaN);
+        node.setProperty('x', NaN);
+
+        assert.equal(changes, 1);
+    });
+});
+
+describe('programmatic title and info', () => {
+    it('sets the title of a node the user cannot retitle', () => {
+        const node = new FlowNode({ title: 'before', position: { x: 0, y: 0 }, canEditTitle: false });
+        node.setTitle('after');
+        assert.equal(node.title(), 'after');
+    });
+
+    it('sets the info of a node the user cannot edit the info of', () => {
+        const node = new FlowNode({ title: 'test', position: { x: 0, y: 0 }, canEditInfo: false });
+        let changed = 0;
+        node.addInfoChangeListener(() => { changed++; });
+        node.setInfo('carrying a mesh');
+        assert.equal(changed, 1);
+    });
+});