From eb5c1ca721ce578629c2232905cd440089bd899f Mon Sep 17 00:00:00 2001 From: MrCoder Date: Mon, 23 Dec 2024 22:47:30 +1100 Subject: [PATCH] test(cypress): add e2e test for if-fragment layout - Create new HTML file for testing if-fragment layout - Add Cypress e2e test to verify correct rendering of if-fragment - Check participants, messages, and fragment details in the test - Include snapshot testing for visual verification --- cy/if-fragment.html | 28 ++++++++++++++++++++++++++++ cypress/e2e/if-fragment.spec.js | 32 ++++++++++++++++++++++++++++++++ 2 files changed, 60 insertions(+) create mode 100644 cy/if-fragment.html create mode 100644 cypress/e2e/if-fragment.spec.js diff --git a/cy/if-fragment.html b/cy/if-fragment.html new file mode 100644 index 00000000..33756ed5 --- /dev/null +++ b/cy/if-fragment.html @@ -0,0 +1,28 @@ + + + + + + + vue-sequence smoke 1 + + + +
+
+        title Issue 232 - wrong layout for if-fragment
+        Client -> Server:SendRequest
+
+if(true){
+  Server -> Server: processRequest
+}
+
+ + + + diff --git a/cypress/e2e/if-fragment.spec.js b/cypress/e2e/if-fragment.spec.js new file mode 100644 index 00000000..b1c2a82f --- /dev/null +++ b/cypress/e2e/if-fragment.spec.js @@ -0,0 +1,32 @@ +/* eslint-disable no-undef */ +import "cypress-plugin-snapshots/commands"; + +describe("If Fragment Test", function () { + it("should render if fragment correctly", function () { + cy.visit("http://127.0.0.1:8080/cy/if-fragment.html"); + // Wait for the privacy icon to be loaded + cy.get(".privacy>span>svg", { timeout: 5000 }).should("be.visible"); + + // Verify the participants are rendered + cy.get(".participant").should("have.length", 2); + cy.get(".participant").eq(0).should("contain", "Client"); + cy.get(".participant").eq(1).should("contain", "Server"); + + // Verify the initial message + cy.get(".message").first().should("contain", "SendRequest"); + + // Verify the if fragment + cy.get(".fragment").should("exist"); + cy.get(".fragment .header").should("contain", "Alt"); + cy.get(".fragment .condition").should("contain", "true"); + + // Verify the self message inside if block + cy.get(".fragment .message").should("contain", "processRequest"); + + // Take a snapshot of the rendered diagram + cy.document().toMatchImageSnapshot({ + imageConfig: { threshold: 0.01 }, + capture: "viewport", + }); + }); +});