async-reactivity 2.0.25 → 2.0.27

package/lib/effect.js

@@ -0,0 +1,130 @@
+export var EffectState;
+(function (EffectState) {
+    EffectState[EffectState["Initial"] = 0] = "Initial";
+    EffectState[EffectState["Running"] = 1] = "Running";
+    EffectState[EffectState["Waiting"] = 2] = "Waiting";
+    EffectState[EffectState["Scheduled"] = 3] = "Scheduled";
+})(EffectState || (EffectState = {}));
+;
+export const InSyncSymbol = Symbol('inSync');
+export default class Effect {
+    effect;
+    computed;
+    state = EffectState.Initial;
+    dependencies = new Map(); // boolean indicates whether effect is in sync with the dependency
+    abortHandler;
+    constructor(effect, computed = false) {
+        this.effect = effect;
+        this.computed = computed;
+        if (!computed) {
+            this.run();
+        }
+    }
+    innerTrackDependency(dependency) {
+        if (dependency === undefined) {
+            return undefined;
+        }
+        this.dependencies.set(dependency, true);
+        dependency.addDependent(this);
+        return dependency.value;
+    }
+    trackDependency = this.innerTrackDependency.bind(this);
+    run() {
+        let firstRun = this.state === EffectState.Initial;
+        if (this.state === EffectState.Scheduled) {
+            const inSync = [...this.dependencies.entries()].every(([d, inSync]) => {
+                if (!inSync) {
+                    d.value;
+                    return this.dependencies.get(d);
+                }
+                return inSync;
+            });
+            if (inSync) {
+                this.state = EffectState.Waiting;
+                return InSyncSymbol;
+            }
+        }
+        this.state = EffectState.Running;
+        const getResult = () => {
+            this.clearDependencies(runPromise);
+            this.abortHandler = (() => {
+                const handler = {
+                    promise: undefined,
+                    abort: () => { },
+                    aborted: false,
+                    controller: new AbortController()
+                };
+                handler.promise = new Promise((resolve) => {
+                    handler.abort = () => {
+                        handler.aborted = true;
+                        handler.controller.abort();
+                        resolve();
+                    };
+                });
+                return handler;
+            })();
+            const completeRun = (resolve, result, err, async) => {
+                if (this.abortHandler.aborted) {
+                    firstRun = false;
+                    if (this.computed || async) {
+                        return getResult();
+                    }
+                    return Promise.resolve().then(() => getResult());
+                }
+                this.state = EffectState.Waiting;
+                this.abortHandler = undefined;
+                resolveRunPromise();
+                if (resolve) {
+                    return result;
+                }
+                else {
+                    throw err;
+                }
+            };
+            try {
+                const resultMaybePromise = this.effect(this.trackDependency, firstRun, this.abortHandler.controller.signal);
+                if (resultMaybePromise instanceof Promise) {
+                    return Promise.race([resultMaybePromise, this.abortHandler.promise])
+                        .then((result) => completeRun(true, result, undefined, true))
+                        .catch((err) => completeRun(false, undefined, err, true));
+                }
+                return completeRun(true, resultMaybePromise, undefined, false);
+            }
+            catch (err) {
+                return completeRun(false, undefined, err, false);
+            }
+        };
+        let resolveRunPromise;
+        const runPromise = new Promise(resolve => {
+            resolveRunPromise = resolve;
+        });
+        return getResult();
+    }
+    clearDependencies(promise) {
+        for (const dependency of this.dependencies.keys()) {
+            dependency.removeDependent(this, promise);
+        }
+        this.dependencies.clear();
+    }
+    invalidate(dependency) {
+        if (dependency) {
+            this.dependencies.set(dependency, false);
+        }
+        if (this.state === EffectState.Running && !this.abortHandler?.aborted) {
+            this.abortHandler?.abort();
+        }
+        else if (this.state === EffectState.Waiting) {
+            this.state = EffectState.Scheduled;
+            Promise.resolve().then(this.run.bind(this));
+        }
+    }
+    validate(dependency) {
+        this.dependencies.set(dependency, true);
+    }
+    dispose() {
+        this.clearDependencies();
+        this.abortHandler?.abort();
+        this.abortHandler = undefined;
+        this.state = EffectState.Initial;
+    }
+}

package/lib/effect.test.js

@@ -0,0 +1,192 @@
+import 'mocha';
+import assert from 'assert';
+import Effect from './effect.js';
+import Ref from './ref.js';
+import Computed from './computed.js';
+import { values } from 'lodash-es';
+describe('effect', function () {
+    describe('sync', function () {
+        it('should run effect immediately', function () {
+            let count = 0;
+            new Effect(() => {
+                count++;
+            });
+            assert.strictEqual(count, 1);
+        });
+        it('should not run immediately after dependency is changed', function () {
+            let count = 0;
+            const a = new Ref(5);
+            new Effect((value) => {
+                value(a);
+                count++;
+            });
+            assert.strictEqual(count, 1);
+            a.value = 4;
+            assert.strictEqual(count, 1);
+        });
+        it('should run effect when dependency (ref) changes', async function () {
+            let count = 0;
+            const a = new Ref(5);
+            new Effect((value) => {
+                value(a);
+                count++;
+            });
+            a.value = 4;
+            await new Promise(resolve => setTimeout(resolve));
+            assert.strictEqual(count, 2);
+        });
+        it('should indicate first run', async function () {
+            let count = 0;
+            const a = new Ref(5);
+            new Effect((_value, firstRun) => {
+                values(a);
+                assert.strictEqual(firstRun, count === 0);
+                count++;
+            });
+            a.value = 4;
+            await new Promise(resolve => setTimeout(resolve));
+        });
+        it('should run effect once when dependency (ref) changes multiple times synchronously', async function () {
+            let count = 0;
+            const a = new Ref(5);
+            new Effect((value) => {
+                value(a);
+                count++;
+            });
+            a.value = 4;
+            a.value = 3;
+            await new Promise(resolve => setTimeout(resolve));
+            assert.strictEqual(count, 2);
+        });
+        it('should run effect when dependency (computed) changes', async function () {
+            let count = 0;
+            const a = new Ref(5);
+            const b = new Computed(value => value(a) + 1);
+            new Effect((value) => {
+                value(b);
+                count++;
+            });
+            assert.strictEqual(count, 1);
+            a.value = 4;
+            await new Promise(resolve => setTimeout(resolve));
+            assert.strictEqual(count, 2);
+        });
+        it('should not run effect when dependency changes but value is the same', async function () {
+            let count = 0;
+            const a = new Ref(5);
+            const b = new Computed(value => value(a) % 2);
+            new Effect((value) => {
+                value(b);
+                count++;
+            });
+            assert.strictEqual(count, 1);
+            a.value = 3;
+            await new Promise(resolve => setTimeout(resolve));
+            assert.strictEqual(count, 1);
+        });
+        it('should debounce and rerun effect if dependency changes while running', async function () {
+            let count = 0;
+            const a = new Ref(5);
+            new Effect((value) => {
+                value(a);
+                count++;
+                a.value = 6;
+            });
+            assert.strictEqual(count, 1);
+            await new Promise(resolve => setTimeout(resolve));
+            assert.strictEqual(count, 2);
+        });
+    });
+    describe('async', function () {
+        it('should await effect', async function () {
+            const e = new Effect(async () => {
+                await new Promise(resolve => setTimeout(resolve, 10));
+            });
+            // @ts-expect-error
+            assert.strictEqual(e.state, 1);
+            await new Promise(resolve => setTimeout(resolve, 20));
+            // @ts-expect-error
+            assert.strictEqual(e.state, 2);
+            await e.run();
+            // @ts-expect-error
+            assert.strictEqual(e.state, 2);
+        });
+        it('should respect async dependencies', async function () {
+            let count = 0;
+            const a = new Ref(5);
+            const b = new Ref(5);
+            new Effect(async (value) => {
+                value(a);
+                await new Promise(resolve => setTimeout(resolve));
+                value(b);
+                count++;
+            });
+            await new Promise(resolve => setTimeout(resolve, 10));
+            b.value = 4;
+            await new Promise(resolve => setTimeout(resolve, 10));
+            assert.strictEqual(count, 2);
+        });
+        it('should abort previous run if dependency changes while running', async function () {
+            let count = 0;
+            const a = new Ref(5);
+            new Effect(async (value, _firstRun, abortSignal) => {
+                value(a);
+                await new Promise(resolve => setTimeout(resolve));
+                assert.strictEqual(abortSignal.aborted, count === 0);
+                count++;
+            });
+            a.value = 4;
+            await new Promise(resolve => setTimeout(resolve, 10));
+            assert.strictEqual(count, 2);
+        });
+        it('should not abort if effect completes', async function () {
+            let count = 0;
+            const a = new Ref(5);
+            new Effect(async (value, _firstRun, abortSignal) => {
+                value(a);
+                await new Promise(resolve => setTimeout(resolve));
+                assert.strictEqual(abortSignal.aborted, false);
+                count++;
+            });
+            await new Promise(resolve => setTimeout(resolve, 10));
+            a.value = 4;
+            await new Promise(resolve => setTimeout(resolve, 10));
+            a.value = 3;
+            await new Promise(resolve => setTimeout(resolve, 10));
+            assert.strictEqual(count, 3);
+        });
+        it('should not care if promise rejects', async function () {
+            let count = 0;
+            const a = new Ref(5);
+            new Effect(async (value) => {
+                value(a);
+                await new Promise(resolve => setTimeout(resolve));
+                count++;
+                throw new Error('Test error');
+            });
+            await new Promise(resolve => setTimeout(resolve, 10));
+            a.value = 4;
+            await new Promise(resolve => setTimeout(resolve, 10));
+            a.value = 3;
+            await new Promise(resolve => setTimeout(resolve, 10));
+            assert.strictEqual(count, 3);
+        });
+        it('should not dispose computed while effect is running', async function () {
+            let gate = 0;
+            const a = new Ref(5);
+            const b = new Computed(() => {
+                gate++;
+                return 1;
+            }, undefined, 0);
+            new Effect(async (value) => {
+                value(a);
+                await new Promise(resolve => setTimeout(resolve, 10));
+                value(b);
+            });
+            await new Promise(resolve => setTimeout(resolve, 20));
+            a.value = 4;
+            await new Promise(resolve => setTimeout(resolve, 20));
+            assert.strictEqual(gate, 1);
+        });
+    });
+});

package/lib/listener.test.js

@@ -21,7 +21,7 @@ describe('listener', function () {
         const onChange = mock.fn();
         new Watcher(listener, onChange);
         assert.strictEqual(onChange.mock.callCount(), 1);
-        assert.deepStrictEqual(onChange.mock.calls[0].arguments, [1]);
+        assert.deepStrictEqual(onChange.mock.calls[0].arguments, [1, undefined]);
         await new Promise((resolve) => setTimeout(resolve, 20));
         assert.strictEqual(onChange.mock.callCount(), 2);
         assert.deepStrictEqual(onChange.mock.calls[1].arguments, [2, 1]);

package/lib/ref.js

@@ -1,20 +1,31 @@
-import Tracker from "./tracker.js";
 import defaultIsEqual from "./defaultIsEqual.js";
-export default class Ref extends Tracker {
+export default class Ref {
     isEqual;
+    dependents = new Set();
+    _value;
     constructor(_value, isEqual = (defaultIsEqual)) {
-        super();
         this._value = _value;
         this.isEqual = isEqual;
     }
     set value(_value) {
-        const lastValue = this._value;
+        const oldValue = this._value;
         this._value = _value;
-        if (!this.isEqual(lastValue, _value)) {
+        if (!this.isEqual(_value, oldValue)) {
             this.invalidate();
         }
     }
     get value() {
-        return super.value;
+        return this._value;
+    }
+    addDependent(dependent) {
+        this.dependents.add(dependent);
+    }
+    removeDependent(dependent) {
+        this.dependents.delete(dependent);
+    }
+    invalidate() {
+        for (const dependent of this.dependents) {
+            dependent.invalidate(this);
+        }
     }
 }

package/lib/watcher.js

@@ -1,42 +1,14 @@
-import Tracker from "./tracker.js";
-var WatchState;
-(function (WatchState) {
-    WatchState[WatchState["Uncertain"] = 0] = "Uncertain";
-    WatchState[WatchState["Valid"] = 1] = "Valid";
-})(WatchState || (WatchState = {}));
-;
-export default class Watcher extends Tracker {
-    onChange;
-    dependency;
-    state = WatchState.Valid;
+import Effect from "./effect.js";
+export default class Watcher extends Effect {
     constructor(dependency, onChange, immediate = true) {
-        super();
-        this.onChange = onChange;
-        this.dependency = dependency;
-        dependency.addDependent(this);
-        this._value = dependency.value;
-        if (immediate) {
-            onChange(this._value);
-        }
-    }
-    invalidate() {
-        if (this.state === WatchState.Uncertain) {
-            return;
-        }
-        this.state = WatchState.Uncertain;
-        Promise.resolve().then(() => {
-            const oldValue = this._value;
-            this._value = this.dependency.value;
-            if (this.state === WatchState.Uncertain) {
-                this.onChange(this._value, oldValue);
-                this.state = WatchState.Valid;
+        let oldValue = undefined;
+        super((value, firstRun) => {
+            const v = value(dependency);
+            const localOldValue = oldValue;
+            oldValue = v;
+            if (!firstRun || immediate) {
+                onChange(v, localOldValue);
             }
         });
     }
-    validate() {
-        this.state = WatchState.Valid;
-    }
-    dispose() {
-        this.dependency.removeDependent(this);
-    }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "async-reactivity",
-  "version": "2.0.25",
+  "version": "2.0.27",
   "description": "",
   "main": "lib/index.js",
   "types": "types/index.d.ts",
@@ -23,12 +23,12 @@
   "license": "ISC",
   "devDependencies": {
     "@types/lodash-es": "^4.17.12",
-    "@types/mocha": "^10.0.8",
-    "@types/node": "^22.13.11",
-    "mocha": "^10.7.3",
-    "typescript": "^5.8.2"
+    "@types/mocha": "^10.0.10",
+    "@types/node": "^24.11.0",
+    "mocha": "^11.7.5",
+    "typescript": "^5.9.3"
   },
   "dependencies": {
-    "lodash-es": "^4.17.21"
+    "lodash-es": "^4.17.23"
   }
 }