From cc3fac620c5de7ae4d81f32a9dc34b0b9288b3f9 Mon Sep 17 00:00:00 2001 From: Tony Garnock-Jones Date: Wed, 12 Jan 2022 15:44:06 +0100 Subject: [PATCH] Rescan when a fragment changes, to keep property monitor event handlers installed --- packages/html/src/index.ts | 32 +++++++++++++++++++++++--------- 1 file changed, 23 insertions(+), 9 deletions(-) diff --git a/packages/html/src/index.ts b/packages/html/src/index.ts index b6a2ffd..38cc25d 100644 --- a/packages/html/src/index.ts +++ b/packages/html/src/index.ts @@ -423,18 +423,32 @@ function spawnUIChangeablePropertyFactory(ds: Ref) { \Q.lit($property: string), \_) }) => spawn named ['UIChangeableProperty', selector, property] { - selectorMatch(document.body, selector).forEach(node => { + field needRescan: boolean = false; + + on asserted P.UIFragmentVersion($_i, $_v) => needRescan.value = true; + // TODO: don't be so crude about this ^. On the one hand, this + // lets us ignore UIFragmentVersion records coming and going; on + // the other hand, we do potentially a lot of redundant work. + + function installOrReplaceHandlers() { react { - field propValue: any = (node as any)[property]; - assert P.UIChangeableProperty(selector, property, propValue.value); - const facet = Turn.activeFacet; - const handlerClosure = (_e: Event) => facet.turn(() => { - propValue.value = (node as any)[property]; + selectorMatch(document.body, selector).forEach(node => { + field propValue: any = (node as any)[property]; + assert P.UIChangeableProperty(selector, property, propValue.value); + const facet = Turn.activeFacet; + const handlerClosure = (_e: Event) => facet.turn(() => { + propValue.value = (node as any)[property]; + }); + eventUpdater('change', handlerClosure, true)(node); + on stop eventUpdater('change', handlerClosure, false)(node); }); - eventUpdater('change', handlerClosure, true)(node); - on stop eventUpdater('change', handlerClosure, false)(node); + stop on (needRescan.value) { + needRescan.value = false; + installOrReplaceHandlers(); + } } - }); + } + installOrReplaceHandlers(); } } }