- Get label "for" attribute working when target is a WebComponent

- Remove requirement that tooltip target be jQuery, get tooltips working on WebComponents

api/js/etemplate/et2_core_inheritance.ts

@@ -12,7 +12,7 @@
 	et2_core_common;
 */
 
-import {egw} from "../jsapi/egw_global";
+import {egw, IegwAppLocal} from "../jsapi/egw_global";
 import {et2_checkType, et2_no_init, et2_validateAttrib} from "./et2_core_common";
 import {et2_IDOMNode, et2_IInput, et2_IInputNode, et2_implements_registry} from "./et2_core_interfaces";
 import {LitElement} from "../../../node_modules/lit-element/lit-element.js";
@@ -277,6 +277,7 @@ export const Et2Widget = <T extends Constructor<LitElement>>(superClass: T) => {
 				 * Tooltip which is shown for this element on hover
 				 */
 				statustext: {type: String},
+
 				label: {type: String},
 				onclick: {
 					type: Function,
@@ -300,6 +301,7 @@ export const Et2Widget = <T extends Constructor<LitElement>>(superClass: T) => {
 
 			// Provide *default* property values in constructor
 			this.label = "";
+			this.statustext = "";
 		}
 
 		connectedCallback()
@@ -307,8 +309,17 @@ export const Et2Widget = <T extends Constructor<LitElement>>(superClass: T) => {
 			super.connectedCallback();
 
 			this.set_label(this.label);
+
+			if(this.statustext)
+			{
+				this.egw().tooltipBind(this,this.statustext);
+			}
 		}
 
+		disconnectedCallback()
+		{
+			this.egw().tooltipUnbind(this);
+		}
 
 		/**
 		 * NOT the setter, since we cannot add to the DOM before connectedCallback()
@@ -408,7 +419,7 @@ export const Et2Widget = <T extends Constructor<LitElement>>(superClass: T) => {
 				return this._parent;
 			}
 
-			return parentNode;
+			return <HTMLElement> parentNode;
 		}
 		getDOMNode(): HTMLElement {
 			return this;
@@ -537,6 +548,27 @@ export const Et2Widget = <T extends Constructor<LitElement>>(superClass: T) => {
 		{
 			return false;
 		}
+
+		egw() : IegwAppLocal
+		{
+			if (this.getParent() != null && !(this.getParent() instanceof HTMLElement))
+			{
+				return (<et2_widget> this.getParent()).egw();
+			}
+
+			// Get the window this object belongs to
+			var wnd = null;
+			// @ts-ignore Technically this doesn't have implements(), but it's mixed in
+			if (this.implements(et2_IDOMNode)) {
+				var node = (<et2_IDOMNode><unknown>this).getDOMNode();
+				if (node && node.ownerDocument) {
+					wnd = node.ownerDocument.parentNode || node.ownerDocument.defaultView;
+				}
+			}
+
+			// If we're the root object, return the phpgwapi API instance
+			return egw('phpgwapi', wnd);
+		}
 	};
 
 	function applyMixins(derivedCtor: any, baseCtors: any[]) {

api/js/etemplate/et2_core_inputWidget.ts

@@ -410,8 +410,6 @@ export const Et2InputWidget = <T extends Constructor>(superClass: T) => {
 		constructor() {
 			super();
 
-			// Add statustext hover
-
 		}
 
 		set_value(new_value)

api/js/etemplate/et2_widget_description.ts

@@ -20,7 +20,7 @@ import {et2_register_widget, WidgetConfig} from "./et2_core_widget";
 import {et2_baseWidget} from './et2_core_baseWidget'
 import {et2_inputWidget} from "./et2_core_inputWidget";
 import {expose} from "./expose";
-import {et2_IDetachedDOM, et2_IExposable} from "./et2_core_interfaces";
+import {et2_IDetachedDOM, et2_IExposable, et2_IInputNode} from "./et2_core_interfaces";
 import {egw} from "../jsapi/egw_global";
 
 /**
@@ -168,10 +168,10 @@ export class et2_description extends expose(class et2_description extends et2_ba
 				(for_widget = this.getRoot().getWidgetById(this.options.for))
 		) && for_widget && for_widget.id)
 		{
-			if(for_widget.dom_id)
+			if(for_widget.dom_id || for_widget.getDOMNode().id)
 			{
-				for_id = for_widget.dom_id;
+				for_id = for_widget.dom_id || for_widget.getDOMNode().id;
-				if(for_widget.instanceOf(et2_inputWidget) && for_widget.getInputNode() && for_widget.dom_id !== for_widget.getInputNode().id)
+				if(for_widget.instanceOf(et2_IInputNode) && for_widget.getInputNode() && for_id !== for_widget.getInputNode().id)
 				{
 					for_id = for_widget.getInputNode().id;
 				}

api/js/jsapi/egw_tooltip.js

@@ -161,11 +161,11 @@ egw.extend('tooltip', egw.MODULE_WND_LOCAL, function(_app, _wnd)
 		 * It is important to remove all tooltips from all elements which are
 		 * no longer needed, in order to prevent memory leaks.
 		 *
-		 * @param _elem is the element to which the tooltip should get bound. It
+		 * @param _elem is the element to which the tooltip should get bound.
-		 * 	has to be a jQuery node.
 		 * @param _html is the html code which should be shown as tooltip.
 		 */
 		tooltipBind: function(_elem, _html, _isHtml) {
+			_elem = jQuery(_elem);
 			if (_html != '')
 			{
 				_elem.bind('mouseenter.tooltip', function(e) {
@@ -222,6 +222,7 @@ egw.extend('tooltip', egw.MODULE_WND_LOCAL, function(_app, _wnd)
 		 * removed. _elem has to be a jQuery node.
 		 */
 		tooltipUnbind: function(_elem) {
+			_elem = jQuery(_elem);
 			if (current_elem == _elem)
 			{
 				hide();