From 694b4da6a45e8e5f759913ffcbf70b832f607f07 Mon Sep 17 00:00:00 2001 From: DarkWiiPlayer Date: Thu, 25 Nov 2021 10:50:44 +0100 Subject: [PATCH] Add current property to skooma bound elements Elements bound witht he skooma bind function now get a `current` property patched in. --- skooma.js | 7 +++++-- skooma.md | 8 ++++---- 2 files changed, 9 insertions(+), 6 deletions(-) diff --git a/skooma.js b/skooma.js index b341336..4f8037e 100644 --- a/skooma.js +++ b/skooma.js @@ -85,10 +85,13 @@ const nameSpacedProxy = (options={}) => new Proxy(Window, { export const bind = register => transform => { let element + const addCurrent = current => Object.defineProperty(current, 'current', {get: () => element}) element = transform(...register((...values) => { - element = element.replaceWith(transform(...values)) || element + const old = element + element = addCurrent(transform(...values)) + old.replaceWith(element) })) - return element + return addCurrent(element) } export const handle = fn => event => { event.preventDefault(); return fn(event) } diff --git a/skooma.md b/skooma.md index 8977976..3baa9b9 100644 --- a/skooma.md +++ b/skooma.md @@ -66,10 +66,6 @@ initial element from the initial state, which will be returned. On every state change, the transform ation will be called on the new state to generate a new DOM Node, which replace the current one. -If the current node is not in the DOM yet, nothing will happen, and the new node -is thrown away. This "stale" node will not update until it has been placed in -the DOM *and* the next state change occurs. - ```js bind(register)(html.div) // Returns a div element bound to register @@ -77,6 +73,10 @@ bind(register)(html.div) // and html.div is a transformation from input state to a
node ``` +Since references to the bound element can become stale, a `current` property +is set on every element that returns the current element. This will keep working +even after several state changes. + ## handle Since it is common for event handlers to call `preventDefault()`, skooma