@openui5/sap.ui.core 1.117.1 → 1.119.0

package/src/sap/ui/core/webc/WebComponentMetadata.js

@@ -0,0 +1,253 @@
+/*!
+ * OpenUI5
+ * (c) Copyright 2009-2023 SAP SE or an SAP affiliate company.
+ * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
+ */
+
+// Provides class sap.ui.core.webc.WebComponentMetadata
+sap.ui.define([
+	"../ElementMetadata",
+	"./WebComponentRenderer",
+	"sap/base/strings/camelize"
+],
+function(ElementMetadata, WebComponentRenderer, camelize) {
+	"use strict";
+
+	var MAPPING_TYPES = ["property", "style", "textContent", "slot", "none"];
+
+	/**
+	 * Creates a new metadata object for a WebComponent Wrapper subclass.
+	 *
+	 * @param {string} sClassName fully qualified name of the class that is described by this metadata object
+	 * @param {object} oClassInfo static info to construct the metadata from
+	 *
+	 * @class
+	 * @author SAP SE
+	 * @version 1.119.0
+	 * @since 1.118.0
+	 * @experimental Since 1.118.0 The API might change. It is not intended for productive usage yet!
+	 * @alias sap.ui.core.webc.WebComponentMetadata
+	 * @extends sap.ui.core.ElementMetadata
+	 * @public
+	 */
+	var WebComponentMetadata = function(sClassName, oClassInfo) {
+		// call super constructor
+		ElementMetadata.apply(this, arguments);
+	};
+
+	//chain the prototypes
+	WebComponentMetadata.prototype = Object.create(ElementMetadata.prototype);
+	WebComponentMetadata.prototype.constructor = WebComponentMetadata;
+
+	// mapping validation function
+	var fnValidateType = function (sType) {
+		return MAPPING_TYPES.includes(sType) ? sType : MAPPING_TYPES[0];
+	};
+
+	// Enrich property factory
+	var OriginalProperty = ElementMetadata.prototype.metaFactoryProperty;
+	var WebComponentProperty = function(oClass, name, info) {
+		OriginalProperty.apply(this, arguments);
+
+		if (!info.mapping || typeof info.mapping === "string") {
+			this._sMapping = fnValidateType(info.mapping);
+		} else if (typeof info.mapping === "object") {
+			this._sMapping = fnValidateType(info.mapping.type);
+			this._sMapTo = info.mapping.to;
+			this._fnMappingFormatter = info.mapping.formatter;
+		}
+	};
+	WebComponentProperty.prototype = Object.create(OriginalProperty.prototype);
+	WebComponentProperty.prototype.constructor = WebComponentProperty;
+	WebComponentMetadata.prototype.metaFactoryProperty = WebComponentProperty;
+
+	// Enrich aggregation factory
+	var OriginalAggregation = ElementMetadata.prototype.metaFactoryAggregation;
+	var WebComponentAggregation = function(oClass, name, info) {
+		OriginalAggregation.apply(this, arguments);
+		this._sSlot = info.slot || "";
+	};
+	WebComponentAggregation.prototype = Object.create(OriginalAggregation.prototype);
+	WebComponentAggregation.prototype.constructor = WebComponentAggregation;
+	WebComponentMetadata.prototype.metaFactoryAggregation = WebComponentAggregation;
+
+	// Enrich association factory
+	var OriginalAssociation = ElementMetadata.prototype.metaFactoryAssociation;
+	var WebComponentAssociation = function(oClass, name, info) {
+		OriginalAssociation.apply(this, arguments);
+		if (!info.mapping || typeof info.mapping !== "object") {
+			this._sMapping = ""; // For associations, "mapping" must be an object, because "to" is required
+		} else {
+			this._sMapping = "property"; // Associations map only to properties, no matter what is set, it's always "property" mapping
+			this._sMapTo = info.mapping.to; // The property, to which the association is related
+			this._fnMappingFormatter = info.mapping.formatter;
+		}
+	};
+	WebComponentAssociation.prototype = Object.create(OriginalAssociation.prototype);
+	WebComponentAssociation.prototype.constructor = WebComponentAssociation;
+	WebComponentMetadata.prototype.metaFactoryAssociation = WebComponentAssociation;
+
+	WebComponentMetadata.prototype.applySettings = function(oClassInfo) {
+		var oStaticInfo = oClassInfo.metadata;
+
+		this._sTag = oStaticInfo.tag;
+		this._aMethods = oStaticInfo.methods || [];
+		this._aGetters = oStaticInfo.getters || [];
+
+		ElementMetadata.prototype.applySettings.call(this, oClassInfo);
+	};
+
+	WebComponentMetadata.prototype.generateAccessors = function() {
+		ElementMetadata.prototype.generateAccessors.call(this);
+		var proto = this.getClass().prototype;
+
+		// Generate accessors for proxied public methods - only if not created explicitly already
+		this._aMethods.forEach(function(name) {
+			if (!proto[name]) {
+				proto[name] = function() {
+					return this.__callPublicMethod(name, arguments);
+				};
+			}
+		});
+
+		// Generate accessors for proxied public getters - only if not created explicitly already
+		this._aGetters.forEach(function(name) {
+			var functionName = "get" + name.substr(0, 1).toUpperCase() + name.substr(1);
+			if (!proto[functionName]) {
+				proto[functionName] = function() {
+					return this.__callPublicGetter(name);
+				};
+			}
+		});
+	};
+
+	/**
+	 * Returns the tag, used to render the Component Wrapper
+	 * @public
+	 * @returns {string}
+	 */
+	WebComponentMetadata.prototype.getTag = function() {
+		return this._sTag;
+	};
+
+	/**
+	 * Returns the list of public methods, proxied by the Component Wrapper to the component itself
+	 * @public
+	 * @returns {Array}
+	 */
+	WebComponentMetadata.prototype.getMethods = function() {
+		return this._aMethods;
+	};
+
+	/**
+	 * Returns the list of public getters, proxied by the Component Wrapper to the component itself
+	 * @public
+	 * @returns {Array}
+	 */
+	WebComponentMetadata.prototype.getGetters = function() {
+		return this._aGetters;
+	};
+
+	/**
+	 * Returns the slot to be assigned to a particular aggregation's items
+	 * @private
+	 */
+	WebComponentMetadata.prototype.getAggregationSlot = function(sAggregationName) {
+		var oAggregation = this._mAllAggregations[sAggregationName];
+		return oAggregation ? oAggregation._sSlot : undefined;
+	};
+
+	/**
+	 * Determines whether the attribute corresponds to a managed property
+	 * @param sAttr the attribute's name
+	 * @returns {boolean}
+	 */
+	WebComponentMetadata.prototype.isManagedAttribute = function(sAttr) {
+		var mProperties = this.getAllProperties();
+		for (var propName in mProperties) {
+			if (mProperties.hasOwnProperty(propName)) {
+				var propData = mProperties[propName];
+				if (propData._sMapping === "property" && (propData._sMapTo === sAttr || camelize(sAttr) === propName)) {
+					return true;
+				}
+			}
+		}
+
+		var mAssociations = this.getAllAssociations();
+		for (var sAssocName in mAssociations) {
+			if (mAssociations.hasOwnProperty(sAssocName)) {
+				var oAssocData = mAssociations[sAssocName];
+				if (oAssocData._sMapping === "property" && oAssocData._sMapTo === camelize(sAttr)) {
+					return true;
+				}
+			}
+		}
+
+		return false;
+	};
+
+	/**
+	 * Returns a map, containing all properties of a certain mapping type
+	 * @param sMapping
+	 * @returns {Object}
+	 */
+	WebComponentMetadata.prototype.getPropertiesByMapping = function(sMapping) {
+		var mFiltered = {};
+		var mProperties = this.getAllProperties();
+		var mPrivateProperties = this.getAllPrivateProperties();
+		for (var propName in mProperties) {
+			if (mProperties.hasOwnProperty(propName)) {
+				var propData = mProperties[propName];
+				if (propData._sMapping === sMapping) {
+					mFiltered[propName] = propData;
+				}
+			}
+		}
+
+		for (var propName in mPrivateProperties) {
+			if (mPrivateProperties.hasOwnProperty(propName)) {
+				var propData = mPrivateProperties[propName];
+				if (propData._sMapping === sMapping) {
+					mFiltered[propName] = propData;
+				}
+			}
+		}
+
+		return mFiltered;
+	};
+
+	/**
+	 * Returns a map of all associations that control properties (have mapping to properties)
+	 * returns {Object}
+	 */
+	WebComponentMetadata.prototype.getAssociationsWithMapping = function() {
+		var mFiltered = {};
+		var mAssociations = this.getAllAssociations();
+		for (var sAssocName in mAssociations) {
+			if (mAssociations.hasOwnProperty(sAssocName)) {
+				var oAssocData = mAssociations[sAssocName];
+				if (oAssocData._sMapping) {
+					mFiltered[sAssocName] = oAssocData;
+				}
+			}
+		}
+
+		return mFiltered;
+	};
+
+	/**
+	 * Retrieves the renderer for the described web component class.
+	 * Note: this is always the default renderer and Web Component wrappers should not define their own renderers.
+	 * @public
+	 */
+	WebComponentMetadata.prototype.getRenderer = function() {
+		if (this._oRenderer) {
+			return this._oRenderer;
+		}
+
+		return WebComponentRenderer;
+	};
+
+	return WebComponentMetadata;
+
+});

package/src/sap/ui/core/webc/WebComponentRenderer.js

@@ -0,0 +1,323 @@
+/*!
+ * OpenUI5
+ * (c) Copyright 2009-2023 SAP SE or an SAP affiliate company.
+ * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
+ */
+
+// Provides default renderer for all web components
+sap.ui.define([
+	"../Element",
+	"../Control",
+	"sap/base/strings/hyphenate"
+],
+function(Element, Control, hyphenate) {
+	"use strict";
+
+	/**
+	 * WebComponent renderer.
+	 *
+	 * @namespace
+	 * @alias sap.ui.core.webc.WebComponentRenderer
+	 * @static
+	 * @experimental Since 1.118.0 The API might change. It is not intended for productive usage yet!
+	 */
+	var WebComponentRenderer = {
+		apiVersion: 2
+	};
+
+	/**
+	 * Renders the HTML for the given control, using the provided {@link sap.ui.core.RenderManager}.
+	 * @param {sap.ui.core.RenderManager} oRm the RenderManager that can be used for writing to the Render-Output-Buffer
+	 * @param {sap.ui.core.webc.WebComponent} oWebComponent an object representation of the control that should be rendered
+	 */
+	WebComponentRenderer.render = function(oRm, oWebComponent){
+		var sTag = oWebComponent.getMetadata().getTag();
+
+		// Opening custom element tag
+		oRm.openStart(sTag, oWebComponent);
+
+		// Properties with mapping="property"
+		this.renderAttributeProperties(oRm, oWebComponent);
+		// Properties with mapping="style"
+		this.renderStyleProperties(oRm, oWebComponent);
+		// Properties, managed by associations
+		this.renderAssociationProperties(oRm, oWebComponent);
+		// Tooltip aggregation
+		this.renderTooltipAggregation(oRm, oWebComponent);
+		// Hook for customization
+		this.customRenderInOpeningTag(oRm, oWebComponent);
+		// Attributes/Styles that the component sets internally
+		this.preserveUnmanagedAttributes(oRm, oWebComponent);
+		// Styles that the component sets internally
+		this.preserveUnmanagedStyles(oRm, oWebComponent);
+
+		oRm.openEnd();
+
+		// Properties with mapping="textContent"
+		this.renderTextContentProperties(oRm, oWebComponent);
+		// Properties with mapping="slot"
+		this.renderSlotProperties(oRm, oWebComponent);
+		// Aggregations
+		this.renderAggregations(oRm, oWebComponent);
+		// Hook for customization (additional children)
+		this.customRenderInsideTag(oRm, oWebComponent);
+
+		// Closing custom element tag
+		oRm.close(sTag);
+	};
+
+	/**
+	 * Renders attributes, based on the control's properties
+	 * @private
+	 * @param oRm
+	 * @param oWebComponent
+	 */
+	WebComponentRenderer.renderAttributeProperties = function(oRm, oWebComponent) {
+		var oAttrProperties = oWebComponent.getMetadata().getPropertiesByMapping("property");
+		var aPropsToAlwaysSet = ["enabled"]; // some properties can be initial and still have a non-default value due to side effects (e.g. EnabledPropagator)
+		for (var sPropName in oAttrProperties) {
+			if (oWebComponent.isPropertyInitial(sPropName) && !aPropsToAlwaysSet.includes(sPropName)) {
+				continue; // do not set attributes for properties that were not explicitly set or bound
+			}
+
+			var oPropData = oAttrProperties[sPropName];
+			var vPropValue = oPropData.get(oWebComponent);
+			if (oPropData.type === "object" || typeof vPropValue === "object") {
+				continue; // Properties of type "object" and custom-type properties with object values are set during onAfterRendering
+			}
+
+			var sAttrName = oPropData._sMapTo ? oPropData._sMapTo : hyphenate(sPropName);
+			if (oPropData._fnMappingFormatter) {
+				vPropValue = oWebComponent[oPropData._fnMappingFormatter].call(oWebComponent, vPropValue);
+			}
+
+			if (oPropData.type === "boolean") {
+				if (vPropValue) {
+					oRm.attr(sAttrName, "");
+				}
+			} else {
+				if (vPropValue != null) {
+					oRm.attr(sAttrName, vPropValue);
+				}
+			}
+		}
+	};
+
+	/**
+	 * Preserves attributes that the component set on itself internally (such as private attributes and the attribute that mimics the tag, e.g. "ui5-button")
+	 * This is necessary as otherwise Patcher.js will remove them upon each re-rendering
+	 * @private
+	 * @param oRm
+	 * @param oWebComponent
+	 */
+	WebComponentRenderer.preserveUnmanagedAttributes = function(oRm, oWebComponent) {
+		var oDomRef = oWebComponent.getDomRef();
+		if (!oDomRef) {
+			return; // First rendering - the unmanaged attributes haven't been set yet
+		}
+
+		var aAttributes = oDomRef.getAttributeNames();
+		var aSkipList = ["id", "data-sap-ui", "style", "class", "__is-busy"];
+		aAttributes.forEach(function(sAttr) {
+			if (aSkipList.indexOf(sAttr) !== -1) {
+				return; // Skip attributes, set by the framework
+			}
+
+			if (oWebComponent.getMetadata().isManagedAttribute(sAttr)) {
+				return;
+			}
+
+			var sValue = oDomRef.getAttribute(sAttr); // Repeat the value from DOM
+			if (sValue !== null) {
+				oRm.attr(sAttr, sValue);
+			}
+		});
+	};
+
+	/**
+	 * Preserves styles that the component set on itself internally (such as position top, left and CSS Variables)
+	 * This is necessary as otherwise Patcher.js will remove them upon each re-rendering
+	 * @private
+	 * @param oRm
+	 * @param oWebComponent
+	 */
+	WebComponentRenderer.preserveUnmanagedStyles = function(oRm, oWebComponent) {
+		var oDomRef = oWebComponent.getDomRef();
+		if (!oDomRef) {
+			return; // First rendering - the unmanaged styles haven't been set yet
+		}
+		var aSetStyles = Array.prototype.slice.apply(oDomRef.style);
+		if (aSetStyles.length === 0) {
+			return; // No styles set at all
+		}
+
+		var oStyleProperties = oWebComponent.getMetadata().getPropertiesByMapping("style");
+		var aManagedStyles = [];
+		for (var sPropName in oStyleProperties) {
+			var oPropData = oStyleProperties[sPropName];
+			var sStyleName = oPropData._sMapTo ? oPropData._sMapTo : hyphenate(sPropName);
+			aManagedStyles.push(sStyleName);
+		}
+
+		aSetStyles.forEach(function(sStyle) {
+			if (aManagedStyles.indexOf(sStyle) !== -1) {
+				return; // Do not preserve any managed styles
+			}
+			var sValue = sStyle.startsWith("--") ? window.getComputedStyle(oDomRef).getPropertyValue(sStyle) : oDomRef.style[sStyle]; // CSS Values can only be read from getComputedStyle
+			oRm.style(sStyle, sValue);
+		});
+	};
+
+	/**
+	 * Renders styles, based on the control's properties
+	 * @private
+	 * @param oRm
+	 * @param oWebComponent
+	 */
+	WebComponentRenderer.renderStyleProperties = function(oRm, oWebComponent) {
+		var oStyleProperties = oWebComponent.getMetadata().getPropertiesByMapping("style");
+		for (var sPropName in oStyleProperties) {
+			var oPropData = oStyleProperties[sPropName];
+			var sStyleName = oPropData._sMapTo ? oPropData._sMapTo : hyphenate(sPropName);
+			var vPropValue = oPropData.get(oWebComponent);
+			if (oPropData._fnMappingFormatter) {
+				vPropValue = oWebComponent[oPropData._fnMappingFormatter].call(oWebComponent, vPropValue);
+			}
+
+			if (vPropValue != null) {
+				oRm.style(sStyleName, vPropValue);
+			}
+		}
+	};
+
+	/**
+	 * Renders properties, controlled by associations
+	 * @private
+	 * @param oRm
+	 * @param oWebComponent
+	 */
+	WebComponentRenderer.renderAssociationProperties = function(oRm, oWebComponent) {
+		var oAssociations = oWebComponent.getMetadata().getAssociationsWithMapping();
+		for (var sAssocName in oAssociations) {
+			var oAssocData = oAssociations[sAssocName];
+			var vAssocValue = oAssocData.get(oWebComponent);
+			var sAttrName = hyphenate(oAssocData._sMapTo); // The name of the attribute to be set with the association's ID value
+			if (oAssocData._fnMappingFormatter) {
+				vAssocValue = oWebComponent[oAssocData._fnMappingFormatter].call(oWebComponent, vAssocValue);
+			}
+
+			if (!oAssocData.multiple && vAssocValue && typeof vAssocValue === "object") {
+				vAssocValue = vAssocValue.getId(); // The value will be the control ID, held by the association
+			}
+
+			if (vAssocValue) { // Only set the property, if the association is set
+				oRm.attr(sAttrName, vAssocValue);
+			}
+		}
+	};
+
+	/**
+	 * Transforms the tooltip aggregation to a tooltip attribute - components that support this attribute will use it
+	 * @private
+	 * @param oRm
+	 * @param oWebComponent
+	 */
+	WebComponentRenderer.renderTooltipAggregation = function(oRm, oWebComponent) {
+		var sTooltipText = oWebComponent.getTooltip_Text();
+		if (sTooltipText) {
+			oRm.attr("tooltip", sTooltipText);
+		}
+	};
+
+	/**
+	 * Renders text inside the component, if it has a property of type textContent
+	 * Normally a single property of this type is expected (such as button text), but if more than one are set, they are all rendered
+	 * @private
+	 * @param oRm
+	 * @param oWebComponent
+	 */
+	WebComponentRenderer.renderTextContentProperties = function(oRm, oWebComponent) {
+		var oTextContentProperties = oWebComponent.getMetadata().getPropertiesByMapping("textContent");
+		for (var sPropName in oTextContentProperties) {
+			var oPropData = oTextContentProperties[sPropName];
+			var vPropValue = oPropData.get(oWebComponent);
+			if (oPropData._fnMappingFormatter) {
+				vPropValue = oWebComponent[oPropData._fnMappingFormatter].call(oWebComponent, vPropValue);
+			}
+
+			oRm.text(vPropValue);
+		}
+	};
+
+	/**
+	 * Renders properties as slotted text inside a div/span or another tag
+	 * This is mostly useful for value state message as UI5 Web Components get the value state message as slotted text
+	 * @private
+	 * @param oRm
+	 * @param oWebComponent
+	 */
+	WebComponentRenderer.renderSlotProperties = function(oRm, oWebComponent) {
+		var oSlotProperties = oWebComponent.getMetadata().getPropertiesByMapping("slot");
+		for (var sPropName in oSlotProperties) {
+			var oPropData = oSlotProperties[sPropName];
+			var vPropValue = oPropData.get(oWebComponent);
+			if (oPropData._fnMappingFormatter) {
+				vPropValue = oWebComponent[oPropData._fnMappingFormatter].call(oWebComponent, vPropValue);
+			}
+			var sTag = oPropData._sMapTo ? oPropData._sMapTo : "span";
+
+			if (vPropValue) {
+				oRm.openStart(sTag);
+				oRm.attr("slot", sPropName);
+				oRm.openEnd();
+				oRm.text(vPropValue);
+				oRm.close(sTag);
+			}
+		}
+	};
+
+	/**
+	 * Render children.
+	 * Note: for each child, RenderManager.js will set the "slot" attribute automatically
+	 * @private
+	 * @param oRm
+	 * @param oWebComponent
+	 */
+	WebComponentRenderer.renderAggregations = function(oRm, oWebComponent) {
+		var oAggregations = oWebComponent.getMetadata().getAllAggregations();
+		for (var sAggName in oAggregations) {
+			if (Element.getMetadata().getAggregations().hasOwnProperty(sAggName) || Control.getMetadata().getAggregations().hasOwnProperty(sAggName)) {
+				continue; // Skip aggregations, derived from Element.js / Control.js such as dependents and layoutData
+			}
+
+			var aggData = oAggregations[sAggName];
+			var aggValue = aggData.get(oWebComponent);
+
+			if (aggData.multiple) {
+				aggValue.forEach(oRm.renderControl, oRm);
+			} else {
+				if (aggValue) {
+					oRm.renderControl(aggValue);
+				}
+			}
+		}
+	};
+
+	/**
+	 * Hook. For future use.
+	 * @protected
+	 * @param oRm
+	 * @param oWebComponent
+	 */
+	WebComponentRenderer.customRenderInOpeningTag = function(oRm, oWebComponent) {};
+
+	/**
+	 * Hook. For future use.
+	 * @param oRm
+	 * @param oWebComponent
+	 */
+	WebComponentRenderer.customRenderInsideTag = function(oRm, oWebComponent) {};
+
+	return WebComponentRenderer;
+
+});

package/src/sap/ui/core/ws/ReadyState.js

@@ -12,7 +12,7 @@ sap.ui.define(function() {
 	/**
 	 * Defines the different ready states for a WebSocket connection.
 	 *
-	 * @version 1.117.1
+	 * @version 1.119.0
 	 * @enum {int}
 	 * @public
 	 * @alias sap.ui.core.ws.ReadyState

package/src/sap/ui/core/ws/SapPcpWebSocket.js

@@ -21,7 +21,7 @@ sap.ui.define(['./WebSocket', "sap/base/Log"],
 	 * @class WebSocket class implementing the pcp-protocol.
 	 * @extends sap.ui.core.ws.WebSocket
 	 * @author SAP SE
-	 * @version 1.117.1
+	 * @version 1.119.0
 	 * @alias sap.ui.core.ws.SapPcpWebSocket
 	 */
 	var SapPcpWebSocket = WebSocket.extend("sap.ui.core.ws.SapPcpWebSocket", /** @lends sap.ui.core.ws.SapPcpWebSocket.prototype */ {

package/src/sap/ui/core/ws/WebSocket.js

@@ -25,7 +25,7 @@ sap.ui.define([
 	 * @class Basic WebSocket class.
 	 * @extends sap.ui.base.EventProvider
 	 * @author SAP SE
-	 * @version 1.117.1
+	 * @version 1.119.0
 	 * @alias sap.ui.core.ws.WebSocket
 	 */
 	var WebSocket = EventProvider.extend("sap.ui.core.ws.WebSocket", /** @lends sap.ui.core.ws.WebSocket.prototype */ {

package/src/sap/ui/debug/ControlTree.js

@@ -8,12 +8,13 @@
 sap.ui.define('sap/ui/debug/ControlTree', [
 	'sap/ui/base/EventProvider',
 	'sap/ui/core/Element',
+	'sap/ui/core/Rendering',
 	'sap/ui/core/UIArea',
 	'./Highlighter',
 	"sap/ui/dom/getOwnerWindow",
 	"sap/base/Log"
 ],
-	function(EventProvider, Element, UIArea, Highlighter, getOwnerWindow, Log) {
+	function(EventProvider, Element, Rendering, UIArea, Highlighter, getOwnerWindow, Log) {
 	"use strict";
 
 
@@ -33,7 +34,7 @@ sap.ui.define('sap/ui/debug/ControlTree', [
 	 * @class Control Tree used for the Debug Environment
 	 * @extends sap.ui.base.EventProvider
 	 * @author Martin Schaus, Frank Weigel
-	 * @version 1.117.1
+	 * @version 1.119.0
 	 * @alias sap.ui.debug.ControlTree
 	 * @private
 	 */
@@ -55,7 +56,7 @@ sap.ui.define('sap/ui/debug/ControlTree', [
 			this.oParentDomRef.addEventListener("mouseover", this.onmouseover);
 			this.oParentDomRef.addEventListener("mouseout", this.onmouseout);
 			this.enableInplaceControlSelection();// see below...
-			this.oCore.attachUIUpdated(this.renderDelayed, this);
+			Rendering.attachUIUpdated(this.renderDelayed, this);
 			this.sSelectedNodeId = "";
 			// Note: window.top is assumed to refer to the app window in embedded mode or to the testsuite window otherwise
 			this.sResourcePath = window.top.sap.ui.require.toUrl("") + "/";
@@ -273,7 +274,7 @@ sap.ui.define('sap/ui/debug/ControlTree', [
 			}
 			var oParent = oSource.parentNode,
 				sId = oParent.getAttribute("sap-id"),
-				oElement = this.oCore.byId(sId),
+				oElement = Element.getElementById(sId),
 				sNodeId = oParent.getAttribute("sap-type") === "Link" ? "sap-debug-controltree-" + sId : oParent.id;
 			this.oSelectionHighlighter.hide();
 			if (oElement instanceof Element) {
@@ -361,7 +362,7 @@ sap.ui.define('sap/ui/debug/ControlTree', [
 	ControlTree.prototype.getTargetDomRef = function(oTreeNodeDomRef) {
 		var sType = oTreeNodeDomRef.getAttribute("sap-type"),
 			sId = oTreeNodeDomRef.getAttribute("sap-id"),
-			oSomething = sType === "UIArea" ? UIArea.registry.get(sId) : this.oCore.byId(sId);
+			oSomething = sType === "UIArea" ? UIArea.registry.get(sId) : Element.getElementById(sId);
 
 		while (oSomething instanceof Element) {
 			var oDomRef = oSomething.getDomRef();
@@ -389,10 +390,10 @@ sap.ui.define('sap/ui/debug/ControlTree', [
 		if ( oEvt ) {
 		  if ( oEvt.ctrlKey && oEvt.shiftKey && !oEvt.altKey ) {
 			  var oControl = oEvt.srcElement || oEvt.target;
-			  while (oControl && (!oControl.id || !this.oCore.byId(oControl.id)) ) {
+			  while (oControl && (!oControl.id || !Element.getElementById(oControl.id)) ) {
 				oControl = oControl.parentNode;
 			}
-			 if ( oControl && oControl.id && this.oCore.byId(oControl.id) ) {
+			 if ( oControl && oControl.id && Element.getElementById(oControl.id) ) {
 				this.oHoverHighlighter.highlight(oControl);
 			 } else {
 			// this.selectControlInTreeByCtrlId(sId);