Upgrade to delite 0.9.5:

* Function name changes for preRender(), render(), and postRender().
* Remove explicit calls to connectedCallback() and disconnectedCallback().
* Fix Combobox instantiation per connectedCallback() changes in delite.

Author: wkeese

Accordion.js

@@ -117,7 +117,7 @@ define([
 
 		_numOpenPanels: 0,
 
-		postRender: function () {
+		afterInitializeRendering: function () {
 			this._panelList = [];
 
 			// Declarative case (panels specified declaratively inside the declarative Accordion).

BoilerplateTextbox.js

@@ -243,7 +243,7 @@ define([
 	 * by boilerplate text.
 	 *
 	 * The editable areas and boilerplate text are children of this widget and must exist by the time
-	 * `render()` completes.
+	 * `initializeRendering()` completes.
 	 */
 	var BoilerplateTextbox = register("d-boilerplate-textbox", [HTMLElement, Container, FormValueWidget], {
 		baseClass: "d-boilerplate-textbox",
@@ -255,7 +255,7 @@ define([
 			this.on("delite-deactivated", this.deactivatedHandler.bind(this));
 		},
 
-		postRender: function () {
+		afterInitializeRendering: function () {
 			this.on("input", this.nestedInputHandler.bind(this), this.containerNode);
 			this.on("change", this.nestedChangeHandler.bind(this), this.containerNode);
 			this.on("completed", this.completedHandler.bind(this), this.containerNode);

Button.js

@@ -94,15 +94,15 @@ define([
 			}.bind(this));
 		},
 
-		preRender: function () {
+		beforeInitializeRendering: function () {
 			// Get label from innerHTML, and then clear it since we are to put the label in a <span>
 			if (!this.label) {
 				this.label = this.textContent.trim();
 				this.innerHTML = "";
 			}
 		},
 
-		postRender: function () {
+		afterInitializeRendering: function () {
 			// Make SPACE/ENTER key cause button click event.
 			a11yclick(this);
 		},

Checkbox.js

@@ -33,7 +33,7 @@ define([
 
 		template: template,
 
-		postRender: function () {
+		afterInitializeRendering: function () {
 			this._lbl4 = null;
 			this.on("click", this._inputClickHandler.bind(this), this.focusNode);
 			this.on("change", this._inputClickHandler.bind(this), this.focusNode);

Combobox.js

@@ -202,7 +202,7 @@ define([
 			};
 		}),
 
-		postRender: function () {
+		afterInitializeRendering: function () {
 			if (this._focusOnRender) {
 				this.focus();
 			}

Combobox/ComboPopup.js

@@ -34,7 +34,7 @@ define([
 		// Whether or not to display the list.  Computed value.
 		showList: false,
 
-		postRender: function () {
+		afterInitializeRendering: function () {
 			this._showOrHideList();
 		},
 

Combobox/ComboboxAPI.js

@@ -242,7 +242,7 @@ define([
 			}
 		},
 
-		preRender: function () {
+		beforeInitializeRendering: function () {
 			// If the control seems to contain JSON, then parse it as our data source.
 			if (!this.firstElementChild && this.textContent.trim()) {
 				var data = JSON.parse("[" + this.textContent + "]");
@@ -276,8 +276,8 @@ define([
 			};
 		}),
 
-		// If no list specified, then create default one.  Do it after arguments parsed but before
-		// template instantiated (simply because ComboPopup template references {{list.id}}.
+		// If no list specified, create default one.  Do before template instantiated,
+		// because ComboPopup template references {{list.id}}.
 		connectedCallback: dcl.before(function () {
 			if (!this.list) {
 				var regexp = /^(?!_)(\w)+(?=Attr$|Func$)/;
@@ -286,11 +286,14 @@ define([
 				};
 
 				// attributes
-				this._parsedAttributes.filter(function (attr) {
-					return regexp.test(attr.prop);
-				}).forEach(function (item) {
-					listArgs[item.prop] = item.value;
-				}.bind(this));
+				var attr, idx = 0;
+				while ((attr = this.attributes[idx++])) {
+					var name = attr.name.toLowerCase();	// note: will be lower case already except for IE9
+					var parsedAttr = this.parseAttribute(name, attr.value);
+					if (parsedAttr && regexp.test(parsedAttr.prop)) {
+						listArgs[parsedAttr.prop] = parsedAttr.value;
+					}
+				}
 
 				// properties
 				for (var prop in this) {

Combobox/ComboboxImplementation.js

@@ -90,14 +90,6 @@ define([
 					"radio" : "multiple";
 
 				this._initHandlers();
-
-				// TODO
-				// This is a workaround waiting for a proper mechanism (at the level
-				// of delite/Store - delite/StoreMap) to allow a store-based widget
-				// to delegate the store-related functions to a parent widget (delite#323).
-				if (!this.list.attached) {
-					this.list.connectedCallback();
-				}
 			}
 		},
 

DatePicker.js

@@ -123,7 +123,7 @@ define([
 		 */
 		monthSelected: false,
 
-		postRender: function () {
+		afterInitializeRendering: function () {
 			// Create the DayPicker initially, and create MonthPicker and YearPicker on demand.
 			this.dayPicker = new DayPicker({
 				gridLabel: this.dayPickerLabel,

DatePicker/DayPicker.js

@@ -175,7 +175,7 @@ define([
 			}
 		},
 
-		render: dcl.superCall(function (sup) {
+		initializeRendering: dcl.superCall(function (sup) {
 			return function () {
 				sup.apply(this, arguments);
 

DatePicker/MonthPicker.js

@@ -36,7 +36,7 @@ define([
 		 */
 		month: -1,
 
-		render: function () {
+		initializeRendering: function () {
 			// Make 3x4 grid of abbreviated month names (Jan, Feb, Mar, ...).
 			this.setAttribute("role", "grid");
 			var row;

ProgressBar.js

@@ -94,7 +94,7 @@ define([
 
 		template: template,
 
-		postRender: function () {
+		afterInitializeRendering: function () {
 			// TODO: move this code to the template
 			this.setAttribute("aria-valuemin", 0);
 		},

ProgressIndicator.js

@@ -134,7 +134,7 @@ define([
 
 		template: template,
 
-		postRender: function () {
+		afterInitializeRendering: function () {
 			this.lineNodeList = this.linesNode.querySelectorAll("line");
 			var symbolId = this.widgetId + "-symbol";
 			this.symbolNode.id = symbolId;

ResizeHandle.js

@@ -62,7 +62,7 @@ define([
 		 */
 		resizeClass: "",
 
-		postRender: function () {
+		afterInitializeRendering: function () {
 			this.on("pointerdown", this._beginSizing.bind(this));
 		},
 

ResponsiveColumns.js

@@ -59,7 +59,7 @@ define([
 			 */
 			screenClass: "",
 
-			preRender: function () {
+			beforeInitializeRendering: function () {
 				this._breakpoints = {};
 				this._layouts = [];
 				// A set of MediaQueryList

Select.js

@@ -141,7 +141,7 @@ define([
 			this.value = this.valueNode.value;
 		},
 
-		postRender: function () {
+		afterInitializeRendering: function () {
 			// To provide graphic feedback for focus, react to focus/blur events
 			// on the underlying native select. The CSS class is used instead
 			// of the focus pseudo-class because the browsers give the focus

SidePane.js

@@ -239,7 +239,7 @@ define([
 			resolve();
 		},
 
-		preRender: function () {
+		beforeInitializeRendering: function () {
 			this._transitionTiming = { "default": 0, "chrome": 20, "ios": 20, "android": 100, "ff": 100 };
 			for (var o in this._transitionTiming) {
 				if (has(o) && this._timing < this._transitionTiming[o]) {
@@ -248,7 +248,7 @@ define([
 			}
 		},
 
-		postRender: function () {
+		afterInitializeRendering: function () {
 			this._resetInteractions();
 			setVisibility(this, false);
 		},

Slider.js

@@ -204,7 +204,7 @@ define([
 
 		template: template,
 
-		render: dcl.superCall(function (sup) {
+		initializeRendering: dcl.superCall(function (sup) {
 			return function () {
 				sup.call(this);
 				if (!this.valueNode.parentNode) {
@@ -378,7 +378,7 @@ define([
 			this.on("keyup", this.keyUpHandler.bind(this));
 		},
 
-		postRender: function () {
+		afterInitializeRendering: function () {
 			if (this.valueNode.value) { // INPUT value
 				// browser back button or value coded on INPUT
 				// the valueNode value has precedence over the widget markup value

StarRating.js

@@ -61,7 +61,7 @@ define([
 		_hovering: false,
 		_otherEventsHandles: [],
 
-		render: function () {
+		initializeRendering: function () {
 			this.focusNode = this.ownerDocument.createElement("div");
 			this.appendChild(this.focusNode);
 			// init WAI-ARIA attributes

SwapView.js

@@ -52,7 +52,7 @@ define([
 			this.on("keydown", this._keyDownHandler.bind(this));
 		},
 
-		render: function () {
+		initializeRendering: function () {
 			// we want to inherit from ViewStack's CSS (including transitions).
 			this.addClass("d-view-stack");
 		},

Switch.js

@@ -39,7 +39,7 @@ define([
 
 		template: template,
 
-		postRender: function () {
+		afterInitializeRendering: function () {
 			this.on("pointerdown", this._pointerDownHandler.bind(this), this._knobGlassNode);
 			this.on("click", this._clickPreventer.bind(this), this._knobGlassNode);
 		},

ToasterMessage.js

@@ -463,7 +463,6 @@ define([
 			} else {
 				wrapper.appendChild(this);
 			}
-			this.connectedCallback();
 
 			// starting timer
 			if (this.isExpirable()) {
@@ -538,7 +537,7 @@ define([
 			this._isRemoved = true;
 		},
 		template: template,
-		postRender: function () {
+		afterInitializeRendering: function () {
 			// TODO this should be done only if this.isDismissible()
 			// but at this stage this.isDismissible() ouput is wrong because members have not been initialized yet
 

Toggle.js

@@ -33,7 +33,7 @@ define([
 			this.checked = this._initState;
 		},
 
-		postRender: function () {
+		afterInitializeRendering: function () {
 			// CssState does not handle focused property any more
 			this.on("focus", function () {
 				this.addClass("d-focused");

ViewStack.js

@@ -166,7 +166,7 @@ define([
 			};
 		}),
 
-		postRender: function () {
+		afterInitializeRendering: function () {
 			this._setChildrenVisibility();
 		},
 

docs/ScrollableContainer.md

@@ -87,7 +87,7 @@ src="http://jsfiddle.net/ibmjs/RuqVK/embedded/result,js,html">
 By default, the scrolling capabilities are added to the widget's root node
 (that is, the widget itself). A sublcass of `deliteful/ScrollableContainer`
 can chose the node thanks to the property `scrollableNode`.
-This property must be set by the subclass at latest in its `render()`
+This property must be set by the subclass at latest in its `initializeRendering()`
 method.
 
 ### Scroll Direction
@@ -130,7 +130,7 @@ responsive manner. For details, see [`Interactions in delite/Scrollable`](/delit
 By default, the scrolling capabilities are added to the widget's root node
 (that is, the widget itself). A sublcass of `deliteful/ScrollableContainer`
 can chose the node thanks to the property `scrollableNode`.
-This property must be set by the subclass at latest in its `render()`
+This property must be set by the subclass at latest in its `initializeRendering()`
 method.
 
 *First use-case: creating a widget extending `deliteful/ScrollableContainer`*
@@ -140,7 +140,7 @@ define(["delite/register", "deliteful/ScrollableContainer", ...],
   function (register, Scrollable, ...) {
     return register("mywidget", [HTMLElement, ScrollableContainer, ...], {
       ...
-      render: dcl.superCall(function (sup) {
+      initializeRendering: dcl.superCall(function (sup) {
         return function () {
           // Create a child element:
           var myScrollableDiv = document.createElement("div");
@@ -168,7 +168,7 @@ define(["delite/register", "deliteful/ScrollableContainer", ...],
     // nor deliteful/ScrollableContainer
     return register("mywidget", [HTMLElement, ...], {
       ...
-      render: dcl.superCall(function (sup) {
+      initializeRendering: dcl.superCall(function (sup) {
         return function () {
           var scrollableNode =
             // or your own scrollable widget

list/List.js

@@ -415,7 +415,7 @@ define([
 			}
 		},
 
-		postRender: function () {
+		afterInitializeRendering: function () {
 			// moving down to the containerNode any aria attribute that has been set to the root node.
 			for (var i = 0; i < this.attributes.length; i++) {
 				if (/^aria-/.test(this.attributes[i].name)) {
@@ -683,10 +683,6 @@ define([
 						this._getLastRenderer().item));
 				}
 			}
-			// start renderers
-			this.findCustomElements(this.containerNode).forEach(function (w) {
-				w.connectedCallback();
-			});
 		},
 
 		/**
@@ -736,17 +732,14 @@ define([
 				if (spec.addCategoryAfter) {
 					let categoryRenderer = this._createCategoryRenderer(spec.nodeRef.item);
 					this.containerNode.insertBefore(categoryRenderer, spec.nodeRef);
-					categoryRenderer.connectedCallback();
 				}
 			} else {
 				this.containerNode.appendChild(renderer);
 			}
 			if (spec.addCategoryBefore) {
 				let categoryRenderer = this._createCategoryRenderer(renderer.item);
 				this.containerNode.insertBefore(categoryRenderer, renderer);
-				categoryRenderer.connectedCallback();
 			}
-			renderer.connectedCallback();
 		},
 
 		/**