async-reactivity 1.0.0

package/src/computed.ts

@@ -0,0 +1,148 @@
+import Dependency from "./dependency";
+import Dependent from "./dependent";
+import Tracker from "./tracker";
+
+declare type TrackValue = <T>(dependency: Dependency<T>) => T;
+export declare type ComputeFunc<T> = (value: TrackValue) => T;
+export declare type ComputeFuncScoped<T1, T2> = (value: TrackValue, scope: T1) => T2;
+
+enum ComputedState {
+    Invalid,
+    Valid,
+    Uncertain,
+    Computing
+};
+
+class CircularDependencyError extends Error { }
+
+export default class Computed<T> extends Tracker<T> implements Dependent, Dependency<T> {
+    getter: ComputeFunc<T>;
+    private state = ComputedState.Invalid;
+    private dependencies = new Map<Dependency<any>, boolean>();
+    private computePromise?: T;
+    private computePromiseActions?: { resolve: Function, reject: Function };
+    private lastComputeAttemptPromise?: Promise<void>;
+
+    constructor(getter: ComputeFunc<T>) {
+        super();
+        this.getter = getter;
+        this.prepareComputePromise();
+    }
+
+    private prepareComputePromise() {
+        this.computePromise = new Promise((resolve, reject) => {
+            this.computePromiseActions = {
+                resolve,
+                reject
+            };
+        }) as unknown as T;
+    }
+
+    public get value(): T {
+        if (this.state === ComputedState.Invalid || this.state === ComputedState.Uncertain) {
+            return this.compute();
+        }
+
+        return this._value!;
+    }
+
+    private compute() {
+        if (this.state === ComputedState.Uncertain) {
+            for (const dependency of this.dependencies.keys()) {
+                this.dependencies.set(dependency, true);
+            }
+            if ([...this.dependencies.keys()].every(d => {
+                d.value;
+                return !this.dependencies.get(d);
+            })) {
+                this.finalizeComputing();
+                this.validateDependents();
+                return this._value!;
+            }
+        }
+
+        this.state = ComputedState.Computing;
+        this.clearDependencies();
+
+        const lastValue = this._value;
+        this._value = this.getter(this.trackDependency);
+        if (this._value instanceof Promise) {
+            const computeAttemptPromise = this._value
+                .then(result => this.handlePromiseThen(computeAttemptPromise, result))
+                .catch(error => this.handlePromiseCatch(computeAttemptPromise, error)) as Promise<void>;
+            this.lastComputeAttemptPromise = computeAttemptPromise;
+            this._value = this.computePromise!;
+        } else {
+            this.handlePromiseThen(this.lastComputeAttemptPromise!, this._value);
+            if (lastValue === this._value) {
+                this.validateDependents();
+            }
+        }
+        return this._value!;
+    }
+
+    private clearDependencies() {
+        for (const dependency of this.dependencies.keys()) {
+            dependency.removeDependent(this);
+        }
+        this.dependencies.clear();
+    }
+
+    private handlePromiseThen(computeAttemptPromise: Promise<void>, result: any) {
+        if (this.lastComputeAttemptPromise === computeAttemptPromise) {
+            this.computePromiseActions!.resolve(result);
+            this.finalizeComputing();
+        }
+    }
+
+    private handlePromiseCatch(computeAttemptPromise: Promise<void>, error: any) {
+        if (this.lastComputeAttemptPromise === computeAttemptPromise) {
+            this.computePromiseActions!.reject(error);
+            this.finalizeComputing();
+        }
+    }
+
+    private innerTrackDependency(this: Computed<T>, dependency: Dependency<any>) {
+        if (this.dependents.has(dependency as any)) {
+            throw new CircularDependencyError();
+        }
+        this.dependencies.set(dependency, true);
+        dependency.addDependent(this);
+        return dependency.value;
+    }
+
+    private trackDependency = this.innerTrackDependency.bind(this);
+
+    private finalizeComputing() {
+        this.state = ComputedState.Valid;
+        this.lastComputeAttemptPromise = undefined;
+        this.prepareComputePromise();
+    }
+
+    public invalidate() {
+        if (this.state === ComputedState.Computing) {
+            setImmediate(this.compute.bind(this));
+        } if (this.state !== ComputedState.Uncertain) {
+            this.state = ComputedState.Uncertain;
+            super.invalidate();
+        }
+    }
+
+    public validate(dependency: Dependency<any>) {
+        this.dependencies.set(dependency, false);
+    }
+
+    private validateDependents() {
+        for (const dependent of this.dependents.keys()) {
+            dependent.validate(this);
+        }
+    }
+
+    public dispose() {
+        this.clearDependencies();
+        this.state = ComputedState.Invalid;
+        this._value = undefined;
+        this.lastComputeAttemptPromise = undefined;
+        this.prepareComputePromise();
+    }
+}

package/src/dependency.ts

@@ -0,0 +1,7 @@
+import Dependent from "./dependent";
+
+export default interface Dependency<T> {
+    get value(): T;
+    addDependent(dependent: Dependent): void;
+    removeDependent(dependent: Dependent): void;
+}

package/src/dependent.ts

@@ -0,0 +1,7 @@
+import Dependency from "./dependency";
+
+export default interface Dependent {
+    invalidate(): void;
+    validate(dependency: Dependency<any>): void;
+    dispose(): void;
+}

package/src/index.test.ts

@@ -0,0 +1,310 @@
+import { Computed, Ref, Watcher } from './';
+import * as assert from 'assert';
+
+describe('async reactivity', function () {
+    describe('ref', function () {
+        it('getter', function () {
+            const a = new Ref(5);
+            assert.strictEqual(a.value, 5);
+        });
+
+        it('setter', function () {
+            const a = new Ref(5);
+            a.value = 4;
+            assert.strictEqual(a.value, 4);
+        });
+    });
+
+    describe('computed', function () {
+        it('lazy compute', function () {
+            let gate = false;
+            const a = new Computed(() => {
+                gate = true;
+                return 5;
+            });
+
+            assert.strictEqual(gate, false);
+            assert.strictEqual(a.value, 5);
+            assert.strictEqual(gate, true);
+        });
+
+        it('cache', function () {
+            let gate = false;
+            const a = new Computed(() => {
+                gate = true;
+                return 5;
+            });
+
+            assert.strictEqual(a.value, 5);
+
+            gate = false;
+            assert.strictEqual(a.value, 5);
+            assert.strictEqual(gate, false);
+        });
+
+        it('invalidate dependents', function () {
+            const a = new Ref(5);
+            const b = new Computed((value) => {
+                return value(a) + 4;
+            });
+            assert.strictEqual(b.value, 9);
+            a.value = 6;
+            assert.strictEqual(b.value, 10);
+        });
+
+        it('dependents up-to-date', function () {
+            const a = new Ref(5);
+            const b = new Ref(10);
+            let gate;
+            const c = new Computed((value) => {
+                gate = true;
+                return value(a) < 10 ? value(b) : 0;
+            });
+            assert.strictEqual(c.value, 10);
+            a.value = 15;
+            assert.strictEqual(c.value, 0);
+            b.value = 15;
+            gate = false;
+            assert.strictEqual(c.value, 0);
+            assert.strictEqual(gate, false);
+        });
+
+        it('detect circular dependency', function () {
+            // @ts-expect-error
+            const a = new Computed((value) => {
+                return value(b);
+            });
+            // @ts-expect-error
+            const b = new Computed((value) => {
+                return value(a);
+            });
+            assert.throws(() => a.value);
+        });
+
+        xit('detect circular deeper dependency', function () {
+            // do not support for better performance
+            assert.fail('not implemented');
+        });
+
+        it('throw error', function () {
+            const a = new Computed(() => {
+                throw new Error();
+            });
+            assert.throws(() => a.value);
+        });
+
+        it('ignore same ref value', function () {
+            let gate = 0;
+            const a = new Ref(5);
+            const b = new Computed((value) => {
+                gate++;
+                return value(a);
+            });
+
+            assert.strictEqual(b.value, 5);
+
+            a.value = 5;
+            assert.strictEqual(b.value, 5);
+            assert.strictEqual(gate, 1);
+        });
+
+        it('ignore same computed value', function () {
+            let gate = 0;
+            const a = new Ref(5);
+            const b = new Computed((value) => {
+                return value(a) % 2;
+            });
+            const c = new Computed((value) => {
+                gate++;
+                return value(b) + 5;
+            });
+
+            assert.strictEqual(c.value, 6);
+
+            a.value = 7;
+            assert.strictEqual(c.value, 6);
+            assert.strictEqual(gate, 1);
+        });
+    });
+
+    describe('async computed', function () {
+        it('getter', async function () {
+            const a = new Computed(async () => {
+                await new Promise(resolve => setTimeout(resolve));
+                return 5;
+            });
+            assert.strictEqual(await a.value, 5);
+        });
+
+        it('tracks async dependencies', async function () {
+            const a = new Ref(5);
+            const b = new Computed(async (value) => {
+                await new Promise(resolve => setTimeout(resolve));
+                return value(a) + 5;
+            });
+            assert.strictEqual(await b.value, 10);
+            a.value = 6;
+            assert.strictEqual(await b.value, 11);
+        });
+
+        it('get value while computing', async function () {
+            const a = new Computed(async () => {
+                await new Promise(resolve => setTimeout(resolve));
+                return 5;
+            });
+
+            a.value;
+            assert.strictEqual(await a.value, 5);
+        });
+
+        it('detect circular dependency', async function () {
+            // @ts-expect-error
+            const a = new Computed(async (value) => {
+                await new Promise(resolve => setTimeout(resolve));
+                return value(b);
+            });
+            // @ts-expect-error
+            const b = new Computed(async (value) => {
+                await new Promise(resolve => setTimeout(resolve));
+                return value(a);
+            });
+
+            assert.rejects(async () => await a.value);
+        });
+
+        it('old dependency changed while computing', async function () {
+            let gate = 0;
+            const a = new Ref(5);
+            const b = new Computed(async (value) => {
+                gate++;
+                await new Promise(resolve => setTimeout(resolve));
+                return value(a) + 2;
+            });
+            assert.strictEqual(await b.value, 7);
+            b.invalidate();
+            const promise = b.value;
+            a.value = 6;
+            assert.strictEqual(await promise, 8);
+            assert.strictEqual(gate, 2);
+        });
+
+        it('new dependency changed while computing', async function () {
+            let gate = 0;
+            const a = new Ref(5);
+            const b = new Ref(10);
+            const c = new Computed(async (value) => {
+                gate++;
+                await new Promise(resolve => setTimeout(resolve, 50));
+                let sum = value(a);
+                await new Promise(resolve => setTimeout(resolve, 50));
+                sum += value(b);
+                return sum;
+            });
+            assert.strictEqual(await c.value, 15);
+            c.invalidate();
+            const promise = c.value;
+            await new Promise(resolve => setTimeout(resolve, 60));
+            a.value = 10;
+            assert.strictEqual(await promise, 20);
+            assert.strictEqual(gate, 3);
+        });
+
+        it('fallback to primitive while computing', async function () {
+            const a = new Ref(5);
+            const b = new Ref(10);
+            const c = new Computed(async (value) => {
+                if (value(a) < 10) {
+                    await new Promise(resolve => setTimeout(resolve, 50));
+                    return value(b) + 5;
+                }
+                return 2;
+            });
+            const promise = c.value;
+            await new Promise(resolve => setTimeout(resolve, 20));
+            a.value = 10;
+            assert.strictEqual(await promise, 2);
+        });
+
+        it('throw error', async function () {
+            const a = new Computed(async () => {
+                await new Promise(resolve => setTimeout(resolve));
+                throw new Error();
+            });
+            assert.rejects(() => a.value);
+        });
+
+        it('dispose computed', async function () {
+            const a = new Ref(5);
+            let gate = 0;
+            const b = new Computed(value => {
+                gate++;
+                return value(a) + 2;
+            });
+            b.value;
+            assert.strictEqual(gate, 1);
+            b.dispose();
+            a.value = 6;
+            b.value;
+            assert.strictEqual(gate, 1);
+        });
+    });
+
+    describe('watcher', function () {
+        it('sync', function () {
+            const a = new Ref(5);
+            new Watcher(a, (newValue: number, oldValue?: number) => {
+                assert.strictEqual(oldValue, 5);
+                assert.strictEqual(newValue, 6);
+            }, false);
+            a.value = 6;
+        });
+
+        it('async', async function () {
+            const a = new Computed(async () => {
+                await new Promise(resolve => setTimeout(resolve));
+                return 10;
+            });
+            const result = await new Promise<number>(resolve => new Watcher(a, resolve));
+            assert.strictEqual(result, 10);
+        });
+
+        it('sync cancel', async function () {
+            const a = new Ref(5);
+            const b = new Computed((value) => {
+                return value(a) % 2;
+            });
+            let gate = 0;
+            new Watcher(b, () => {
+                gate++;
+            }, false);
+            a.value = 6;
+            assert.strictEqual(gate, 1);
+            a.value = 7;
+            a.value = 9;
+            a.value = 11;
+            assert.strictEqual(gate, 2);
+        });
+
+        it('async sync cancel', async function () {
+            const a = new Ref(5);
+            const b = new Computed(async (value) => {
+                new Promise(resolve => setTimeout(resolve));
+                return value(a) % 2;
+            });
+            let gate = 0;
+            new Watcher(b, () => {
+                gate++;
+            }, false);
+            await new Promise(resolve => setTimeout(resolve, 10));
+            a.value = 6;
+            await new Promise(resolve => setTimeout(resolve, 10));
+            assert.strictEqual(gate, 1);
+            a.value = 7;
+            await new Promise(resolve => setTimeout(resolve, 10));
+            assert.strictEqual(gate, 2);
+            a.value = 9;
+            await new Promise(resolve => setTimeout(resolve, 10));
+            assert.strictEqual(gate, 3);
+        });
+    });
+});

package/src/index.ts

@@ -0,0 +1,5 @@
+export { default as Computed, ComputeFunc, ComputeFuncScoped } from './computed';
+export { default as Ref } from './ref';
+export { default as Watcher } from './watcher';
+export { default as Dependency } from './dependency';
+export { default as Dependent } from './dependent';

package/src/ref.ts

@@ -0,0 +1,22 @@
+import Dependency from "./dependency";
+import Tracker from "./tracker";
+
+export default class Ref<T> extends Tracker<T> implements Dependency<T> {
+
+    constructor(_value: T) {
+        super();
+        this._value = _value;
+    }
+
+    public set value(_value: T) {
+        const lastValue = this._value;
+        this._value = _value;
+        if (lastValue !== _value) {
+            this.invalidate();
+        }
+    }
+
+    public get value(): T {
+        return super.value!;
+    }
+}

package/src/tracker.ts

@@ -0,0 +1,27 @@
+import Computed from "./computed";
+import Watcher from "./watcher";
+
+type Dependent = Computed<any> | Watcher<any>;
+
+export default class Tracker<T> {
+    protected dependents = new Set<Dependent>();
+    protected _value?: T;
+
+    public addDependent(dependent: Dependent) {
+        this.dependents.add(dependent);
+    }
+
+    public removeDependent(dependent: Dependent) {
+        this.dependents.delete(dependent);
+    }
+
+    public invalidate(): void {
+        for (const dependent of [...this.dependents.keys()]) {
+            dependent.invalidate();
+        }
+    }
+
+    public get value() {
+        return this._value;
+    }
+}

package/src/tsconfig.json

@@ -0,0 +1,95 @@
+{
+  "compilerOptions": {
+    /* Visit https://aka.ms/tsconfig to read more about this file */
+    /* Projects */
+    // "incremental": true,                              /* Save .tsbuildinfo files to allow for incremental compilation of projects. */
+    // "composite": true,                                /* Enable constraints that allow a TypeScript project to be used with project references. */
+    // "tsBuildInfoFile": "./.tsbuildinfo",              /* Specify the path to .tsbuildinfo incremental compilation file. */
+    // "disableSourceOfProjectReferenceRedirect": true,  /* Disable preferring source files instead of declaration files when referencing composite projects. */
+    // "disableSolutionSearching": true,                 /* Opt a project out of multi-project reference checking when editing. */
+    // "disableReferencedProjectLoad": true,             /* Reduce the number of projects loaded automatically by TypeScript. */
+    /* Language and Environment */
+    "target": "es2016", /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */
+    // "lib": [],                                        /* Specify a set of bundled library declaration files that describe the target runtime environment. */
+    // "jsx": "preserve",                                /* Specify what JSX code is generated. */
+    // "experimentalDecorators": true,                   /* Enable experimental support for TC39 stage 2 draft decorators. */
+    // "emitDecoratorMetadata": true,                    /* Emit design-type metadata for decorated declarations in source files. */
+    // "jsxFactory": "",                                 /* Specify the JSX factory function used when targeting React JSX emit, e.g. 'React.createElement' or 'h'. */
+    // "jsxFragmentFactory": "",                         /* Specify the JSX Fragment reference used for fragments when targeting React JSX emit e.g. 'React.Fragment' or 'Fragment'. */
+    // "jsxImportSource": "",                            /* Specify module specifier used to import the JSX factory functions when using 'jsx: react-jsx*'. */
+    // "reactNamespace": "",                             /* Specify the object invoked for 'createElement'. This only applies when targeting 'react' JSX emit. */
+    // "noLib": true,                                    /* Disable including any library files, including the default lib.d.ts. */
+    // "useDefineForClassFields": true,                  /* Emit ECMAScript-standard-compliant class fields. */
+    // "moduleDetection": "auto",                        /* Control what method is used to detect module-format JS files. */
+    /* Modules */
+    "module": "commonjs", /* Specify what module code is generated. */
+    // "rootDir": "./",                                  /* Specify the root folder within your source files. */
+    // "moduleResolution": "node",                       /* Specify how TypeScript looks up a file from a given module specifier. */
+    // "baseUrl": "./",                                  /* Specify the base directory to resolve non-relative module names. */
+    // "paths": {},                                      /* Specify a set of entries that re-map imports to additional lookup locations. */
+    // "rootDirs": [],                                   /* Allow multiple folders to be treated as one when resolving modules. */
+    // "typeRoots": [],                                  /* Specify multiple folders that act like './node_modules/@types'. */
+    // "types": [],                                      /* Specify type package names to be included without being referenced in a source file. */
+    // "allowUmdGlobalAccess": true,                     /* Allow accessing UMD globals from modules. */
+    // "moduleSuffixes": [],                             /* List of file name suffixes to search when resolving a module. */
+    // "resolveJsonModule": true,                        /* Enable importing .json files. */
+    // "noResolve": true,                                /* Disallow 'import's, 'require's or '<reference>'s from expanding the number of files TypeScript should add to a project. */
+    /* JavaScript Support */
+    // "allowJs": true,                                  /* Allow JavaScript files to be a part of your program. Use the 'checkJS' option to get errors from these files. */
+    // "checkJs": true,                                  /* Enable error reporting in type-checked JavaScript files. */
+    // "maxNodeModuleJsDepth": 1,                        /* Specify the maximum folder depth used for checking JavaScript files from 'node_modules'. Only applicable with 'allowJs'. */
+    /* Emit */
+    "declaration": true, /* Generate .d.ts files from TypeScript and JavaScript files in your project. */
+    "declarationMap": true, /* Create sourcemaps for d.ts files. */
+    // "emitDeclarationOnly": true,                      /* Only output d.ts files and not JavaScript files. */
+    // "sourceMap": true,                                /* Create source map files for emitted JavaScript files. */
+    // "outFile": "./",                                  /* Specify a file that bundles all outputs into one JavaScript file. If 'declaration' is true, also designates a file that bundles all .d.ts output. */
+    "outDir": "../lib", /* Specify an output folder for all emitted files. */
+    // "removeComments": true,                           /* Disable emitting comments. */
+    // "noEmit": true,                                   /* Disable emitting files from a compilation. */
+    // "importHelpers": true,                            /* Allow importing helper functions from tslib once per project, instead of including them per-file. */
+    // "importsNotUsedAsValues": "remove",               /* Specify emit/checking behavior for imports that are only used for types. */
+    // "downlevelIteration": true,                       /* Emit more compliant, but verbose and less performant JavaScript for iteration. */
+    // "sourceRoot": "",                                 /* Specify the root path for debuggers to find the reference source code. */
+    // "mapRoot": "",                                    /* Specify the location where debugger should locate map files instead of generated locations. */
+    // "inlineSourceMap": true,                          /* Include sourcemap files inside the emitted JavaScript. */
+    // "inlineSources": true,                            /* Include source code in the sourcemaps inside the emitted JavaScript. */
+    // "emitBOM": true,                                  /* Emit a UTF-8 Byte Order Mark (BOM) in the beginning of output files. */
+    // "newLine": "crlf",                                /* Set the newline character for emitting files. */
+    // "stripInternal": true,                            /* Disable emitting declarations that have '@internal' in their JSDoc comments. */
+    // "noEmitHelpers": true,                            /* Disable generating custom helper functions like '__extends' in compiled output. */
+    // "noEmitOnError": true,                            /* Disable emitting files if any type checking errors are reported. */
+    // "preserveConstEnums": true,                       /* Disable erasing 'const enum' declarations in generated code. */
+    "declarationDir": "../types",                        /* Specify the output directory for generated declaration files. */
+    // "preserveValueImports": true,                     /* Preserve unused imported values in the JavaScript output that would otherwise be removed. */
+    /* Interop Constraints */
+    // "isolatedModules": true,                          /* Ensure that each file can be safely transpiled without relying on other imports. */
+    // "allowSyntheticDefaultImports": true,             /* Allow 'import x from y' when a module doesn't have a default export. */
+    "esModuleInterop": true, /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables 'allowSyntheticDefaultImports' for type compatibility. */
+    // "preserveSymlinks": true,                         /* Disable resolving symlinks to their realpath. This correlates to the same flag in node. */
+    "forceConsistentCasingInFileNames": true, /* Ensure that casing is correct in imports. */
+    /* Type Checking */
+    "strict": true, /* Enable all strict type-checking options. */
+    // "noImplicitAny": true,                            /* Enable error reporting for expressions and declarations with an implied 'any' type. */
+    // "strictNullChecks": true,                         /* When type checking, take into account 'null' and 'undefined'. */
+    // "strictFunctionTypes": true,                      /* When assigning functions, check to ensure parameters and the return values are subtype-compatible. */
+    // "strictBindCallApply": true,                      /* Check that the arguments for 'bind', 'call', and 'apply' methods match the original function. */
+    // "strictPropertyInitialization": true,             /* Check for class properties that are declared but not set in the constructor. */
+    // "noImplicitThis": true,                           /* Enable error reporting when 'this' is given the type 'any'. */
+    // "useUnknownInCatchVariables": true,               /* Default catch clause variables as 'unknown' instead of 'any'. */
+    // "alwaysStrict": true,                             /* Ensure 'use strict' is always emitted. */
+    // "noUnusedLocals": true,                           /* Enable error reporting when local variables aren't read. */
+    // "noUnusedParameters": true,                       /* Raise an error when a function parameter isn't read. */
+    // "exactOptionalPropertyTypes": true,               /* Interpret optional property types as written, rather than adding 'undefined'. */
+    // "noImplicitReturns": true,                        /* Enable error reporting for codepaths that do not explicitly return in a function. */
+    // "noFallthroughCasesInSwitch": true,               /* Enable error reporting for fallthrough cases in switch statements. */
+    // "noUncheckedIndexedAccess": true,                 /* Add 'undefined' to a type when accessed using an index. */
+    // "noImplicitOverride": true,                       /* Ensure overriding members in derived classes are marked with an override modifier. */
+    // "noPropertyAccessFromIndexSignature": true,       /* Enforces using indexed accessors for keys declared using an indexed type. */
+    // "allowUnusedLabels": true,                        /* Disable error reporting for unused labels. */
+    // "allowUnreachableCode": true,                     /* Disable error reporting for unreachable code. */
+    /* Completeness */
+    // "skipDefaultLibCheck": true,                      /* Skip type checking .d.ts files that are included with TypeScript. */
+    "skipLibCheck": true /* Skip type checking all .d.ts files. */
+  }
+}

package/src/watcher.ts

@@ -0,0 +1,47 @@
+import Dependency from "./dependency";
+import Dependent from "./dependent";
+import Tracker from "./tracker";
+
+enum WatchState {
+    Uncertain,
+    Valid
+};
+
+type onChangeFunc<T> = (newValue: T, oldValue?: T) => void;
+
+export default class Watcher<T> extends Tracker<T> implements Dependent {
+
+    private onChange: onChangeFunc<T>;
+    private dependency: Dependency<T>;
+    private state = WatchState.Valid;
+
+    constructor(dependency: Dependency<T>, onChange: onChangeFunc<T>, immediate: boolean = true) {
+        super();
+        this.onChange = onChange;
+        this.dependency = dependency;
+
+        dependency.addDependent(this);
+        this._value = dependency.value;
+        if (immediate) {
+            onChange(this._value);
+        }
+    }
+
+    public invalidate() {
+        this.state = WatchState.Uncertain;
+        const oldValue = this._value;
+        this._value = this.dependency.value;
+        if (this.state === WatchState.Uncertain) {
+            this.onChange(this._value, oldValue);
+            this.state = WatchState.Valid;
+        }
+    }
+
+    public validate() {
+        this.state = WatchState.Valid;
+    }
+
+    public dispose() {
+        this.dependency.removeDependent(this);
+    }
+}