fix: select correctly opens on click (#235)

Author: vladitasev

packages/main/src/Select.hbs

@@ -2,7 +2,9 @@
 	class="{{classes.main}}"
 	style="{{styles.main}}"
 	tabindex="{{tabIndex}}">
-	<div class="sapWCSelectLabel">
+	<div
+		class="sapWCSelectLabel"
+		@click="{{ctr._fnClickSelectBox}}">
 		<ui5-label>{{ctr._text}}</ui5-label>
 	</div>
 
@@ -20,5 +22,9 @@
 		</ui5-popover>
 	{{/if}}
 
-	<ui5-icon src="sap-icon://slim-arrow-down" class="sapWCSelectDropDownIcon"></ui5-icon>
-</div>
+	<ui5-icon
+		src="sap-icon://slim-arrow-down"
+		class="sapWCSelectDropDownIcon"
+		@press="{{ctr._fnClickSelectBox}}"
+	></ui5-icon>
+</div>

packages/main/src/Select.js

@@ -11,6 +11,7 @@ import {
 import ShadowDOM from "@ui5/webcomponents-base/src/compatibility/ShadowDOM";
 import KeyCodes from "@ui5/webcomponents-core/dist/sap/ui/events/KeyCodes";
 import ValueState from "@ui5/webcomponents-base/src/types/ValueState";
+import Function from "@ui5/webcomponents-base/src/types/Function";
 import Suggestions from "./Suggestions";
 
 // Template
@@ -94,6 +95,10 @@ const metadata = {
 			type: Boolean,
 			defaultValue: false,
 		},
+
+		_fnClickSelectBox: {
+			type: Function,
+		},
 	},
 	events: /** @lends sap.ui.webcomponents.main.Select.prototype */ {
 		/**
@@ -156,20 +161,20 @@ class Select extends WebComponent {
 		this._setSelectedItem(null);
 		this._setPreviewedItem(null);
 		this.Suggestions = new Suggestions(this, "items", true /* move focus with arrow keys */);
+		this._fnClickSelectBox = this.toggleList.bind(this);
 	}
 
 	onBeforeRendering() {
 		this._validateSelection();
 	}
 
 	/* Event handling */
-	onclick(event) {
+	toggleList() {
 		if (this.disabled) {
 			return;
 		}
-		if (event.target === this) {
-			this.Suggestions.toggle();
-		}
+
+		this.Suggestions.toggle();
 	}
 
 	onkeydown(event) {