feat(combobox): make aggregation work (#191)

closes #121 Co-authored-by: dominik.feininger <[email protected]>
ui5-community · Mar 25, 2022 · c2984bd · c2984bd
1 parent fdde624
commit c2984bd
Show file tree

Hide file tree

Showing 7 changed files with 114 additions and 7 deletions.
diff --git a/client-side-js/_getAggregation.js b/client-side-js/_getAggregation.js
@@ -11,7 +11,9 @@ async function clientSide_getAggregation(webElement, aggregationName) {
                     if (cAggregation && !Array.isArray(cAggregation)) {
                         cAggregation = [cAggregation]
                     }
-                    let result = window.wdi5.createControlIdMap(cAggregation)
+                    // read classname eg. sap.m.ComboBox
+                    controlType = oControl.getMetadata()._sClassName
+                    let result = window.wdi5.createControlIdMap(cAggregation, controlType)
                     done(["success", result])
                 } catch (e) {
                     done(["error", e.toString()])

diff --git a/client-side-js/executeControlMethod.js b/client-side-js/executeControlMethod.js
@@ -11,7 +11,11 @@ async function clientSide_executeControlMethod(webElement, methodName, args) {
                     // expect the method call delivers non-primitive results (like getId())
                     // but delivers a complex/structured type
                     // -> currenlty, only getAggregation(...) is supported
-                    result = window.wdi5.createControlIdMap(result)
+
+                    // read classname eg. sap.m.ComboBox
+                    controlType = oControl.getMetadata()._sClassName
+
+                    result = window.wdi5.createControlIdMap(result, controlType)
                     done(["success", result, "aggregation"])
                 } else {
                     // ui5 api <control>.focus() doesn't have return value

diff --git a/client-side-js/injectUI5.js b/client-side-js/injectUI5.js
@@ -250,15 +250,19 @@ async function clientSide_injectUI5(config, waitForUI5Timeout) {
                      * @param {[sap.ui.core.Control]} aControls
                      * @return {Array} Object
                      */
-                    window.wdi5.createControlIdMap = (aControls) => {
+                    window.wdi5.createControlIdMap = (aControls, controlType = "") => {
                         // the array of UI5 controls need to be mapped (remove circular reference)
-
                         return aControls.map((element) => {
                             // just use the absolute ID of the control
-                            let item = {
-                                id: element.getId()
+                            if (controlType === "sap.m.ComboBox" && element.data("InputWithSuggestionsListItem")) {
+                                return {
+                                    id: element.data("InputWithSuggestionsListItem").getId()
+                                }
+                            } else {
+                                return {
+                                    id: element.getId()
+                                }
                             }
-                            return item
                         })
                     }
 

diff --git a/examples/ui5-js-app/webapp/controller/Main.controller.js b/examples/ui5-js-app/webapp/controller/Main.controller.js
@@ -21,6 +21,15 @@ sap.ui.define(
 
                 let testModel = new JSONModel(jData)
                 this.getView().setModel(testModel, "testModel")
+
+                this.initCombobox()
+            },
+
+            initCombobox: function () {
+                // set explored app's demo model on this sample
+                var oModel = new JSONModel()
+                oModel.loadData("model/countries.json")
+                this.getView().setModel(oModel, "Countries")
             },
 
             navFwd() {

diff --git a/examples/ui5-js-app/webapp/model/countries.json b/examples/ui5-js-app/webapp/model/countries.json
@@ -0,0 +1,36 @@
+{
+  "CountriesCollection": [
+    {
+      "key": "DZ",
+      "text": "Algeria"
+    },
+    {
+      "key": "AR",
+      "text": "Argentina"
+    },
+    {
+      "key": "AU",
+      "text": "Australia"
+    },
+    {
+      "key": "AT",
+      "text": "Austria"
+    },
+    {
+      "key": "BH",
+      "text": "Bahrain"
+    },
+    {
+      "key": "BE",
+      "text": "Belgium"
+    },
+    {
+      "key": "BA",
+      "text": "Bosnia and Herzegovina"
+    },
+    {
+      "key": "BR",
+      "text": "Brazil"
+    }
+  ]
+}
diff --git a/examples/ui5-js-app/webapp/test/e2e/combobox.test.js b/examples/ui5-js-app/webapp/test/e2e/combobox.test.js
@@ -0,0 +1,43 @@
+const Main = require("./pageObjects/Main")
+
+const oComboboxSelector = {
+    forceSelect: true,
+    selector: {
+        interaction: "root",
+        id: "combobox",
+        viewName: "test.Sample.view.Main"
+    }
+}
+
+// #121
+describe("ui5 sap.m.Combobox", () => {
+    before(async () => {
+        await Main.open()
+    })
+
+    it("get combobox items aggregation as WebdriverIO representations", async () => {
+        const combobox = await browser.asControl(oComboboxSelector)
+
+        // no need to open the combobox
+        const items = await combobox.getItems(true)
+        expect(items.length).toEqual(8)
+    })
+
+    it("get combobox single item aggregation as ui5 items", async () => {
+        const combobox = await browser.asControl(oComboboxSelector)
+        // another issue with the combobox. If the Box was not opend prevoiusly the items are not rendered -> unretrieveable with ui5
+        await combobox.open()
+
+        const items = await combobox.getItems(4)
+        expect(await items.getTitle()).toEqual("Bahrain")
+    })
+
+    it("get combobox items aggregation as ui5 items", async () => {
+        const combobox = await browser.asControl(oComboboxSelector)
+        // another issue with the combobox. If the Box was not opend prevoiusly the items are not rendered -> unretrieveable with ui5
+        await combobox.open()
+
+        const items = await combobox.getItems()
+        expect(await items[4].getTitle()).toEqual("Bahrain")
+    })
+})
diff --git a/examples/ui5-js-app/webapp/view/Main.view.xml b/examples/ui5-js-app/webapp/view/Main.view.xml
@@ -73,6 +73,15 @@
 				<Button text="open Dialog"
 					press="openDialog"
 					id="openDialogButton" />
+				<Label text="Country Combobox"/>
+				<ComboBox
+					id="combobox"
+					items="{
+						path: 'Countries>/CountriesCollection',
+						sorter: { path: 'text' }
+					}">
+					<core:Item key="{Countries>key}" text="{Countries>text}" />
+				</ComboBox>
 				<!-- TODO -->
 				<!-- <SearchField id="idSearchfield" value="{testModel>/searchValue}"/> -->
 			</VBox>