From a073bb6612a047199bb044c88f620d5c27cfc529 Mon Sep 17 00:00:00 2001 From: Mateusz Borowczyk Date: Thu, 28 Nov 2024 11:57:08 +0100 Subject: [PATCH] Update e2e 8th scenario to use the new Instance Details PAge (Issue #5984, PR #6072) # Description move assertion from scenario 8 to the new instance Details page. fix bug with collapsing attributes on refetch, add label to the attributes closes #5984 # Self Check: Strike through any lines that are not applicable (`~~line~~`) then check the box - [ ] Attached issue to pull request - [ ] Changelog entry - [ ] Code is clear and sufficiently documented - [ ] Sufficient test cases (reproduces the bug/tests the requested feature) - [ ] Correct, in line with design - [ ] End user documentation is included or an issue is created for end-user documentation (add ref to issue here: ) --- changelogs/unreleased/5984-e2e-labes.yml | 4 + .../e2e/scenario-8-instance-composer.cy.js | 154 ++++++++---------- .../Test/AttributesUtils.test.ts | 12 +- .../ServiceInstanceDetails/Test/Page.test.tsx | 8 - .../AttributesComponents/AttributesTable.tsx | 14 +- .../Utils/AttributeUtils.ts | 18 +- 6 files changed, 104 insertions(+), 106 deletions(-) create mode 100644 changelogs/unreleased/5984-e2e-labes.yml diff --git a/changelogs/unreleased/5984-e2e-labes.yml b/changelogs/unreleased/5984-e2e-labes.yml new file mode 100644 index 000000000..0c07502b9 --- /dev/null +++ b/changelogs/unreleased/5984-e2e-labes.yml @@ -0,0 +1,4 @@ +description: Update e2e 8th scenario to use the new Instance Details PAge +issue-nr: 5984 +change-type: patch +destination-branches: [master] diff --git a/cypress/e2e/scenario-8-instance-composer.cy.js b/cypress/e2e/scenario-8-instance-composer.cy.js index d184604da..1ecaa002e 100644 --- a/cypress/e2e/scenario-8-instance-composer.cy.js +++ b/cypress/e2e/scenario-8-instance-composer.cy.js @@ -1,5 +1,3 @@ -//TODO: tests are commented out as there is ongoing redesign of the instance composer which will affect how the user interact with it and how e2e test should look like - /** * Shorthand method to clear the environment being passed. * By default, if no arguments are passed it will target the 'lsm-frontend' environment. @@ -65,6 +63,9 @@ const forceUpdateEnvironment = (nameEnvironment = "lsm-frontend") => { }; if (Cypress.env("edition") === "iso") { + const uuidRegex = + /^[0-9a-f]{8}-[0-9a-f]{4}-[4][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}$/i; + describe("Scenario 8 - Instance Composer", async () => { before(() => { clearEnvironment(); @@ -536,24 +537,27 @@ if (Cypress.env("edition") === "iso") { ); //check if embedded entities are present and relations are assigned correctly - cy.get("#expand-toggle0").click(); - cy.get("button").contains("Attributes").click(); + cy.get('[aria-label="row actions toggle"]').click(); + cy.get("button").contains("Instance Details").click(); - cy.get('[aria-label="Toggle-embedded"]').click(); + //check if embedded entities are present and relations are assigned correctly + cy.get('[aria-label="Expand row 27"]').click(); //toggle extra_embedded + cy.get('[aria-label="Expand row 28"]').click(); //toggle fist entity of extra_embedded - cy.get('[aria-label="Toggle-extra_embedded"]').click(); - cy.get('[aria-label="Toggle-extra_embedded$0"]').click(); + cy.get('[aria-label="parent_service_value"]') + .invoke("text") + .then((text) => { + expect(text).to.match(uuidRegex); + }); - cy.get('[aria-label="Row-parent_service"]').within(() => { - cy.get('[data-label="active"]').should("have.text", "test_name"); - }); - cy.get('[aria-label="Row-embedded$parent_service"]').within(() => { - cy.get('[data-label="active"]').should("have.text", "test_name2"); - }); - cy.get('[aria-label="Row-extra_embedded$0$parent_service"]').within( - () => { - cy.get('[data-label="active"]').should("have.text", "null"); - }, + cy.get('[aria-label="embedded.parent_service_value"]') + .invoke("text") + .then((text) => { + expect(text).to.match(uuidRegex); + }); + cy.get('[aria-label="extra_embedded.0.parent_service_value"]').should( + "have.text", + "null", ); }); @@ -666,62 +670,36 @@ if (Cypress.env("edition") === "iso") { ); //check if core attributes and embedded entities are updated - cy.get("#expand-toggle0").click(); - cy.get("button").contains("Attributes").click(); - - cy.get('[aria-label="Row-default_int"]').within(() => { - cy.get('[data-label="active"]').should("have.text", "20"); - cy.get('[data-label="candidate"]').should("have.text", "22"); - }); - - cy.get('[aria-label="Row-default_string"]').within(() => { - cy.get('[data-label="active"]').should("have.text", "default_string"); - cy.get('[data-label="candidate"]').should( - "have.text", - "updated_string", - ); - }); - - cy.get('[aria-label="Toggle-embedded"]').click(); - - cy.get('[aria-label="Row-embedded$default_int"]').within(() => { - cy.get('[data-label="active"]').should("have.text", "21"); - cy.get('[data-label="candidate"]').should("have.text", "22"); - }); - - cy.get('[aria-label="Row-embedded$default_float"]').within(() => { - cy.get('[data-label="active"]').should("have.text", "2.1"); - cy.get('[data-label="candidate"]').should("have.text", "2"); - }); - - cy.get('[aria-label="Row-embedded$default_string"]').within(() => { - cy.get('[data-label="active"]').should("have.text", "default_string"); - cy.get('[data-label="candidate"]').should( - "have.text", - "updated_string", - ); - }); + cy.get('[aria-label="row actions toggle"]').click(); + cy.get("button").contains("Instance Details").click(); - //assert that extra_embedded attrs are empty as instance was removed - cy.get('[aria-label="Toggle-extra_embedded"]').click(); - cy.get('[aria-label="Toggle-extra_embedded$0"]').click(); + //Go to candidate attributes and assert that they are updated + cy.get('[aria-label="Select-AttributeSet"]').select( + "candidate_attributes", + ); + cy.get('[aria-label="default_int_value"]').should("have.text", "22"); - cy.get('[aria-label="Row-extra_embedded$0$default_int"]').within(() => { - cy.get('[data-label="active"]').should("have.text", "21"); - cy.get('[data-label="candidate"]').should("have.text", ""); - }); + cy.get('[aria-label="default_string_value"]').should( + "have.text", + "updated_string", + ); - cy.get('[aria-label="Row-extra_embedded$0$default_float"]').within(() => { - cy.get('[data-label="active"]').should("have.text", "2.1"); - cy.get('[data-label="candidate"]').should("have.text", ""); - }); + cy.get('[aria-label="Expand row 1"]').click(); //toggle embedded - cy.get('[aria-label="Row-extra_embedded$0$default_string"]').within( - () => { - cy.get('[data-label="active"]').should("have.text", "default_string"); - cy.get('[data-label="candidate"]').should("have.text", ""); - }, + cy.get('[aria-label="embedded.default_int_value"]').should( + "have.text", + "22", ); + cy.get('[aria-label="embedded.default_float_value"]').should( + "have.text", + "2", + ); + cy.get('[aria-label="embedded.default_string_value"]').should( + "have.text", + "updated_string", + ); + + cy.get('[aria-label="extra_embedded_value"]').should("have.text", "[]"); }); it("8.4 composer edit view is able to edit instances relations", () => { @@ -801,15 +779,20 @@ if (Cypress.env("edition") === "iso") { ); //check if relation is assigned correctly - cy.get("#expand-toggle0").click(); - cy.get("button").contains("Attributes").click(); + cy.get('[aria-label="row actions toggle"]').click(); + cy.get("button").contains("Instance Details").click(); - cy.get('[aria-label="Row-parent_entity"]').within(() => { - cy.get('[data-label="active"]').should("have.text", "test_name"); - }); + let oldUuid = ""; + + cy.get('[aria-label="parent_entity_value"]') + .invoke("text") + .then((text) => { + expect(text).to.match(uuidRegex); + oldUuid = text; + }); // click on edit instance with composer - cy.get('[aria-label="row actions toggle"]').click(); + cy.get('[aria-label="Actions-Toggle"]').click(); cy.get("button").contains("Edit in Composer").click(); // Expect Canvas to be visible @@ -863,12 +846,20 @@ if (Cypress.env("edition") === "iso") { "up", ); - //check if relation is assigned correctly - cy.get("button").contains("Attributes").click(); + //check if relation is updated correctly + cy.get('[aria-label="row actions toggle"]').click(); + cy.get("button").contains("Instance Details").click(); + cy.get('[data-testid="selected-version"]').should( + "have.text", + "Version: 8", + ); // initial open of the details view will show the outdated version - cy.get('[aria-label="Row-parent_entity"]').within(() => { - cy.get('[data-label="active"]').should("have.text", "test_name2"); - }); + cy.get('[aria-label="parent_entity_value"]') + .invoke("text") + .then((text) => { + expect(text).to.match(uuidRegex); + expect(text).to.not.be.equal(oldUuid); + }); }); it("8.5 composer edit view is able to remove inter-service relation from instance", () => { @@ -971,9 +962,6 @@ if (Cypress.env("edition") === "iso") { //assert that in Active attribute we have only 1 relation cy.get('[aria-label="Expand row 2"]').click(); - const uuidRegex = - /^[0-9a-f]{8}-[0-9a-f]{4}-[4][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}$/i; - cy.get('[data-testid="0"]') .invoke("text") .then((text) => { @@ -987,8 +975,6 @@ if (Cypress.env("edition") === "iso") { "rollback_attributes", ); - cy.get('[aria-label="Expand row 2"]').click(); - cy.get('[data-testid="0"]') .invoke("text") .then((text) => { diff --git a/src/Slices/ServiceInstanceDetails/Test/AttributesUtils.test.ts b/src/Slices/ServiceInstanceDetails/Test/AttributesUtils.test.ts index 3768005c5..5e7a9386e 100644 --- a/src/Slices/ServiceInstanceDetails/Test/AttributesUtils.test.ts +++ b/src/Slices/ServiceInstanceDetails/Test/AttributesUtils.test.ts @@ -174,13 +174,13 @@ describe("formatTreeRowData", () => { value: { child1: "value1", child2: 456 }, children: [ { - id: expect.stringMatching(/^child1/), + id: expect.stringMatching(/^parent.child1/), name: "child1", value: "value1", children: [], }, { - id: expect.stringMatching(/^child2/), + id: expect.stringMatching(/^parent.child2/), name: "child2", value: 456, children: [], @@ -209,7 +209,7 @@ describe("formatTreeRowData", () => { value: { subKey1: "subValue1" }, children: [ { - id: expect.stringMatching(/^subKey1/), + id: expect.stringMatching(/^arrayKey.0.subKey1/), name: "subKey1", value: "subValue1", children: [], @@ -222,7 +222,7 @@ describe("formatTreeRowData", () => { value: { subKey2: "subValue2" }, children: [ { - id: expect.stringMatching(/^subKey2/), + id: expect.stringMatching(/^arrayKey.1.subKey2/), name: "subKey2", value: "subValue2", children: [], @@ -252,12 +252,12 @@ describe("formatTreeRowData", () => { value: { level2: { level3: "deepValue" } }, children: [ { - id: expect.stringMatching(/^level2/), + id: expect.stringMatching(/^level1.level2/), name: "level2", value: { level3: "deepValue" }, children: [ { - id: expect.stringMatching(/^level3/), + id: expect.stringMatching(/^level1.level2.level3/), name: "level3", value: "deepValue", children: [], diff --git a/src/Slices/ServiceInstanceDetails/Test/Page.test.tsx b/src/Slices/ServiceInstanceDetails/Test/Page.test.tsx index ff7341e90..994b2db16 100644 --- a/src/Slices/ServiceInstanceDetails/Test/Page.test.tsx +++ b/src/Slices/ServiceInstanceDetails/Test/Page.test.tsx @@ -256,14 +256,6 @@ describe("ServiceInstanceDetailsPage", () => { expect(select2).toHaveValue("candidate_attributes"); }); - await act(async () => { - await userEvent.click( - screen.getByRole("button", { - name: /expand row 1/i, - }), - ); - }); - // In Version 2, the site.name should be "inmanta-lab-0". expect(screen.getByText("inmanta-lab-0")).toBeVisible(); diff --git a/src/Slices/ServiceInstanceDetails/UI/Components/AttributesComponents/AttributesTable.tsx b/src/Slices/ServiceInstanceDetails/UI/Components/AttributesComponents/AttributesTable.tsx index 16f9fdcc4..4d83fe058 100644 --- a/src/Slices/ServiceInstanceDetails/UI/Components/AttributesComponents/AttributesTable.tsx +++ b/src/Slices/ServiceInstanceDetails/UI/Components/AttributesComponents/AttributesTable.tsx @@ -283,10 +283,20 @@ export const AttributesTable: React.FC = ({ return [ - + {node.name} - + {printValue(node)} , diff --git a/src/Slices/ServiceInstanceDetails/Utils/AttributeUtils.ts b/src/Slices/ServiceInstanceDetails/Utils/AttributeUtils.ts index dc5da5835..e07e649a8 100644 --- a/src/Slices/ServiceInstanceDetails/Utils/AttributeUtils.ts +++ b/src/Slices/ServiceInstanceDetails/Utils/AttributeUtils.ts @@ -1,4 +1,3 @@ -import { uniqueId } from "lodash"; import { InstanceAttributeModel } from "@/Core"; import { InstanceLog } from "@/Slices/ServiceInstanceHistory/Core/Domain"; @@ -67,6 +66,7 @@ export const getAvailableAttributesSets = ( */ export const formatTreeRowData = ( attributes: Record, + path: string = "", ): TreeRowData[] => { const result: TreeRowData[] = []; @@ -77,7 +77,7 @@ export const formatTreeRowData = ( // default const node: TreeRowData = { value: value, - id: uniqueId(key), + id: path + key, name: key, children: [], }; @@ -95,15 +95,18 @@ export const formatTreeRowData = ( // If the item is an object, we need to add the properties into the children node?.children?.push({ name: `${index}`, - id: `${uniqueId(key)}`, + id: path + key + "." + index, value: item, - children: formatTreeRowData(item as Record), + children: formatTreeRowData( + item as Record, + path + key + "." + index + ".", + ), }); } else { // If the item is a primitive value, add it directly. They don't need a collapsible section. node?.children?.push({ name: `${index}`, - id: `${uniqueId(key)}`, + id: path + key + "." + index, value: item, }); } @@ -111,7 +114,10 @@ export const formatTreeRowData = ( } else { // this case is when we are dealing with a normal object. We call the recursion. node?.children?.push( - ...formatTreeRowData(value as Record), + ...formatTreeRowData( + value as Record, + path + key + ".", + ), ); } }