alchemy-widget 0.1.2 → 0.1.3

package/CHANGELOG.md

@@ -1,3 +1,7 @@
+## 0.1.3 (2022-03-21)
+
+* Catch and print errors when appending a widget to a container
+
 ## 0.1.2 (2022-02-20)
 
 * Add `table-of-contents` element and widget

package/element/10-container_elements.js

@@ -179,15 +179,26 @@ AlchemyWidgets.setMethod(function clear() {
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
- * @version  0.1.0
+ * @version  0.1.3
  *
  * @param    {String}   type
  * @param    {Object}   config
  */
 AlchemyWidgets.setMethod(function addWidget(type, config) {
 
+	let instance;
+
 	// Create the instance of the widget
-	let instance = this.instance.createChildWidget(type, config);
+	try {
+		instance = this.instance.createChildWidget(type, config);
+	} catch (err) {
+		config = {
+			original_config : config,
+			html            : '<pre>' + err.message + '\n' + err.stack + '</pre>',
+		};
+
+		instance = this.instance.createChildWidget('html', config);
+	}
 
 	// Attach the renderer
 	instance.hawkejs_renderer = this.hawkejs_renderer;

package/element/table_of_contents_element.js

@@ -1,193 +1,193 @@
-/**
- * The table-of-contents element
- *
- * @author   Jelle De Loecker   <jelle@elevenways.be>
- * @since    0.1.2
- * @version  0.1.2
- */
-const TableOfContents = Function.inherits('Alchemy.Element.App', 'TableOfContents');
-
-/**
- * The template to use for the content of this element
- *
- * @author   Jelle De Loecker   <jelle@elevenways.be>
- * @since    0.1.2
- * @version  0.1.2
- */
-TableOfContents.setTemplateFile('elements/table_of_contents');
-
-/**
- * Set the content
- *
- * @author   Jelle De Loecker   <jelle@elevenways.be>
- * @since    0.1.2
- * @version  0.1.2
- */
-TableOfContents.setAssignedProperty('content');
-
-/**
- * The role of this element
- *
- * @author   Jelle De Loecker   <jelle@elevenways.be>
- * @since    0.1.2
- * @version  0.1.2
- */
-TableOfContents.setRole('navigation');
-
-/**
- * The parent query
- *
- * @author   Jelle De Loecker   <jelle@elevenways.be>
- * @since    0.1.2
- * @version  0.1.2
- */
-TableOfContents.setAttribute('parent-selector');
-
-/**
- * The children query
- *
- * @author   Jelle De Loecker   <jelle@elevenways.be>
- * @since    0.1.2
- * @version  0.1.2
- */
-TableOfContents.setAttribute('children-selector');
-
-/**
- * The elements query
- *
- * @author   Jelle De Loecker   <jelle@elevenways.be>
- * @since    0.1.2
- * @version  0.1.2
- */
-TableOfContents.setAttribute('elements-selector');
-
-/**
- * The elements query
- *
- * @author   Jelle De Loecker   <jelle@elevenways.be>
- * @since    0.1.2
- * @version  0.1.2
- */
-TableOfContents.setAttribute('title-selector');
-
-/**
- * The class to add when intersecting (visible)
- *
- * @author   Jelle De Loecker   <jelle@elevenways.be>
- * @since    0.1.2
- * @version  0.1.2
- */
-TableOfContents.setAttribute('intersection-class');
-
-/**
- * Get the entries
- *
- * @author   Jelle De Loecker   <jelle@elevenways.be>
- * @since    0.1.2
- * @version  0.1.2
- */
-TableOfContents.setProperty(function entries() {
-
-	let result = [],
-		parent = this.parentElement,
-		wrapper;
-
-	if (this.parent_selector) {
-		parent = this.queryParents(this.parent_selector);
-	}
-
-	if (parent) {
-		wrapper = parent;
-	}
-
-	if (wrapper && this.children_selector) {
-		wrapper = wrapper.querySelector(this.children_selector);
-	}
-
-	if (wrapper) {
-		let elements = wrapper.querySelectorAll(this.elements_selector || 'h1,h2'),
-			element,
-			title,
-			i;
-
-		for (i = 0; i < elements.length; i++) {
-			element = elements[i];
-
-			if (!element.id) {
-
-				if (element.hawkejs_id) {
-					element.id = element.hawkejs_id;
-				}
-
-				if (!element.id) {
-					continue;
-				}
-			}
-
-			let title_element;
-
-			if (this.title_selector) {
-				title_element = element.querySelector(this.title_selector);
-			}
-
-			if (!title_element) {
-				title_element = element;
-			}
-
-			title = (title_element.toc_title || title_element.textContent || '').trim();
-
-			title = title.truncate(30);
-
-			// Don't add empty titles
-			if (!title) {
-				continue;
-			}
-
-			result.push({
-				id      : element.id,
-				title   : title,
-				element : element,
-			});
-		}
-	}
-
-	return result;
-});
-
-/**
- * Added to the dom for the first time
- *
- * @author   Jelle De Loecker   <jelle@elevenways.be>
- * @since    0.1.2
- * @version  0.1.2
- */
-TableOfContents.setMethod(async function introduced() {
-
-	await this.rerender();
-
-	const observer = new IntersectionObserver(entries => {
-
-		let class_name = this.intersection_class || 'visible';
-
-		for (let entry of entries) {
-			const id = entry.target.getAttribute('id');
-
-			let query = `a[href="#${id}"]`,
-			    element = this.querySelector(query);
-			
-			if (!element) {
-				return;
-			}
-
-			if (entry.intersectionRatio > 0) {
-				element.classList.add(class_name);
-			} else {
-				element.classList.remove(class_name);
-			}
-		};
-	});
-
-	for (let entry of this.entries) {
-		observer.observe(entry.element);
-	}
+/**
+ * The table-of-contents element
+ *
+ * @author   Jelle De Loecker   <jelle@elevenways.be>
+ * @since    0.1.2
+ * @version  0.1.2
+ */
+const TableOfContents = Function.inherits('Alchemy.Element.App', 'TableOfContents');
+
+/**
+ * The template to use for the content of this element
+ *
+ * @author   Jelle De Loecker   <jelle@elevenways.be>
+ * @since    0.1.2
+ * @version  0.1.2
+ */
+TableOfContents.setTemplateFile('elements/table_of_contents');
+
+/**
+ * Set the content
+ *
+ * @author   Jelle De Loecker   <jelle@elevenways.be>
+ * @since    0.1.2
+ * @version  0.1.2
+ */
+TableOfContents.setAssignedProperty('content');
+
+/**
+ * The role of this element
+ *
+ * @author   Jelle De Loecker   <jelle@elevenways.be>
+ * @since    0.1.2
+ * @version  0.1.2
+ */
+TableOfContents.setRole('navigation');
+
+/**
+ * The parent query
+ *
+ * @author   Jelle De Loecker   <jelle@elevenways.be>
+ * @since    0.1.2
+ * @version  0.1.2
+ */
+TableOfContents.setAttribute('parent-selector');
+
+/**
+ * The children query
+ *
+ * @author   Jelle De Loecker   <jelle@elevenways.be>
+ * @since    0.1.2
+ * @version  0.1.2
+ */
+TableOfContents.setAttribute('children-selector');
+
+/**
+ * The elements query
+ *
+ * @author   Jelle De Loecker   <jelle@elevenways.be>
+ * @since    0.1.2
+ * @version  0.1.2
+ */
+TableOfContents.setAttribute('elements-selector');
+
+/**
+ * The elements query
+ *
+ * @author   Jelle De Loecker   <jelle@elevenways.be>
+ * @since    0.1.2
+ * @version  0.1.2
+ */
+TableOfContents.setAttribute('title-selector');
+
+/**
+ * The class to add when intersecting (visible)
+ *
+ * @author   Jelle De Loecker   <jelle@elevenways.be>
+ * @since    0.1.2
+ * @version  0.1.2
+ */
+TableOfContents.setAttribute('intersection-class');
+
+/**
+ * Get the entries
+ *
+ * @author   Jelle De Loecker   <jelle@elevenways.be>
+ * @since    0.1.2
+ * @version  0.1.2
+ */
+TableOfContents.setProperty(function entries() {
+
+	let result = [],
+		parent = this.parentElement,
+		wrapper;
+
+	if (this.parent_selector) {
+		parent = this.queryParents(this.parent_selector);
+	}
+
+	if (parent) {
+		wrapper = parent;
+	}
+
+	if (wrapper && this.children_selector) {
+		wrapper = wrapper.querySelector(this.children_selector);
+	}
+
+	if (wrapper) {
+		let elements = wrapper.querySelectorAll(this.elements_selector || 'h1,h2'),
+			element,
+			title,
+			i;
+
+		for (i = 0; i < elements.length; i++) {
+			element = elements[i];
+
+			if (!element.id) {
+
+				if (element.hawkejs_id) {
+					element.id = element.hawkejs_id;
+				}
+
+				if (!element.id) {
+					continue;
+				}
+			}
+
+			let title_element;
+
+			if (this.title_selector) {
+				title_element = element.querySelector(this.title_selector);
+			}
+
+			if (!title_element) {
+				title_element = element;
+			}
+
+			title = (title_element.toc_title || title_element.textContent || '').trim();
+
+			title = title.truncate(30);
+
+			// Don't add empty titles
+			if (!title) {
+				continue;
+			}
+
+			result.push({
+				id      : element.id,
+				title   : title,
+				element : element,
+			});
+		}
+	}
+
+	return result;
+});
+
+/**
+ * Added to the dom for the first time
+ *
+ * @author   Jelle De Loecker   <jelle@elevenways.be>
+ * @since    0.1.2
+ * @version  0.1.2
+ */
+TableOfContents.setMethod(async function introduced() {
+
+	await this.rerender();
+
+	const observer = new IntersectionObserver(entries => {
+
+		let class_name = this.intersection_class || 'visible';
+
+		for (let entry of entries) {
+			const id = entry.target.getAttribute('id');
+
+			let query = `a[href="#${id}"]`,
+			    element = this.querySelector(query);
+			
+			if (!element) {
+				return;
+			}
+
+			if (entry.intersectionRatio > 0) {
+				element.classList.add(class_name);
+			} else {
+				element.classList.remove(class_name);
+			}
+		};
+	});
+
+	for (let entry of this.entries) {
+		observer.observe(entry.element);
+	}
 });

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "alchemy-widget",
 	"description": "The widget plugin for the AlchemyMVC",
-	"version": "0.1.2",
+	"version": "0.1.3",
 	"author": "Jelle De Loecker <jelle@elevenways.be>",
 	"keywords": [
 		"alchemy",