diff --git a/cspell.config.cjs b/cspell.config.cjs index d0d9dc56..6c94db0f 100644 --- a/cspell.config.cjs +++ b/cspell.config.cjs @@ -7,5 +7,6 @@ module.exports = { ], words: [ ...baseConfig.words, + 'observavir', ], }; diff --git a/package-lock.json b/package-lock.json index 05577a90..913255c4 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "@electrovir/element-vir-mono-repo", - "version": "20.0.9", + "version": "21.0.0", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "@electrovir/element-vir-mono-repo", - "version": "20.0.9", + "version": "21.0.0", "license": "(MIT or CC0 1.0)", "workspaces": [ "packages/*" @@ -10617,6 +10617,19 @@ "type-fest": "^4.10.2" } }, + "node_modules/observavir": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/observavir/-/observavir-1.0.0.tgz", + "integrity": "sha512-llr+tuegkeHHawqJwxjvog2w9erkE0VJTC5x9SFH6J2uLV0svP7zZZV+TF1daGfwS8ABM/a9++ufbBWJlKZdAA==", + "dependencies": { + "@augment-vir/common": "^26.2.1", + "date-vir": "^5.1.3", + "object-shape-tester": "^2.3.2", + "run-time-assertions": "^1.2.0", + "type-fest": "^4.14.0", + "typed-event-target": "^3.2.1" + } + }, "node_modules/on-finished": { "version": "2.4.1", "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.4.1.tgz", @@ -14245,6 +14258,27 @@ "punycode": "^2.1.0" } }, + "node_modules/url-vir": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/url-vir/-/url-vir-1.1.0.tgz", + "integrity": "sha512-j+BoBCo312xnDqZOsTeitoCB2KQ74+UAZE/VL4jp2APb5SRWNnv4et7FxSMcpHP84rV+/oSKGn7wjWJA96cPog==", + "dependencies": { + "@augment-vir/common": "^25.0.0", + "object-shape-tester": "^2.3.2", + "run-time-assertions": "^1.0.0", + "type-fest": "^4.12.0" + } + }, + "node_modules/url-vir/node_modules/@augment-vir/common": { + "version": "25.0.0", + "resolved": "https://registry.npmjs.org/@augment-vir/common/-/common-25.0.0.tgz", + "integrity": "sha512-0HhaTrGNrWZSEA6rAoWzCIKmKceljWp/FY3r5V6dDf/Lio4EgD5lOxz0GYYB/0X/JYf4PaUrQwBuKtGK85hGQw==", + "dependencies": { + "browser-or-node": "^2.1.1", + "run-time-assertions": "^1.0.0", + "type-fest": "^4.12.0" + } + }, "node_modules/urlpattern-polyfill": { "version": "10.0.0", "resolved": "https://registry.npmjs.org/urlpattern-polyfill/-/urlpattern-polyfill-10.0.0.tgz", @@ -15342,7 +15376,7 @@ } }, "packages/element-book": { - "version": "20.0.9", + "version": "21.0.0", "license": "(MIT or CC0 1.0)", "dependencies": { "@augment-vir/browser": "^26.2.1", @@ -15351,7 +15385,7 @@ "lit-css-vars": "^3.0.9", "spa-router-vir": "^3.0.4", "typed-event-target": "^3.2.1", - "vira": "20.0.9" + "vira": "21.0.0" }, "devDependencies": { "@augment-vir/browser-testing": "^26.2.1", @@ -15377,7 +15411,7 @@ }, "packages/element-book-example": { "name": "@electrovir/element-book-example", - "version": "20.0.9", + "version": "21.0.0", "license": "(MIT or CC0 1.0)", "dependencies": { "@augment-vir/browser": "^26.2.1", @@ -15401,6 +15435,25 @@ "vite-tsconfig-paths": "^4.3.2" } }, + "packages/element-book/node_modules/html-spec-tags": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/html-spec-tags/-/html-spec-tags-1.0.4.tgz", + "integrity": "sha512-N02MytGeyUd9P2hZpNaakiUFnb9/NUae0f2kWFfOJr5kdFiKDu9lRfQtXbOOCCJRjAa9+xWBsLRZ5Bee2IUuBw==", + "dependencies": { + "@augment-vir/common": "^23.3.4", + "run-time-assertions": "^1.0.0" + } + }, + "packages/element-book/node_modules/html-spec-tags/node_modules/@augment-vir/common": { + "version": "23.4.0", + "resolved": "https://registry.npmjs.org/@augment-vir/common/-/common-23.4.0.tgz", + "integrity": "sha512-QIrJ1doD00TNbOzeVrk9KgPTzRlIjayxERnhtbQjK/AFPj5yElcB03GbnGdQZPzws/R+5gfMM5cZiH7QyBP+Kg==", + "dependencies": { + "browser-or-node": "^2.1.1", + "run-time-assertions": "^1.0.0", + "type-fest": "^4.10.2" + } + }, "packages/element-book/node_modules/typescript": { "version": "5.4.3", "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.4.3.tgz", @@ -15414,8 +15467,36 @@ "node": ">=14.17" } }, + "packages/element-book/node_modules/vira/node_modules/@augment-vir/browser": { + "version": "23.4.0", + "resolved": "https://registry.npmjs.org/@augment-vir/browser/-/browser-23.4.0.tgz", + "integrity": "sha512-Sor5YCrOVu8XVKwpEFUY6/sFUodM+iQYT/kmac/5/GXoW898mmO1YZCYiQsKu2vd4Xx6sVp84MzEVQQVSd5Zcg==", + "dependencies": { + "@augment-vir/common": "^23.4.0", + "html-spec-tags": "^1.0.4", + "run-time-assertions": "^1.0.0" + }, + "peerDependencies": { + "element-vir": ">=17" + } + }, + "packages/element-book/node_modules/vira/node_modules/@augment-vir/common": { + "version": "23.4.0", + "resolved": "https://registry.npmjs.org/@augment-vir/common/-/common-23.4.0.tgz", + "integrity": "sha512-QIrJ1doD00TNbOzeVrk9KgPTzRlIjayxERnhtbQjK/AFPj5yElcB03GbnGdQZPzws/R+5gfMM5cZiH7QyBP+Kg==", + "dependencies": { + "browser-or-node": "^2.1.1", + "run-time-assertions": "^1.0.0", + "type-fest": "^4.10.2" + } + }, + "packages/element-book/node_modules/vira/node_modules/colorjs.io": { + "version": "0.4.5", + "resolved": "https://registry.npmjs.org/colorjs.io/-/colorjs.io-0.4.5.tgz", + "integrity": "sha512-yCtUNCmge7llyfd/Wou19PMAcf5yC3XXhgFoAh6zsO2pGswhUPBaaUh8jzgHnXtXuZyFKzXZNAnyF5i+apICow==" + }, "packages/element-vir": { - "version": "20.0.9", + "version": "21.0.0", "license": "(MIT or CC0 1.0)", "dependencies": { "@augment-vir/common": "^26.2.1", @@ -15424,6 +15505,7 @@ "lit-css-vars": "^3.0.9", "lit-html": "^3.1.2", "object-shape-tester": "^2.3.2", + "observavir": "^1.0.0", "run-time-assertions": "^1.2.0", "typed-event-target": "^3.2.1" }, @@ -15451,7 +15533,7 @@ }, "packages/element-vir-example": { "name": "@electrovir/element-vir-example", - "version": "20.0.9", + "version": "21.0.0", "license": "(MIT or CC0 1.0)", "dependencies": { "element-book": "*", @@ -15471,7 +15553,7 @@ }, "packages/scripts": { "name": "@electrovir/scripts", - "version": "20.0.9", + "version": "21.0.0", "license": "(MIT or CC0 1.0)", "dependencies": { "@augment-vir/common": "^26.2.1", @@ -15499,7 +15581,7 @@ } }, "packages/theme-vir": { - "version": "20.0.9", + "version": "21.0.0", "license": "(MIT or CC0 1.0)", "dependencies": { "@augment-vir/common": "^26.2.1" @@ -15525,7 +15607,7 @@ } }, "packages/vira": { - "version": "20.0.9", + "version": "21.0.0", "license": "(MIT or CC0 1.0)", "dependencies": { "@augment-vir/browser": "^26.2.1", @@ -15562,12 +15644,13 @@ }, "packages/vira-book": { "name": "@electrovir/vira-book", - "version": "20.0.9", + "version": "21.0.0", "license": "(MIT or CC0 1.0)", "dependencies": { "@augment-vir/common": "^26.2.1", "element-book": "*", "element-vir": "*", + "url-vir": "^1.1.0", "vira": "*" }, "devDependencies": { diff --git a/package.json b/package.json index 7234d77f..3db8c3eb 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@electrovir/element-vir-mono-repo", - "version": "20.0.9", + "version": "21.0.0", "private": true, "license": "(MIT or CC0 1.0)", "author": { @@ -12,12 +12,12 @@ ], "scripts": { "build:pages": "npm run --workspace @electrovir/scripts build", - "compile": "mono-vir for-each \"rm -rf dist && rm -f tsconfig.tsbuildinfo && tsc -b --pretty\"", + "compile": "mono-vir for-each \"tsc -b -f --pretty\"", "docs": "mono-vir for-each-async npm run --if-present docs", "format": "virmator format", "publish": "virmator publish \"npm run compile && npm run --workspace @electrovir/scripts update:deps && npm i && npm run test:all\"", "test": "mono-vir for-each-async npm test", - "test:all": "concurrently -c auto -m 90% --kill-others-on-fail --colors --names tests,spelling,format,docs,build \"npm run test:coverage\" \"npm run test:spelling\" \"npm run test:format\" \"npm run test:docs\" \"npm run build:pages\"", + "test:all": "npm run compile && concurrently -c auto -m 90% --kill-others-on-fail --colors --names tests,spelling,format,docs,build \"npm run test:coverage\" \"npm run test:spelling\" \"npm run test:format\" \"npm run test:docs\" \"npm run build:pages\"", "test:coverage": "npm run test coverage", "test:deps": "virmator deps check", "test:docs": "mono-vir for-each-async npm run --if-present test:docs", diff --git a/packages/element-book-example/package.json b/packages/element-book-example/package.json index 94c2545f..8878ee11 100644 --- a/packages/element-book-example/package.json +++ b/packages/element-book-example/package.json @@ -1,6 +1,6 @@ { "name": "@electrovir/element-book-example", - "version": "20.0.9", + "version": "21.0.0", "private": true, "license": "(MIT or CC0 1.0)", "scripts": { diff --git a/packages/element-book/package.json b/packages/element-book/package.json index 0b089dcf..df2f6ef6 100644 --- a/packages/element-book/package.json +++ b/packages/element-book/package.json @@ -1,6 +1,6 @@ { "name": "element-book", - "version": "20.0.9", + "version": "21.0.0", "keywords": [ "book", "design system", @@ -48,7 +48,7 @@ "lit-css-vars": "^3.0.9", "spa-router-vir": "^3.0.4", "typed-event-target": "^3.2.1", - "vira": "20.0.9" + "vira": "21.0.0" }, "devDependencies": { "@augment-vir/browser-testing": "^26.2.1", diff --git a/packages/element-book/src/data/book-entry/book-page/define-book-page.test.ts b/packages/element-book/src/data/book-entry/book-page/define-book-page.test.ts index 5748633e..d10501f0 100644 --- a/packages/element-book/src/data/book-entry/book-page/define-book-page.test.ts +++ b/packages/element-book/src/data/book-entry/book-page/define-book-page.test.ts @@ -1,5 +1,5 @@ import {assert} from '@open-wc/testing'; -import {createSetterObservableProp} from 'element-vir'; +import {Observable} from 'element-vir'; import {assertTypeOf} from 'run-time-assertions'; import {BookPageControlTypeEnum, definePageControl} from './book-page-controls'; import {defineBookPage, defineBookPageWithGlobals} from './define-book-page'; @@ -34,7 +34,7 @@ describe(defineBookPage.name, () => { defineExample({ title: 'example with observable property state', stateInitStatic: { - observable: createSetterObservableProp(undefined), + observable: new Observable({defaultValue: undefined}), }, descriptionParagraphs: [ 'yo', diff --git a/packages/element-vir-example/package.json b/packages/element-vir-example/package.json index fd14766a..cd187cc1 100644 --- a/packages/element-vir-example/package.json +++ b/packages/element-vir-example/package.json @@ -1,6 +1,6 @@ { "name": "@electrovir/element-vir-example", - "version": "20.0.9", + "version": "21.0.0", "private": true, "license": "(MIT or CC0 1.0)", "author": { diff --git a/packages/element-vir-example/src/element.test.ts b/packages/element-vir-example/src/element.test.ts index 8c583a2b..6816c794 100644 --- a/packages/element-vir-example/src/element.test.ts +++ b/packages/element-vir-example/src/element.test.ts @@ -3,7 +3,7 @@ import { DeclarativeElement, DeclarativeElementDefinition, EventObjectEventDetailExtractor, - ObservableProp, + Observable, TemplateResult, TypedEvent, css, @@ -110,7 +110,7 @@ describe('test elements', () => { width: number; showChild: boolean; derp: Record; - myObservable: ObservableProp; + myObservable: Observable; }; const stateInitStatic: ReadonlyArray = getObjectTypedKeys( diff --git a/packages/element-vir-example/src/elements/entries/observable-props.book.ts b/packages/element-vir-example/src/elements/entries/observable-props.book.ts index ff5e02f4..28104b44 100644 --- a/packages/element-vir-example/src/elements/entries/observable-props.book.ts +++ b/packages/element-vir-example/src/elements/entries/observable-props.book.ts @@ -1,16 +1,10 @@ import {randomInteger} from '@augment-vir/common'; import {defineBookPage} from 'element-book'; -import { - createSetterObservableProp, - defineElement, - defineElementNoInputs, - html, - listen, -} from 'element-vir'; +import {Observable, defineElement, defineElementNoInputs, html, listen} from 'element-vir'; -const myObservableProp = createSetterObservableProp(5); +const myObservable = new Observable({defaultValue: 5}); -const VirObservablePropsTestParent = defineElementNoInputs({ +const VirObservablesTestParent = defineElementNoInputs({ tagName: 'vir-observable-prop-input-test-parent', stateInitStatic: { renderCount: 0, @@ -20,14 +14,14 @@ const VirObservablePropsTestParent = defineElementNoInputs({ return html`

Parent render count (should not change): ${state.renderCount}

- <${VirObservablePropsTestChild.assign({ - observableProp: myObservableProp, - })}> + <${VirObservablesTestChild.assign({ + observableProp: myObservable, + })}>

+ @@ -630,13 +628,13 @@ export const MyWithAsyncProp = defineElement<{endpoint: string}>()({ }, }), }, - renderCallback({inputs, state, updateState}) { + renderCallback({inputs, state}) { /** * This causes the a promise which automatically updates the state.data prop once the * promise resolves. It only creates a new promise if the first input, the trigger, value * changes from previous calls. */ - state.data.updateTrigger(inputs); + state.data.update(inputs); return html` Here's the data:
diff --git a/packages/element-vir/package.json b/packages/element-vir/package.json index 0ed3f3dd..2b788ed5 100644 --- a/packages/element-vir/package.json +++ b/packages/element-vir/package.json @@ -1,6 +1,6 @@ { "name": "element-vir", - "version": "20.0.9", + "version": "21.0.0", "keywords": [ "custom", "web", @@ -35,7 +35,7 @@ "test": "virmator test-web", "test:coverage": "npm run test coverage", "test:docs": "virmator docs check", - "test:types": "npm run compile" + "test:types": "tsc --pretty --noEmit" }, "dependencies": { "@augment-vir/common": "^26.2.1", @@ -44,6 +44,7 @@ "lit-css-vars": "^3.0.9", "lit-html": "^3.1.2", "object-shape-tester": "^2.3.2", + "observavir": "^1.0.0", "run-time-assertions": "^1.2.0", "typed-event-target": "^3.2.1" }, diff --git a/packages/element-vir/src/declarative-element/declarative-element.ts b/packages/element-vir/src/declarative-element/declarative-element.ts index 4e535258..1be5f48b 100644 --- a/packages/element-vir/src/declarative-element/declarative-element.ts +++ b/packages/element-vir/src/declarative-element/declarative-element.ts @@ -11,7 +11,7 @@ import {EventDescriptorMap, EventsInitMap} from './properties/element-events'; import {ElementPropertyDescriptorMap, PropertyInitMapBase} from './properties/element-properties'; import {FlattenElementVirStateSetup} from './properties/element-vir-state-setup'; import {HostClassNamesMap} from './properties/host-classes'; -import {ObservablePropListenerMap} from './properties/observable-prop/observable-prop'; +import {ObservableListenerMap} from './properties/property-proxy'; import type {RenderCallback, RenderParams, UpdateStateCallback} from './render-callback'; import {SlotNameMap} from './slot-names'; @@ -230,9 +230,10 @@ export abstract class DeclarativeElement< public abstract _lastRenderedProps: Readonly< Pick, 'inputs' | 'state'> >; + public abstract destroy(): void; public abstract override render(): unknown; public abstract readonly instanceState: FlattenElementVirStateSetup; - public abstract readonly observablePropertyListenerMap: ObservablePropListenerMap< + public abstract readonly observablePropertyListenerMap: ObservableListenerMap< StateInit & Inputs >; public abstract readonly instanceInputs: Inputs; diff --git a/packages/element-vir/src/declarative-element/define-element-no-inputs.test.ts b/packages/element-vir/src/declarative-element/define-element-no-inputs.test.ts index 2cde5652..40a71213 100644 --- a/packages/element-vir/src/declarative-element/define-element-no-inputs.test.ts +++ b/packages/element-vir/src/declarative-element/define-element-no-inputs.test.ts @@ -1,6 +1,8 @@ -import {AnyFunction, randomString} from '@augment-vir/common'; -import {assert} from '@open-wc/testing'; -import {assertTypeOf} from 'run-time-assertions'; +import {AnyFunction, randomString, waitUntilTruthy} from '@augment-vir/common'; +import {assert, fixture} from '@open-wc/testing'; +import {IntervalObservable} from 'observavir'; +import {assertInstanceOf, assertThrows, assertTypeOf} from 'run-time-assertions'; +import {html} from '../template-transforms/vir-html/vir-html'; import {defineElementNoInputs} from './define-element-no-inputs'; describe(defineElementNoInputs.name, () => { @@ -97,4 +99,43 @@ describe(defineElementNoInputs.name, () => { return {}; } }); + + it('destroys all state props', async () => { + let count = 0; + + const MyElement = defineElementNoInputs({ + tagName: `some-tag-${randomString()}`, + stateInitStatic: { + intervalObservable: new IntervalObservable({ + defaultParams: undefined, + intervalDuration: { + milliseconds: 100, + }, + updateCallback() { + count++; + return 'hi'; + }, + }), + }, + renderCallback() { + return ''; + }, + }); + + const rendered = await fixture(html` + <${MyElement}> + `); + + assertInstanceOf(rendered, MyElement); + await waitUntilTruthy(() => count > 10); + + rendered.destroy(); + const countAfterDestroy = count; + + await assertThrows(() => + waitUntilTruthy(() => count > countAfterDestroy + 10, undefined, { + timeout: {milliseconds: 3_000}, + }), + ); + }); }); diff --git a/packages/element-vir/src/declarative-element/define-element-no-inputs.ts b/packages/element-vir/src/declarative-element/define-element-no-inputs.ts index d10582e3..85a95208 100644 --- a/packages/element-vir/src/declarative-element/define-element-no-inputs.ts +++ b/packages/element-vir/src/declarative-element/define-element-no-inputs.ts @@ -6,7 +6,7 @@ import { kebabCaseToCamelCase, } from '@augment-vir/common'; import {defineCssVars} from 'lit-css-vars'; -import {isRunTimeType} from 'run-time-assertions'; +import {hasProperty, isRunTimeType} from 'run-time-assertions'; import {MinimalDefinitionWithInputs} from '../template-transforms/minimal-element-definition'; import {css} from '../template-transforms/vir-css/vir-css'; import {CustomElementTagName} from './custom-tag-name'; @@ -358,6 +358,17 @@ export function defineElementNoInputs< } } + public destroy() { + Object.values(this.instanceState).forEach((stateValue) => { + if ( + hasProperty(stateValue, 'destroy') && + isRunTimeType(stateValue.destroy, 'function') + ) { + stateValue.destroy(); + } + }); + } + public override disconnectedCallback(): void { super.disconnectedCallback(); if (init.cleanupCallback) { @@ -366,6 +377,7 @@ export function defineElementNoInputs< throw new Error(`cleanupCallback in '${init.tagName}' cannot be asynchronous`); } } + this.destroy(); this._initCalled = false; } diff --git a/packages/element-vir/src/declarative-element/directives/async-prop.test.ts b/packages/element-vir/src/declarative-element/directives/async-prop.test.ts index 1e758d4d..f68a6e17 100644 --- a/packages/element-vir/src/declarative-element/directives/async-prop.test.ts +++ b/packages/element-vir/src/declarative-element/directives/async-prop.test.ts @@ -8,28 +8,15 @@ import { waitUntilTruthy, } from '@augment-vir/common'; import {assert, fixture as renderFixture, waitUntil} from '@open-wc/testing'; +import {isObservableBase} from 'observavir'; import {assertDefined, assertInstanceOf, assertThrows, assertTypeOf} from 'run-time-assertions'; -// import { -// AsyncPropValue, -// StaticElementPropertyDescriptor, -// asyncProp, -// defineElement, -// defineElementEvent, -// defineElementNoInputs, -// html, -// isError, -// isResolved, -// listen, -// renderAsync, -// } from '../../index'; import {html} from '../../template-transforms/vir-html/vir-html'; import {defineElement} from '../define-element'; import {defineElementNoInputs} from '../define-element-no-inputs'; import {defineElementEvent} from '../properties/element-events'; import {StaticElementPropertyDescriptor} from '../properties/element-properties'; -import {ElementVirStateSetup} from '../properties/element-vir-state-setup'; -import {isObservableProp} from '../properties/observable-prop/observable-prop'; -import {AsyncObservableProp, AsyncPropValue, asyncProp} from './async-prop'; +import {ElementVirStateSetup, stateSetupKey} from '../properties/element-vir-state-setup'; +import {AsyncProp, AsyncValue, asyncProp} from './async-prop'; import {isError, isResolved} from './is-resolved.directive'; import {listen} from './listen.directive'; import {renderAsync} from './render-async.directive'; @@ -51,8 +38,6 @@ describe(asyncProp.name, () => { }, }); - /** Triggers must be serializable (a function isn't). */ - // @ts-expect-error asyncProp({ async updateCallback(trigger: {callback: () => number}) { return 'five'; @@ -68,7 +53,7 @@ describe(asyncProp.name, () => { }, }), myAsyncPropAgain: asyncProp({ - updateCallback(trigger: TriggerType, inputs: {hello: string; goodbye: number}) { + updateCallback(trigger: TriggerType & {hello: string; goodbye: number}) { return Promise.resolve({something: 4}); }, }), @@ -84,8 +69,8 @@ describe(asyncProp.name, () => { }); const exampleTrigger = {} as TriggerType; - state.myAsyncProp.updateTrigger(exampleTrigger); - state.myAsyncPropAgain.updateTrigger(exampleTrigger, {goodbye: 4, hello: 'hi'}); + state.myAsyncProp.update(exampleTrigger); + state.myAsyncPropAgain.update({...exampleTrigger, goodbye: 4, hello: 'hi'}); updateState({ syncProp: { @@ -95,12 +80,12 @@ describe(asyncProp.name, () => { }, }); - state.myAsyncProp.updateTrigger({ + state.myAsyncProp.update({ ...exampleTrigger, // @ts-expect-error hello: 'yo', }); - state.myAsyncPropAgain.updateTrigger(exampleTrigger, {goodbye: 4, hello: 'hi'}); + state.myAsyncPropAgain.update({...exampleTrigger, goodbye: 4, hello: 'hi'}); updateState({ syncProp: { @@ -108,11 +93,9 @@ describe(asyncProp.name, () => { }, }); - state.myAsyncPropAgain.setNewPromise(Promise.resolve({} as any)); + state.myAsyncPropAgain.setValue(Promise.resolve({} as any)); - assertTypeOf(state.myAsyncProp.value).toEqualTypeOf< - AsyncPropValue - >(); + assertTypeOf(state.myAsyncProp.value).toEqualTypeOf>(); return html``; }, }); @@ -120,25 +103,25 @@ describe(asyncProp.name, () => { assertTypeOf(elementWithAsyncProp.stateInitStatic.myAsyncProp).toEqualTypeOf< StaticElementPropertyDescriptor< string, - ElementVirStateSetup> + ElementVirStateSetup> > >(); assertTypeOf< (typeof elementWithAsyncProp)['stateType']['myAsyncProp']['value'] - >().toEqualTypeOf>(); + >().toEqualTypeOf>(); assertTypeOf< (typeof elementWithAsyncProp)['instanceType']['instanceState']['myAsyncProp']['value'] - >().toEqualTypeOf>(); + >().toEqualTypeOf>(); }); - it('passes isObservableProp', () => { - const instance = new AsyncObservableProp(); - assert.isTrue(isObservableProp(instance)); + it('passes isObservableBase', () => { + const instance = asyncProp()[stateSetupKey](); + assert.isTrue(isObservableBase(instance)); }); - it('updates and resolves async prop createPromise and updateTrigger', async () => { + it('updates and resolves async prop createPromise and update', async () => { const startingNumber = 123; // render the element @@ -161,7 +144,7 @@ describe(asyncProp.name, () => { }), }, renderCallback({inputs, state}) { - state.myAsyncProp.updateTrigger({ + state.myAsyncProp.update({ newNumber: inputs.promiseUpdateTrigger ?? startingNumber, circularReference, }); @@ -178,7 +161,7 @@ describe(asyncProp.name, () => { ${listen('click', () => { const newDeferredPromise = createDeferredPromiseWrapper(); - state.myAsyncProp.setNewPromise(newDeferredPromise.promise); + state.myAsyncProp.setValue(newDeferredPromise.promise); deferredPromiseWrappers.push(newDeferredPromise); })} @@ -199,7 +182,7 @@ describe(asyncProp.name, () => {