# HG changeset patch
# User cin
# Date 2021-02-05 17:25:05
# Node ID 0b9593714536028520171116aefd638c23b8c559
# Parent  0b41300b6dd9e4476c133c05648a68af7a89094f

Fixed startup of DjxWidgetBase to start inner widgets
added some traits to tsx/traits : destroy, emptyNode, startupWidgets

diff --git a/src/main/ts/dom-inject.ts b/src/main/ts/dom-inject.ts
--- a/src/main/ts/dom-inject.ts
+++ b/src/main/ts/dom-inject.ts
@@ -40,7 +40,7 @@ class DomInject {
 
             const noerr = on(node, "error", e => {
                 fail({
-                    erorr: e,
+                    error: e,
                     node
                 });
                 cleanup();
diff --git a/src/main/ts/tsx/DjxWidgetBase.ts b/src/main/ts/tsx/DjxWidgetBase.ts
--- a/src/main/ts/tsx/DjxWidgetBase.ts
+++ b/src/main/ts/tsx/DjxWidgetBase.ts
@@ -1,7 +1,7 @@
 import { djbase, djclass } from "../declare";
 import _WidgetBase = require("dijit/_WidgetBase");
 import _AttachMixin = require("dijit/_AttachMixin");
-import { BuildContext, isNode } from "./traits";
+import { BuildContext, isNode, startupWidgets } from "./traits";
 import registry = require("dijit/registry");
 
 // type Handle = dojo.Handle;
@@ -66,4 +66,12 @@ export abstract class DjxWidgetBase<Attr
         }
         return super._processTemplateNode(baseNode, getAttrFunc, attachFunc);
     }
+
+    /** Starts current widget and all its supporting widgets (placed outside
+     * `containerNode`) and child widgets (placed inside `containerNode`)*/
+    startup() {
+        // startup supporting widgets
+        startupWidgets(this.domNode, this.containerNode);
+        super.startup();
+    }
 }
diff --git a/src/main/ts/tsx/HtmlElementContext.ts b/src/main/ts/tsx/HtmlElementContext.ts
--- a/src/main/ts/tsx/HtmlElementContext.ts
+++ b/src/main/ts/tsx/HtmlElementContext.ts
@@ -1,8 +1,6 @@
 import dom = require("dojo/dom-construct");
-import attr = require("dojo/dom-attr");
 import { argumentNotEmptyString } from "@implab/core-amd/safe";
 import { BuildContextBase } from "./BuildContextBase";
-import registry = require("dijit/registry");
 
 export class HtmlElementContext extends BuildContextBase<HTMLElement> {
     elementType: string;
diff --git a/src/main/ts/tsx/traits.ts b/src/main/ts/tsx/traits.ts
--- a/src/main/ts/tsx/traits.ts
+++ b/src/main/ts/tsx/traits.ts
@@ -1,4 +1,8 @@
+import { IDestroyable } from "@implab/core-amd/interfaces";
+import { isDestroyable } from "@implab/core-amd/safe";
 import _WidgetBase = require("dijit/_WidgetBase");
+import registry = require("dijit/registry");
+import dom = require("dojo/dom-construct");
 
 type _WidgetBaseConstructor = typeof _WidgetBase;
 
@@ -10,6 +14,10 @@ export interface BuildContext<TNode exte
     placeAt(refNode: string | Node, position?: DojoNodePosition): void;
 }
 
+export interface IRecursivelyDestroyable {
+    destroyRecursive(): void;
+}
+
 export function isNode(el: any): el is Node {
     return el && el.nodeName && el.nodeType;
 }
@@ -71,3 +79,52 @@ export function isWidgetConstructor(v: a
 export function isInPage(node: Node) {
     return (node === document.body) ? false : document.body.contains(node);
 }
+
+export function isRecursivelyDestroyable(target: any): target is IRecursivelyDestroyable {
+    return target && typeof target.destroyRecursive === "function";
+}
+
+
+/** Destroys DOM Node with all contained widgets.
+ * If the specified node is the root node of a widget, then the
+ * widget will be destroyed.
+ *
+ * @param target DOM Node or widget to destroy
+ */
+export function destroy(target: Node | IDestroyable | IRecursivelyDestroyable) {
+    if (isRecursivelyDestroyable(target)) {
+        target.destroyRecursive();
+    } else if (isDestroyable(target)) {
+        target.destroy();
+    } else if (isNode(target)) {
+        const self = registry.byNode(target);
+        if (self) {
+            self.destroyRecursive();
+        } else {
+            registry.findWidgets(target).forEach(destroy);
+            dom.destroy(target);
+        }
+    }
+}
+
+/** Empties a content of the specified node and destroys all contained widgets.
+ *
+ * @param target DOM node to .
+ */
+export function emptyNode(target: Node) {
+    registry.findWidgets(target).forEach(destroy);
+    dom.empty(target);
+}
+
+/** This function starts all widgets inside the DOM node if the target is a node,
+ * or starts widget itself if the target is the widget.
+ * 
+ * @param target DOM node to find and start widgets or the widget itself.
+ */
+export function startupWidgets(target: Node | _WidgetBase, skipNode?: Node) {
+    if (isNode(target)) {
+        registry.findWidgets(target, skipNode).forEach(w => w.startup());
+    } else {
+        target.startup();
+    }
+}
\ No newline at end of file
diff --git a/src/main/typings/index.d.ts b/src/main/typings/index.d.ts
--- a/src/main/typings/index.d.ts
+++ b/src/main/typings/index.d.ts
@@ -14,7 +14,8 @@ declare namespace JSX {
 
         /** specifies handlers map for the events */
         "data-dojo-attach-event": string;
-        
+
+        /** @deprecated */
         [attr: string]: any;
     }
 
@@ -40,7 +41,23 @@ declare namespace JSX {
 
     type ElementAttrType<E, K extends keyof any> = K extends keyof E ? RecursivePartial<E[K]> : string;
 
-    type LaxElement<E extends object> = ExcludeMembers<Omit<E, "children">, (...args: any[]) => any> & DjxIntrinsicAttributes;
+
+    type ElementAttrNamesBlacklist = "children" | "getRootNode" | keyof EventTarget;
+
+    /** This type extracts keys of the specified parameter E by the following rule:
+     *  1. skips all ElementAttrNamesBlacklist
+     *  2. skips all methods except with the signature of event handlers
+     */
+    type AssignableElementAttrNames<E> = {
+        [K in keyof E]: K extends ElementAttrNamesBlacklist ? never :
+            ((evt: Event) => any) extends E[K] ? K :
+            E[K] extends ((...args: any[]) => any) ? never :
+            K;
+    }[keyof E];
+
+    type LaxElement<E extends object> =
+        Pick<E, AssignableElementAttrNames<E>> &
+        DjxIntrinsicAttributes;
 
     type LaxIntrinsicElementsMap = {
         [tag in keyof HTMLElementTagNameMap]: LaxElement<HTMLElementTagNameMap[tag]>