From 41817c80d8808f9aa57a69758247f936ecaa5b1e Mon Sep 17 00:00:00 2001 From: Odei Maiz <33152403+odeimaiz@users.noreply.github.com> Date: Tue, 5 Nov 2024 11:55:11 +0100 Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=A8=20[e2e-frontend]=20Service=20brows?= =?UTF-8?q?er=20(#6664)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../class/osparc/dashboard/ResourceFilter.js | 8 +- .../tests/serviceBrowser/leftFilters.spec.js | 64 ++++++++++++++ .../tests/serviceBrowser/mainView.spec.js | 88 +++++++++++++++++++ .../tests/studyBrowser/leftFilters.spec.js | 4 +- 4 files changed, 159 insertions(+), 5 deletions(-) create mode 100644 tests/e2e-frontend/tests/serviceBrowser/leftFilters.spec.js create mode 100644 tests/e2e-frontend/tests/serviceBrowser/mainView.spec.js diff --git a/services/static-webserver/client/source/class/osparc/dashboard/ResourceFilter.js b/services/static-webserver/client/source/class/osparc/dashboard/ResourceFilter.js index 0cbb3357737..142cdab7d3f 100644 --- a/services/static-webserver/client/source/class/osparc/dashboard/ResourceFilter.js +++ b/services/static-webserver/client/source/class/osparc/dashboard/ResourceFilter.js @@ -22,7 +22,7 @@ qx.Class.define("osparc.dashboard.ResourceFilter", { construct: function(resourceType) { this.base(arguments); - osparc.utils.Utils.setIdToWidget(this, "resourceFilter"); + osparc.utils.Utils.setIdToWidget(this, resourceType + "-resourceFilter"); this.__resourceType = resourceType; this.__sharedWithButtons = []; @@ -102,6 +102,7 @@ qx.Class.define("osparc.dashboard.ResourceFilter", { label: option.label, icon: option.icon, }); + osparc.utils.Utils.setIdToWidget(button, this.__resourceType + "-sharedWithFilterItem"); if (this.__resourceType === "study") { if (option.id === "show-all") { button.set({ @@ -138,7 +139,7 @@ qx.Class.define("osparc.dashboard.ResourceFilter", { /* TAGS */ __createTagsFilterLayout: function() { const layout = new qx.ui.container.Composite(new qx.ui.layout.VBox(5)); - osparc.utils.Utils.setIdToWidget(layout, "tagsFilter"); + osparc.utils.Utils.setIdToWidget(layout, this.__resourceType + "-tagsFilter"); this.__populateTags(layout, []); osparc.store.Store.getInstance().addListener("changeTags", () => { @@ -159,7 +160,7 @@ qx.Class.define("osparc.dashboard.ResourceFilter", { layout.removeAll(); osparc.store.Store.getInstance().getTags().forEach((tag, idx) => { const button = new qx.ui.form.ToggleButton(tag.name, "@FontAwesome5Solid/tag/18"); - osparc.utils.Utils.setIdToWidget(button, "tagFilterItem"); + osparc.utils.Utils.setIdToWidget(button, this.__resourceType + "-tagFilterItem"); button.id = tag.id; button.set({ appearance: "filter-toggle-button", @@ -220,6 +221,7 @@ qx.Class.define("osparc.dashboard.ResourceFilter", { const iconSize = 20; const button = new qx.ui.toolbar.RadioButton(serviceType.label, serviceType.icon+iconSize); button.id = serviceId; + osparc.utils.Utils.setIdToWidget(button, this.__resourceType + "-serviceTypeFilterItem"); button.set({ appearance: "filter-toggle-button", value: false diff --git a/tests/e2e-frontend/tests/serviceBrowser/leftFilters.spec.js b/tests/e2e-frontend/tests/serviceBrowser/leftFilters.spec.js new file mode 100644 index 00000000000..247f5def582 --- /dev/null +++ b/tests/e2e-frontend/tests/serviceBrowser/leftFilters.spec.js @@ -0,0 +1,64 @@ +/* eslint-disable no-undef */ + +const { test, expect } = require('@playwright/test'); + +import { LoginPage } from '../fixtures/loginPage'; + +import products from '../products.json'; +import users from '../users.json'; + +const product = "osparc"; +const productUrl = products[product]; +const user = users[product][0]; + +test.describe.serial(`Left Filters:`, () => { + let page = null; + let loginPageFixture = null; + + test.beforeAll(async ({ browser }) => { + page = await browser.newPage(); + + const responsePromise = page.waitForResponse('**/services/-/latest**', { + timeout: 30000 + }); + + loginPageFixture = new LoginPage(page, productUrl); + const role = await loginPageFixture.login(user.email, user.password); + expect(role).toBe(user.role); + + await responsePromise; + + await page.getByTestId("servicesTabBtn").click(); + }); + + test.afterAll(async ({ browser }) => { + await loginPageFixture.logout(); + await page.close(); + await browser.close(); + }); + + test(`Filters`, async () => { + const sharedWithButtons = page.getByTestId("service-sharedWithFilterItem"); + await expect(sharedWithButtons.first()).toBeVisible({ + timeout: 30000 // it will take some time to load the Study Browser + }); + + const countSharedWithButtons = await sharedWithButtons.count(); + // All Services + // My Services + // Shared with Me + // Shared with Everyone + expect(countSharedWithButtons === 4).toBeTruthy(); + + + const serviceTypeButtons = page.getByTestId("service-serviceTypeFilterItem"); + await expect(serviceTypeButtons.first()).toBeVisible({ + timeout: 30000 // it will take some time to load the Study Browser + }); + + const countServiceTypeButtons = await serviceTypeButtons.count(); + // Computational + // Interactive + expect(countServiceTypeButtons === 2).toBeTruthy(); + }); +}); diff --git a/tests/e2e-frontend/tests/serviceBrowser/mainView.spec.js b/tests/e2e-frontend/tests/serviceBrowser/mainView.spec.js new file mode 100644 index 00000000000..c3077e467e7 --- /dev/null +++ b/tests/e2e-frontend/tests/serviceBrowser/mainView.spec.js @@ -0,0 +1,88 @@ +/* eslint-disable no-undef */ + +const { test, expect } = require('@playwright/test'); + +import { LoginPage } from '../fixtures/loginPage'; + +import products from '../products.json'; +import users from '../users.json'; + +const servicesTabExposed = { + "osparc": { + "areServicesExposed": true, + }, + "s4l": { + "areServicesExposed": true, + }, + "s4lacad": { + "areServicesExposed": true, + }, + "s4llite": { + "areServicesExposed": false, + }, + "tis": { + "areServicesExposed": false, + }, + "tiplite": { + "areServicesExposed": false, + }, +} + +for (const product in products) { + expect(servicesTabExposed[product]).toBeDefined(); + if (!servicesTabExposed[product]["areServicesExposed"]) { + continue; + } + + if (product in users) { + const productUrl = products[product]; + const productUsers = users[product]; + for (const user of productUsers) { + // expected roles for users: "USER" + const role = "USER"; + expect(user.role).toBe(role); + + test.describe.serial(`Main View: ${product}`, () => { + let page = null; + let loginPageFixture = null; + + test.beforeAll(async ({ browser }) => { + page = await browser.newPage(); + + const responsePromise = page.waitForResponse('**/services/-/latest**', { + timeout: 30000 + }); + + loginPageFixture = new LoginPage(page, productUrl); + const role = await loginPageFixture.login(user.email, user.password); + expect(role).toBe(user.role); + + const response = await responsePromise; + const resp = await response.json(); + expect("data" in resp && "_meta" in resp["data"] && "total" in resp["data"]["_meta"]); + console.log("N Services in Response:", resp["data"]["_meta"]["total"]); + + await page.getByTestId("servicesTabBtn").click(); + }); + + test.afterAll(async ({ browser }) => { + await loginPageFixture.logout(); + await page.close(); + await browser.close(); + }); + + test(`Services list`, async () => { + const servicesList = page.getByTestId("servicesList"); + await expect(servicesList).toBeVisible({ + timeout: 30000 + }); + + const serviceCards = servicesList.locator(':scope > *'); + const count = await serviceCards.count(); + console.log("N Services listed", count); + expect(count > 0); + }); + }); + } + } +} diff --git a/tests/e2e-frontend/tests/studyBrowser/leftFilters.spec.js b/tests/e2e-frontend/tests/studyBrowser/leftFilters.spec.js index 2a8dfa724d7..5412b82baae 100644 --- a/tests/e2e-frontend/tests/studyBrowser/leftFilters.spec.js +++ b/tests/e2e-frontend/tests/studyBrowser/leftFilters.spec.js @@ -41,12 +41,12 @@ test.describe.serial(`Left Filters:`, () => { }); test(`Tags`, async () => { - const tagsFilter = page.getByTestId("tagsFilter"); + const tagsFilter = page.getByTestId("study-tagsFilter"); await expect(tagsFilter).toBeVisible({ timeout: 30000 // it will take some time to load the Study Browser }); - const tagFilterItems = page.getByTestId("tagFilterItem"); + const tagFilterItems = page.getByTestId("study-tagFilterItem"); const count = await tagFilterItems.count(); // at least two and less than 6 (max five are shown) expect(count > 1 && count < 6).toBeTruthy();