Skip to content

Instantly share code, notes, and snippets.

@dfkaye
dfkaye / onpropertychange-signal-v.4.js
Created November 29, 2023 23:17
onpropertychange signal v.4 -- redone form element sketch that works for arrays and objects
// 18 september 2023
// onpropertychange signal v.4
// cont'd from https://gist.github.com/dfkaye/4e06eb749f878662e31a6cb019fbd650
// re-done in less than 30 minutes, this implementation makes more sense and
// works for arrays and objects...
// 19 September 2023
// dispatch propertychange event in deleteProperty handler
@dfkaye
dfkaye / onpropertychange-signal-v.3.js
Created November 29, 2023 23:15
onpropertychange signal v.3- sketch for form element nodes
// 17 September 2023
// onpropertychange signal v.3
// onpropertychange sketch for form element nodes
// cont'd from https://gist.github.com/dfkaye/d849596bdb9e926ad69ad38c974a4763
function N(node) {
var target = node;
@dfkaye
dfkaye / onpropertychange-signal-v.2.js
Created November 29, 2023 23:12
onpropertychange signal v.2 - implementation with proxied objects
// 16 september 2023
// onpropertychange signal v.2
// An implementation with proxied objects.
// cont'd from https://gist.github.com/dfkaye/619c5f31080fce2cd383ac966e132311
////////////////////////////////////////////////////////////////////////////////
// early afternoon
@dfkaye
dfkaye / onpropertychange-signal-v.1.js
Last active November 29, 2023 23:50
onpropertychange signal v.1 - using object descriptors
// 15 September 2023
// onpropertychange signal v.1
// This begins a 12-day odyssey in search of a successful implementation of the
// `onpropertychange` handler once supported by Internet Explorer in browser
// days of yore.
// cf. v.9 for the successful solution that solves both Object and EvenTarget,
// https://gist.github.com/dfkaye/2c7de4ba9bf7758f3c052378ce46219a
@dfkaye
dfkaye / this-inside-array-methods.js
Created November 29, 2023 23:08
value of `this` inside of array methods
// 5 September 2023
// `this` inside array methods
// Value of `this` inside array depends on whether `this` appears in function
// vs. constructor scope, and whether the iteration method calls a normal vs. an
// arrow function.
/*
scope | iterator
------------+------------
@dfkaye
dfkaye / strict-mode-and-destructuring-parameters.js
Created November 29, 2023 23:06
Note about strict mode and destructuring parameters.
// 30 August 2023
// Note about strict mode and destructuring parameters.
// Setting strict mode at the top of the console...
"use strict";
// ...makes the following assignment in the try block fail:
console.group("init");
@dfkaye
dfkaye / console.styled.js
Created November 29, 2023 23:05
using console parts to create styled output
// 29-30 August 2023
// console.styled.js
// Using console parts to create styled output.
// # Multiple output statements with `console.[method].apply`
// Usually we log console statements with any number of arguments.
console.log("one");
@dfkaye
dfkaye / find-bare-text-siblings-using-XPath.js
Created November 29, 2023 23:03
find bare text node siblings in DOM: XPath approach
// 5 September 2023
// Find uncontrolled or bare text node siblings in a DOM,
// XPath approach.
// SEE sketch 27 August 2023, Node iteration approach.
// https://gist.github.com/dfkaye/6cc8a9cda513dcf97f7a45ba89f4000b
// 6 September 2023
// I have to say,
// 1. Over all, this solution feels better than the node iteration version,
@dfkaye
dfkaye / find-bare-text-siblings-using-iteration.js
Last active November 29, 2023 23:04
find bare text node siblings in DOM: Node iteration approach
// 27 August 2023
// Find uncontrolled or bare text node siblings in a DOM,
// Node iteration approach.
// SEE sketch 5 September 2023, XPath approach.
// https://gist.github.com/dfkaye/6bf4fa391cec4e9a9c44cc05af504ae5
// There's no such official term for bare text nodes. I refer to a text node as
// "uncontrolled" or "bare" when it shares a parent with a sibling element or
// comment. Uncontrolled text nodes are slightly harder to update dynamically,
@dfkaye
dfkaye / update-shadowDOM-with-worker.js
Created November 29, 2023 22:57
attaching shadow DOM to a DIV with a SLOT, and driving changes from a Worker
// continued from https://gist.github.com/dfkaye/feab681496ac9fc8bc63e6b3006f796e
// 25 August 2023
// attaching shadow DOM to a built-in element:
// what are the implications?
/*************************** worker-driven version ****************************/
// This example uses a div with a slot and a worker that posts messages with
// data that is then written to the slot element.