fix(ui5-dialog): fix text selection on chrome

WICG/webcomponents#773

On Chrome, clicking on slotted elements (light DOM) in the
dialog (shadow DOM) causes the focus to travel up the light DOM tree to
reach the closes element that is focusable.
Which ends to be the body element as document.activeElement.

This is not the case for FF & Safari, where the focus travels up the
slot, reaching the dialog root which is actually the closest focusable element.

This change introduces a workaround to align the focus behaviour in Chrome
with the other browsers.

Fixes #3466

packages/main/src/Popup.hbs

@@ -8,6 +8,7 @@
 	dir="{{effectiveDir}}"
 	@keydown={{_onkeydown}}
 	@focusout={{_onfocusout}}
+	@mouseup={{_onmouseup}}
 >
 
 	<span class="first-fe" data-ui5-focus-trap tabindex="0" @focusin={{forwardToLast}}></span>

packages/main/src/Popup.js

@@ -278,10 +278,17 @@ class Popup extends UI5Element {
 	}
 
 	_onfocusout(e) {
-		// relatedTarget is the element, which will get focus. If no such element exists, focus the root
+		// relatedTarget is the element, which will get focus. If no such element exists, focus the root.
 		if (!e.relatedTarget) {
 			this._root.tabIndex = -1;
+			this._shouldFocusRoot = true;
+		}
+	}
+
+	_onmouseup(e) {
+		if (document.activeElement !== this && !this.contains(document.activeElement) && this._shouldFocusRoot) {
 			this._root.focus();
+			this._shouldFocusRoot = false;
 		}
 	}