@twobirds/microcomponents 0.0.31 → 0.0.33

package/src/test.ts

@@ -1,7 +1,8 @@
 "use strict";
 
 import { MC, DC, McEvent, defineCE, getCE, observe } from "./microcomponents.js";
-//import { MC, DC, McEvent } from "./MC.js";
+
+//import { MC, DC, typeof McEvent } from "./MC.js";
 //import { defineCE, getCE } from "./customElements.js";
 //import { observe } from "./customObservables.js";
 
@@ -20,9 +21,9 @@ class DeeplyNestedEvTarget extends MC {
 		super(target);
 	}
 
-	oneInit(ev: McEvent) {
+	oneInit(ev: typeof McEvent) {
 		let logger = this.target?.target?.target?._mc?.logger;
-		logger?.warn("DeeplyNestedEvTarget .oneInit(ev)", ev);
+		//logger?.warn("DeeplyNestedEvTarget .oneInit(ev)", ev);
 	}
 }
 
@@ -31,17 +32,17 @@ class EvTarget extends MC {
 		super(target);
 	}
 
-	onCustomEvent(ev: McEvent) {
+	onCustomEvent(ev: typeof McEvent) {
 		let logger = this.target?.target?._mc?.logger;
 		logger?.log("onCustomEvent", ev);
 	}
 
-	oneInit(ev: McEvent) {
+	oneInit(ev: typeof McEvent) {
 		let that = this,
 			_mc = that._mc!,
 			logger = this.target?.target?._mc?.logger;
 
-		logger?.warn("EvTarget .oneInit(ev)", ev);
+		//logger?.warn("EvTarget .oneInit(ev)", ev);
 
 		_mc.deeplyNestedEvTarget = new DeeplyNestedEvTarget( that );
 	}
@@ -108,19 +109,19 @@ defineCE(
 		web component specific event handlers
 		*/
 
-		onConnected(ev: McEvent) {
-			this.target._mc?.logger.info("onConnected handler", ev);
+		onConnected(ev: typeof McEvent) {
+			//this.target._mc?.logger.info("onConnected handler", ev);
 		}
 
-		onAttributeChanged(ev: McEvent) {
+		onAttributeChanged(ev: typeof McEvent) {
 			let logger = this.target._mc?.logger;
-			logger?.info("onAttributeChanged handler", ev);
+			//logger?.info("onAttributeChanged handler", ev);
 		}
 
 		/*
 		native event handlers
 		*/
-		oneClick(ev: McEvent) {
+		oneClick(ev: typeof McEvent) {
 			let logger = this.target._mc?.logger;
 
 			logger.info("oneClick handler", ev);
@@ -130,7 +131,7 @@ defineCE(
 			this.target.setAttribute("my-attribute", "testValue");
 		}
 
-		onClick(ev: McEvent) {
+		onClick(ev: typeof McEvent) {
 			let logger = this.target._mc?.logger;
 
 			logger?.info("onClick handler", ev);
@@ -141,13 +142,13 @@ defineCE(
 		/*
 		DC custom event handlers
 		*/
-		oneInit(ev: McEvent) {
+		oneInit(ev: typeof McEvent) {
 			let that = this,
 				_mc = that._mc;
 
 			let logger = that.target._mc.logger;
 
-			logger.warn("oneInit handler", ev);
+			//logger.warn("oneInit handler", ev);
 
 			// add a private event target
 			_mc.customEventTarget = new EvTarget(that);
@@ -160,10 +161,10 @@ defineCE(
 				logger.log("Counter has changed to: " + value);
 			});
 
-			logger.log("add 1,2,3 =", _mc.Adder.sum(1, 2, 3));
+			//logger.log("add 1,2,3 =", _mc.Adder.sum(1, 2, 3));
 		}
 
-		onDoSomething(ev: McEvent) {
+		onDoSomething(ev: typeof McEvent) {
 			let logger = this.target._mc?.logger;
 			logger?.log(".onDoSomething(ev): something done...", ev);
 		}
@@ -171,7 +172,27 @@ defineCE(
 	["my-attribute"]
 );
 
-let MyTag: CustomElementConstructor = getCE("my-tag")!;
+let MyTag: CustomElementConstructor = getCE("my-tag")!,
+	fragment = new DocumentFragment();
+
+// stress test
+console.time("Instancing");
+// create 1000 elements
+for ( let x = 0; x < 1000; x ++ ){
+	fragment.append( new MyTag("my-data") );
+}
+document.body.appendChild( fragment );
+
+console.log(
+	'%c \n\nStress Test:\n\n %cInstancing 1000 classes and putting them in the DOM took (ms):',
+	"font-weight: bold; color: black;",
+	"color: black;"
+);
+console.timeEnd("Instancing");
+
+document.querySelectorAll('my-tag').forEach( (e) => e.remove() );
+
+// and put them into thwe DOM
 
 document.body.appendChild( new MyTag("my-data") );