@domql/element 2.5.200 → 3.0.1

package/__tests__/throughUpdatedExec.test.js

@@ -0,0 +1,110 @@
+import { throughUpdatedExec } from '../iterate'
+
+describe('throughUpdatedExec', () => {
+  let element, ref
+
+  beforeEach(() => {
+    ref = {
+      __exec: {},
+      __defineCache: {}
+    }
+    element = {
+      __ref: ref,
+      state: { testState: true },
+      context: { testContext: true }
+    }
+  })
+
+  it('should skip execution for params in __defineCache', () => {
+    ref.__defineCache.cachedParam = true
+    ref.__exec.cachedParam = () => 'should not execute'
+    element.cachedParam = 'original'
+
+    const changes = throughUpdatedExec(element)
+
+    expect(element.cachedParam).toBe('original')
+    expect(changes).toEqual({})
+  })
+
+  it('should update element properties when newExec differs from current value', () => {
+    ref.__exec.testParam = () => 'new value'
+    element.testParam = 'old value'
+
+    const changes = throughUpdatedExec(element)
+
+    expect(element.testParam).toBe('new value')
+    expect(changes).toEqual({ testParam: 'old value' })
+  })
+
+  it('should overwrite text property for nodes when exec returns string or number', () => {
+    const node = { node: true, text: 'old text' }
+    ref.__exec.testParam = () => 'new text'
+    element.testParam = node
+
+    const changes = throughUpdatedExec(element)
+
+    expect(element.testParam.text).toBe('new text')
+    expect(changes).toEqual({})
+  })
+
+  it('should handle component naming matches and overwrite with context component', () => {
+    const contextComponent = { extends: 'Component', prop: 'value' }
+    element.context.components = { TestComponent: contextComponent }
+    ref.__exec.TestComponent = () => contextComponent
+    element.TestComponent = { oldProp: 'oldValue' }
+
+    const changes = throughUpdatedExec(element)
+
+    expect(element.TestComponent).toEqual({
+      oldProp: 'oldValue',
+      prop: 'value'
+    })
+    expect(changes).toEqual({})
+  })
+
+  it('should not update element properties when newExec matches current value', () => {
+    ref.__exec.testParam = () => 'same value'
+    element.testParam = 'same value'
+
+    const changes = throughUpdatedExec(element)
+
+    expect(element.testParam).toBe('same value')
+    expect(changes).toEqual({})
+  })
+
+  it('should handle non-string/non-number exec returns for non-node properties', () => {
+    const newValue = { complex: 'object' }
+    ref.__exec.testParam = () => newValue
+    element.testParam = 'old value'
+
+    const changes = throughUpdatedExec(element)
+
+    expect(element.testParam).toBe(newValue)
+    expect(changes).toEqual({ testParam: 'old value' })
+  })
+
+  it('should return an empty changes object when no updates occur', () => {
+    ref.__exec.testParam = () => 'same value'
+    element.testParam = 'same value'
+
+    const changes = throughUpdatedExec(element)
+
+    expect(changes).toEqual({})
+  })
+
+  it('should handle multiple properties and return correct changes', () => {
+    ref.__exec.param1 = () => 'new value 1'
+    ref.__exec.param2 = () => 'new value 2'
+    element.param1 = 'old value 1'
+    element.param2 = 'old value 2'
+
+    const changes = throughUpdatedExec(element)
+
+    expect(element.param1).toBe('new value 1')
+    expect(element.param2).toBe('new value 2')
+    expect(changes).toEqual({
+      param1: 'old value 1',
+      param2: 'old value 2'
+    })
+  })
+})

package/__tests__/tree.test.js

@@ -0,0 +1,15 @@
+import { ROOT, TREE } from '../tree'
+
+describe('ROOT/TREE initialization and report()', () => {
+  // Test 1: ROOT object structure
+  it('initializes ROOT with :root key and document.body node', () => {
+    expect(ROOT.key).toBe(':root')
+    expect(ROOT.node).toBe(document.body) // Works in JSDOM
+  })
+
+  // Test 2: TREE === ROOT
+  it('assigns TREE to reference ROOT', () => {
+    expect(TREE).toBe(ROOT)
+    expect(TREE.node).toBe(document.body)
+  })
+})

package/__tests__/update.test.js

@@ -0,0 +1,253 @@
+import { update } from '../update'
+
+describe('update()', () => {
+  let element, params, opts
+
+  beforeEach(() => {
+    element = {
+      __ref: {
+        __execProps: {},
+        __exec: {},
+        __defineCache: {},
+        __props: [],
+        __state: 'state'
+      },
+      state: 'string',
+      props: {},
+      parent: {
+        props: {}
+      },
+      define: {},
+      node: document.createElement('div'),
+      key: 'testElement',
+      on: {},
+      update
+    }
+    opts = {
+      preventUpdate: [],
+      preventDefineUpdate: [],
+      preventBeforeStateUpdateListener: false,
+      preventListeners: false,
+      preventStateUpdateListener: false
+    }
+    params = {}
+  })
+
+  it('does not modify opts when params and opts are empty', async () => {
+    await element.update({}, opts)
+    expect(opts).toEqual({
+      calleeElement: false,
+      cleanExec: true,
+      currentSnapshot: false,
+      exclude: [],
+      preventRecursive: false,
+      stackChanges: false,
+      preventUpdate: [],
+      preventDefineUpdate: [],
+      preventBeforeStateUpdateListener: false,
+      preventListeners: false,
+      preventStateUpdateListener: false
+    })
+  })
+
+  it('initializes options with UPDATE_DEFAULT_OPTIONS when opts is empty', async () => {
+    await element.update({}, opts)
+    expect(opts.calleeElement).toBe(false) // Ensure opts is not mutated
+    expect(element.__ref).toBeDefined() // Ensure __ref is initialized
+  })
+
+  it('merges opts with UPDATE_DEFAULT_OPTIONS using deepMerge', async () => {
+    opts.customOption = true
+    await element.update({}, opts)
+    expect(opts.customOption).toBe(true) // Ensure custom options are preserved
+  })
+
+  it('converts string params to { text: params }', async () => {
+    await element.update('testString', opts)
+    expect(element.text).toBe('testString')
+  })
+
+  it('converts number params to { text: params }', async () => {
+    await element.update(123, opts)
+    expect(element.text).toBe(123)
+  })
+
+  it('returns early if preventInheritAtCurrentState matches element', async () => {
+    opts.preventInheritAtCurrentState = { __element: element }
+    await element.update({}, opts)
+    expect(element.__ref.__currentSnapshot).toBe(6) // No snapshot update
+  })
+
+  it('initializes __ref if not present', async () => {
+    delete element.__ref
+    await element.update({}, opts)
+    expect(element.__ref).toBeDefined()
+  })
+
+  it('merges options with UPDATE_DEFAULT_OPTIONS when exclude is missing', async () => {
+    await element.update({}, opts)
+    expect(opts.exclude).toBeDefined() // Ensure exclude is added
+  })
+
+  it('does not throw or modify opts when params is undefined', async () => {
+    await element.update(undefined, opts)
+    expect(opts).toEqual({
+      calleeElement: false,
+      cleanExec: true,
+      currentSnapshot: false,
+      exclude: [],
+      preventRecursive: false,
+      preventUpdate: [],
+      preventDefineUpdate: [],
+      stackChanges: false,
+      preventBeforeStateUpdateListener: false,
+      preventListeners: false,
+      preventStateUpdateListener: false
+    })
+  })
+
+  it('does not throw when opts is undefined', async () => {
+    await element.update({}, undefined)
+    expect(element.__ref).toBeDefined() // Ensure __ref is initialized
+  })
+
+  it('does not throw when opts is null', async () => {
+    await element.update({}, null)
+    expect(element.__ref).toBeDefined() // Ensure __ref is initialized
+  })
+
+  it('does not modify the params object', async () => {
+    params = { key: 'value' }
+    await element.update(params, opts)
+    expect(params).toEqual({ key: 'value' })
+  })
+
+  it('does modify opts when params is an empty object', async () => {
+    await element.update({}, opts)
+    expect(opts).toEqual({
+      calleeElement: false,
+      cleanExec: true,
+      currentSnapshot: false,
+      exclude: [],
+      preventRecursive: false,
+      stackChanges: false,
+      preventUpdate: [],
+      preventDefineUpdate: [],
+      preventBeforeStateUpdateListener: false,
+      preventListeners: false,
+      preventStateUpdateListener: false
+    })
+  })
+
+  it('moves regular properties to element.props', async () => {
+    params = { props: { title: 'Test', description: 'Content' } }
+    await element.update(params, opts)
+    expect(element.props).toEqual({
+      title: 'Test',
+      description: 'Content'
+    })
+    expect(element.title).toBeUndefined()
+  })
+
+  it('keeps element-rooted properties', async () => {
+    params = { Header: {}, Footer: {}, 0: 'index' }
+    await element.update(params, opts)
+    expect(element.Header).toBeDefined()
+    expect(element.Footer).toBeDefined()
+    expect(element['0']).toBe('index')
+    expect(element.props).toEqual({})
+  })
+
+  it('preserves built-in properties on element', async () => {
+    params = { props: { className: 'container', hidden: true } }
+    await element.update(params, opts)
+    expect(element.props.className).toBe('container')
+    expect(element.props.hidden).toBe(true)
+    expect(element.props).toEqual({ className: 'container', hidden: true })
+  })
+
+  it('moves element-like properties from props to root', async () => {
+    params = { props: { Header: {} } }
+    await element.update(params, opts)
+    expect(element.Header).toBeDefined()
+    expect(element.props.Header).toBeUndefined()
+  })
+
+  it('exits early when inheritStateUpdates returns false', async () => {
+    // Simulate inheritStateUpdates failure
+    element.__ref.__stateBlocked = true
+    await element.update({ props: { shouldChange: true } }, opts)
+
+    expect(element.props.shouldChange).toBe(true)
+    expect(element.__ref.__stateBlocked).toBe(true) // State remains blocked
+  })
+
+  it('exits early when checkIfOnUpdate fails', async () => {
+    // Force checkIfOnUpdate failure
+    element.parent.props.ifCondition = false
+    await element.update({ state: { newState: true } }, opts)
+
+    expect(element.state.newState).toBe(true)
+  })
+
+  it('updates props from parent key match', async () => {
+    element.parent.props.testKey = { inherited: true }
+    await element.update({}, opts)
+    expect(element.props.inherited).toBeUndefined()
+  })
+
+  it('updates props when functions exist in __props', async () => {
+    element.__ref.__props.push(() => 'dynamic')
+    await element.update({}, opts)
+    expect(element.props).toEqual(expect.any(Object)) // Props were processed
+  })
+
+  it('skips props update when preventPropsUpdate=true', async () => {
+    opts.preventPropsUpdate = true
+    opts.preventUpdateAfter = true
+    element.parent.props.testKey = { shouldExist: true }
+    await element.update({}, opts)
+    expect(element.props.shouldExist).toBeUndefined()
+  })
+
+  it('should not skips props update when preventPropsUpdate=false', async () => {
+    opts.preventPropsUpdate = false
+    opts.lazyLoad = true
+    opts.onEachUpdate = () => {
+      return true
+    }
+    element.parent.props.testKey = { shouldExist: true }
+    element.__ref.__propsStack = []
+    element.__ref.__if = true
+    element.off = { text: 'off' }
+    await element.update({}, opts)
+    expect(element.props.shouldExist).toBeUndefined()
+  })
+
+  it('should set preventUpdateAfterCount to 1 when is not a number', async () => {
+    opts.preventPropsUpdate = true
+    opts.preventUpdateAfter = 2
+    opts.preventUpdateAfterCount = undefined
+    element.parent.props.testKey = { shouldExist: true }
+    await element.update({}, opts)
+    expect(element.props.shouldExist).toBeUndefined()
+  })
+
+  it('returns element when beforeUpdate rejects', async () => {
+    // Simulate beforeUpdate rejection
+    element.props.onBeforeUpdate = () => false
+    const result = await element.update({}, opts)
+    expect(result).toBe(element)
+  })
+
+  it('processes parent.childProps', async () => {
+    element.parent.props.childProps = { global: true }
+    await element.update({}, opts)
+    expect(element.props.global).toBeUndefined()
+  })
+
+  it('processes function props', async () => {
+    await element.update({ props: { calc: () => 42 } }, opts)
+    expect(element.props.calc()).toBe(42)
+  })
+})

package/children.js

@@ -0,0 +1,105 @@
+'use strict'
+
+import {
+  concatAddExtends,
+  deepClone,
+  execPromise,
+  getChildStateInKey,
+  isArray,
+  isDefined,
+  isNot,
+  isNumber,
+  isObject,
+  isObjectLike,
+  isState,
+  isString,
+  matchesComponentNaming
+} from '@domql/utils'
+
+/**
+ * Apply data parameters on the DOM nodes
+ * this should only work if `showOnNode: true` is passed
+ */
+export async function setChildren (param, element, opts) {
+  let { children, __ref: ref, state } = element
+
+  let { childrenAs } = element.props || {}
+  children =
+    (await execPromise(param, element, state)) ||
+    (await execPromise(children, element, state))
+
+  if (children) {
+    if (isState(children)) children = children.parse()
+
+    if (isString(children) || isNumber(children)) {
+      if (children === 'state') children = state.parse()
+      else {
+        const pathInState = getChildStateInKey(children, state)
+        if (pathInState) {
+          childrenAs = 'state'
+          children = getChildStateInKey(children, state) || { value: children }
+        } else {
+          children = { text: children }
+        }
+      }
+    }
+
+    if (isObject(children)) {
+      if (children.$$typeof) {
+        return element.call('renderReact', children, element)
+      }
+      children = Object.keys(children).map(v => {
+        const val = children[v]
+        if (matchesComponentNaming(v)) return concatAddExtends(v, val)
+        return val
+      })
+    }
+  }
+
+  if (!children || isNot(children)('array', 'object')) return
+
+  if (isArray(children) && children.find(v => v?.$$typeof)) {
+    const filterReact = children.filter(v => !v?.$$typeof)
+    if (filterReact.length !== children.length) {
+      const extractedReactComponents = children.filter(v => v?.$$typeof)
+      element.call('renderReact', extractedReactComponents, element)
+    }
+    children = filterReact
+  }
+
+  if (ref.__childrenCache) {
+    const equals =
+      JSON.stringify(children) === JSON.stringify(ref.__childrenCache) // make smarter diff
+    if (equals) {
+      ref.__noChildrenDifference = true
+    } else {
+      ref.__childrenCache = deepClone(children)
+      delete ref.__noChildrenDifference
+    }
+  } else {
+    ref.__childrenCache = deepClone(children)
+  }
+
+  if (isObject(children) || isArray(children)) {
+    children = deepClone(children)
+  }
+
+  const content = { tag: 'fragment' }
+
+  for (const key in children) {
+    const value = Object.hasOwnProperty.call(children, key) && children[key]
+    if (isDefined(value) && value !== null && value !== false) {
+      content[key] = isObjectLike(value)
+        ? childrenAs
+          ? { [childrenAs]: value }
+          : value
+        : childrenAs
+        ? { [childrenAs]: childrenAs === 'state' ? { value } : { text: value } }
+        : { text: value }
+    }
+  }
+
+  return content
+}
+
+export default setChildren