@domql/element 2.5.118 → 2.5.121

package/create.js

@@ -35,6 +35,7 @@ import {
   applyVariant,
   checkIfKeyIsComponent,
   createValidDomqlObjectFromSugar,
+  detectInfiniteLoop,
   isVariant
 } from './utils/component'
 
@@ -46,8 +47,6 @@ const ENV = process.env.NODE_ENV
 const create = (element, parent, key, options = OPTIONS.create || {}, attachOptions) => {
   cacheOptions(element, options)
 
-  // if (key === 'Title') debugger
-
   // if element is STRING
   if (checkIfPrimitive(element)) {
     element = applyValueAsText(element, parent, key)
@@ -212,12 +211,22 @@ const addElementIntoParentChildren = (element, parent) => {
   if (parent.__ref && parent.__ref.__children) parent.__ref.__children.push(element.key)
 }
 
+const visitedElements = new WeakMap()
 const renderElement = (element, parent, options, attachOptions) => {
+  if (visitedElements.has(element)) {
+    if (ENV === 'test' || ENV === 'development') console.warn('Cyclic rendering detected:', element.__ref.__path)
+  }
+
+  visitedElements.set(element, true)
+
   const { __ref: ref, key } = element
 
   // CREATE a real NODE
   try {
+    const isInfiniteLoopDetected = detectInfiniteLoop(ref.__path)
+    if (ref.__uniqId || isInfiniteLoopDetected) return
     createNode(element, options)
+    ref.__uniqId = Math.random()
   } catch (e) {
     if (ENV === 'test' || ENV === 'development') console.warn(element, e)
   }

package/dist/cjs/create.js

@@ -167,10 +167,20 @@ const addElementIntoParentChildren = (element, parent) => {
   if (parent.__ref && parent.__ref.__children)
     parent.__ref.__children.push(element.key);
 };
+const visitedElements = /* @__PURE__ */ new WeakMap();
 const renderElement = (element, parent, options, attachOptions) => {
+  if (visitedElements.has(element)) {
+    if (ENV === "test" || ENV === "development")
+      console.warn("Cyclic rendering detected:", element.__ref.__path);
+  }
+  visitedElements.set(element, true);
   const { __ref: ref, key } = element;
   try {
+    const isInfiniteLoopDetected = (0, import_component.detectInfiniteLoop)(ref.__path);
+    if (ref.__uniqId || isInfiniteLoopDetected)
+      return;
     (0, import_node.default)(element, options);
+    ref.__uniqId = Math.random();
   } catch (e) {
     if (ENV === "test" || ENV === "development")
       console.warn(element, e);

package/dist/cjs/node.js

@@ -78,7 +78,9 @@ const createNode = (element, options) => {
     if (isElement) {
       const { hasDefine, hasContextDefine } = isElement;
       if (element[param] && !hasDefine && !hasContextDefine) {
-        const createAsync = () => (0, import_create.default)((0, import_utils.exec)(value, element), element, param, options);
+        const createAsync = () => {
+          (0, import_create.default)((0, import_utils.exec)(value, element), element, param, options);
+        };
         if (element.props && element.props.lazyLoad || options.lazyLoad) {
           window.requestAnimationFrame(() => createAsync());
         } else

package/dist/cjs/utils/component.js

@@ -25,6 +25,7 @@ __export(component_exports, {
   checkIfKeyIsComponent: () => checkIfKeyIsComponent,
   checkIfKeyIsProperty: () => checkIfKeyIsProperty,
   createValidDomqlObjectFromSugar: () => createValidDomqlObjectFromSugar,
+  detectInfiniteLoop: () => detectInfiniteLoop,
   extendizeByKey: () => extendizeByKey,
   hasVariantProp: () => hasVariantProp,
   isVariant: () => isVariant,
@@ -174,3 +175,26 @@ const applyVariant = (element) => {
   });
   return element;
 };
+const detectInfiniteLoop = (arr) => {
+  const maxRepeats = 10;
+  let pattern = [];
+  let repeatCount = 0;
+  for (let i = 0; i < arr.length; i++) {
+    if (pattern.length < 2) {
+      pattern.push(arr[i]);
+    } else {
+      if (arr[i] === pattern[i % 2]) {
+        repeatCount++;
+      } else {
+        pattern = [arr[i - 1], arr[i]];
+        repeatCount = 1;
+      }
+      if (repeatCount >= maxRepeats * 2) {
+        if (ENV === "test" || ENV === "development") {
+          console.warn("Warning: Potential infinite loop detected due to repeated sequence:", pattern);
+        }
+        return true;
+      }
+    }
+  }
+};

package/node.js

@@ -73,7 +73,9 @@ export const createNode = (element, options) => {
     if (isElement) {
       const { hasDefine, hasContextDefine } = isElement
       if (element[param] && !hasDefine && !hasContextDefine) {
-        const createAsync = () => create(exec(value, element), element, param, options)
+        const createAsync = () => {
+          create(exec(value, element), element, param, options)
+        }
 
         if ((element.props && element.props.lazyLoad) || options.lazyLoad) {
           window.requestAnimationFrame(() => createAsync())

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@domql/element",
-  "version": "2.5.118",
+  "version": "2.5.121",
   "license": "MIT",
   "type": "module",
   "module": "index.js",
@@ -31,7 +31,7 @@
     "@domql/state": "latest",
     "@domql/utils": "latest"
   },
-  "gitHead": "984906ba70b23710f6f1a1895b41b4e8710e4c3d",
+  "gitHead": "5130bdaa1358d22df75746616dd3387b8a56b55b",
   "devDependencies": {
     "@babel/core": "^7.12.0"
   }

package/props/create.js

@@ -51,10 +51,6 @@ export const syncProps = (props, element) => {
 export const createProps = function (element, parent, cached) {
   const { __ref: ref } = element
 
-  // if (element.parent.key === '0' && element.key === 'editor') {
-  //   debugger
-  // }
-
   const applyProps = () => {
     const propsStack = cached || createPropsStack(element, parent)
     if (propsStack.length) {

package/update.js

@@ -82,7 +82,6 @@ const update = function (params = {}, opts = UPDATE_DEFAULT_OPTIONS) {
 
   const overwriteChanges = overwriteDeep(element, params, METHODS_EXL)
   const execChanges = throughUpdatedExec(element, { ignore: UPDATE_DEFAULT_OPTIONS })
-  // if (element.key === 'Navigation') debugger
   const definedChanges = throughUpdatedDefine(element)
 
   if (!options.isForced && !options.preventListeners) {

package/utils/component.js

@@ -165,3 +165,33 @@ export const applyVariant = (element) => {
 
   return element
 }
+
+export const detectInfiniteLoop = arr => {
+  const maxRepeats = 10 // Maximum allowed repetitions
+  let pattern = []
+  let repeatCount = 0
+
+  for (let i = 0; i < arr.length; i++) {
+    if (pattern.length < 2) {
+      // Build the initial pattern with two consecutive elements
+      pattern.push(arr[i])
+    } else {
+      // Check if the current element follows the repeating pattern
+      if (arr[i] === pattern[i % 2]) {
+        repeatCount++
+      } else {
+        // If there's a mismatch, reset the pattern and repeat counter
+        pattern = [arr[i - 1], arr[i]]
+        repeatCount = 1 // Reset to 1 because we start a new potential pattern
+      }
+
+      // If the pattern repeats more than `maxRepeats`, throw a warning
+      if (repeatCount >= maxRepeats * 2) {
+        if (ENV === 'test' || ENV === 'development') {
+          console.warn('Warning: Potential infinite loop detected due to repeated sequence:', pattern)
+        }
+        return true
+      }
+    }
+  }
+}