Add evented Node handler to meta

src/NodeHandler.ts

@@ -39,7 +39,7 @@ export class NodeHandler extends Evented implements NodeHandlerInterface {
 		this.emit({ type: NodeEventType.Widget });
 	}
 
-	public addProjector(element: HTMLElement, properties: VNodeProperties): void {
+	public addProjector(): void {
 		this.emit({ type: NodeEventType.Projector });
 	}
 

src/WidgetBase.ts

@@ -22,8 +22,7 @@ import {
 	WidgetMetaConstructor,
 	WidgetBaseConstructor,
 	WidgetBaseInterface,
-	WidgetProperties,
-	ProjectorRenderedEvent
+	WidgetProperties
 } from './interfaces';
 import RegistryHandler from './RegistryHandler';
 import NodeHandler from './NodeHandler';
@@ -102,16 +101,6 @@ export function diffProperty(propertyName: string, diffFunction: DiffPropertyFun
 	});
 }
 
-/**
- * WeakMap containing the current root node number
- */
-export const currentRootNodeMap = new WeakMap<WidgetBase, number>();
-
-/**
- * Weakmap containing the number of root nodes
- */
-export const numRootNodesMap = new WeakMap<WidgetBase, number>();
-
 /**
  * Generic decorator handler to take care of whether or not the decorator was called at the class level
  * or the method level.
@@ -200,6 +189,9 @@ export class WidgetBase<P = WidgetProperties, C extends DNode = DNode> extends E
 
 	private _projectorAttachEvent: Handle;
 
+	private _currentRootNode = 0;
+	private _numRootNodes = 0;
+
 	/**
 	 * @constructor
 	 */
@@ -251,7 +243,7 @@ export class WidgetBase<P = WidgetProperties, C extends DNode = DNode> extends E
 		this.onElementCreated(element, String(properties.key));
 	}
 
-	protected afterRootCreateCallback(
+	private afterRootCreateCallback(
 		element: HTMLElement,
 		projectionOptions: ProjectionOptions,
 		vnodeSelector: string,
@@ -274,7 +266,7 @@ export class WidgetBase<P = WidgetProperties, C extends DNode = DNode> extends E
 		this.onElementUpdated(element, String(properties.key));
 	}
 
-	protected afterRootUpdateCallback(
+	private afterRootUpdateCallback(
 		element: HTMLElement,
 		projectionOptions: ProjectionOptions,
 		vnodeSelector: string,
@@ -285,18 +277,13 @@ export class WidgetBase<P = WidgetProperties, C extends DNode = DNode> extends E
 	}
 
 	private _addElementToNodeHandler(element: HTMLElement, projectionOptions: ProjectionOptions, properties: VNodeProperties) {
-		let currentRootNode = currentRootNodeMap.get(this) || 0;
-		const numRootNodes = numRootNodesMap.get(this);
-
-		currentRootNode += 1;
-		currentRootNodeMap.set(this, currentRootNode);
-		const isLastRootNode = (currentRootNode === numRootNodes);
+		this._currentRootNode += 1;
+		const isLastRootNode = (this._currentRootNode === this._numRootNodes);
 
 		if (this._projectorAttachEvent === undefined) {
-			this._projectorAttachEvent = projectionOptions.nodeEvent.on('rendered',
-				({ element, properties }: ProjectorRenderedEvent) => {
-					this._nodeHandler.addProjector(element, properties);
-				});
+			this._projectorAttachEvent = projectionOptions.nodeEvent.on('rendered', () => {
+				this._nodeHandler.addProjector();
+			});
 			this.own(this._projectorAttachEvent);
 		}
 
@@ -475,8 +462,8 @@ export class WidgetBase<P = WidgetProperties, C extends DNode = DNode> extends E
 	private _decorateNodes(node: DNode | DNode[]) {
 		let nodes = Array.isArray(node) ? [ ...node ] : [ node ];
 
-		numRootNodesMap.set(this, nodes.length);
-		currentRootNodeMap.set(this, 0);
+		this._numRootNodes = nodes.length;
+		this._currentRootNode =  0;
 		const rootNodes: DNode[] = [];
 
 		nodes.forEach(node => {

src/interfaces.d.ts

@@ -23,14 +23,6 @@ export interface TypedTargetEvent<T extends EventTarget> extends Event {
 	target: T;
 }
 
-/**
- * Projector rendered event
- */
-export interface ProjectorRenderedEvent extends EventTargettedObject<Evented> {
-	element: HTMLElement;
-	properties: VNodeProperties;
-}
-
 /*
  These are the event handlers exposed by Maquette.
  */

src/mixins/Projector.ts

@@ -3,13 +3,13 @@ import global from '@dojo/shim/global';
 import { createHandle } from '@dojo/core/lang';
 import { Handle } from '@dojo/interfaces/core';
 import { Evented } from '@dojo/core/Evented';
-import { VNode, VNodeProperties } from '@dojo/interfaces/vdom';
+import { VNode } from '@dojo/interfaces/vdom';
 import { ProjectionOptions } from '../interfaces';
 import { dom, h, Projection } from 'maquette';
 import 'pepjs';
 import cssTransitions from '../animations/cssTransitions';
 import { Constructor, DNode } from './../interfaces';
-import { WidgetBase, currentRootNodeMap, numRootNodesMap } from './../WidgetBase';
+import { WidgetBase } from './../WidgetBase';
 import eventHandlerInterceptor from '../util/eventHandlerInterceptor';
 
 /**
@@ -289,36 +289,6 @@ export function ProjectorMixin<P, T extends Constructor<WidgetBase<P>>>(Base: T)
 			return this._projection.domNode.outerHTML;
 		}
 
-		protected afterRootCreateCallback(
-			element: HTMLElement,
-			projectionOptions: ProjectionOptions,
-			vnodeSelector: string,
-			properties: VNodeProperties
-		): void {
-			super.afterRootCreateCallback(element, projectionOptions, vnodeSelector, properties);
-			this._emitProjectorRenderedEvent(element, properties, projectionOptions.nodeEvent);
-		}
-
-		protected afterRootUpdateCallback(
-			element: HTMLElement,
-			projectionOptions: ProjectionOptions,
-			vnodeSelector: string,
-			properties: VNodeProperties
-		): void {
-			super.afterRootUpdateCallback(element, projectionOptions, vnodeSelector, properties);
-			this._emitProjectorRenderedEvent(element, properties, projectionOptions.nodeEvent);
-		}
-
-		private _emitProjectorRenderedEvent(element: HTMLElement, properties: VNodeProperties, nodeEvent: Evented) {
-			const currentRootNode = currentRootNodeMap.get(this) || 0;
-			const numRootNodes = numRootNodesMap.get(this);
-			const isLastRootNode = (currentRootNode === numRootNodes);
-
-			if (isLastRootNode) {
-				nodeEvent.emit({ type: 'rendered', element, properties });
-			}
-		}
-
 		public __render__(): VNode {
 			if (this._projectorChildren) {
 				this.setChildren(this._projectorChildren);
@@ -360,6 +330,7 @@ export function ProjectorMixin<P, T extends Constructor<WidgetBase<P>>>(Base: T)
 
 			if (this._projection) {
 				this._projection.update(this._boundRender());
+				this._projectionOptions.nodeEvent.emit({ type: 'rendered' });
 			}
 		}
 
@@ -401,6 +372,8 @@ export function ProjectorMixin<P, T extends Constructor<WidgetBase<P>>>(Base: T)
 				break;
 			}
 
+			this._projectionOptions.nodeEvent.emit({ type: 'rendered' });
+
 			return this._attachHandle;
 		}
 	}

tests/unit/NodeHandler.ts

@@ -64,7 +64,7 @@ registerSuite({
 			assert.isTrue(projectorStub.notCalled);
 		},
 		'add projector emits Projector event'() {
-			nodeHandler.addProjector(element, { key: 'foo' });
+			nodeHandler.addProjector();
 
 			assert.isTrue(widgetStub.notCalled);
 			assert.isTrue(elementStub.notCalled);

tests/unit/meta/meta.ts

@@ -191,14 +191,14 @@ registerSuite({
 		const div = document.createElement('div');
 		widget.append(div);
 
-		assert.isTrue(meta.has('foo'));
-		assert.isTrue(meta.has('bar'));
-		assert.isTrue(onFoo.calledOnce);
-		assert.isTrue(onBar.calledOnce);
-		assert.isTrue(onWidget.calledOnce);
-		assert.isTrue(onProjector.calledOnce);
-		assert.isTrue(onFoo.calledBefore(onWidget));
-		assert.isTrue(onFoo.calledBefore(onProjector));
+		assert.isTrue(meta.has('foo'), '1');
+		assert.isTrue(meta.has('bar'), '2');
+		assert.isTrue(onFoo.calledOnce, '3');
+		assert.isTrue(onBar.calledOnce, '4');
+		assert.isTrue(onWidget.calledOnce, '5');
+		assert.isTrue(onProjector.calledOnce, '6');
+		assert.isTrue(onFoo.calledBefore(onWidget), '7');
+		assert.isTrue(onFoo.calledBefore(onProjector), '8');
 	},
 	'integration with multiple root node'() {
 		class MyMeta extends MetaBase {