feat: added test cases in cypress

Hyperswitch-React-Demo-App/.env

@@ -2,6 +2,6 @@ STATIC_DIR=./dist
 HYPERSWITCH_PUBLISHABLE_KEY=
 HYPERSWITCH_SECRET_KEY=
 HYPERSWITCH_SERVER_URL=
-HYPERSWITCH_CLIENT_URL=
+HYPERSWITCH_CLIENT_URL="http://localhost:9050"
 SELF_SERVER_URL=
 PROFILE_ID=""

cypress-tests/cypress/e2e/Stripe-no3ds-test.cy.ts

@@ -0,0 +1,96 @@
+import * as testIds from "../../../src/Utilities/TestUtils.bs";
+import { getClientURL } from "../support/utils";
+import { createPaymentBody } from "../support/utils";
+import { changeObjectKeyValue } from "../support/utils";
+import { stripeCards } from "cypress/support/cards";
+
+describe("Card payment flow test", () => {
+
+  const publishableKey = Cypress.env('HYPERSWITCH_PUBLISHABLE_KEY')
+  const secretKey = Cypress.env('HYPERSWITCH_SECRET_KEY')
+  let getIframeBody: () => Cypress.Chainable<JQuery<HTMLBodyElement>>;
+  let iframeSelector =
+    "#orca-payment-element-iframeRef-orca-elements-payment-element-payment-element";
+
+  // changeObjectKeyValue(createPaymentBody,"profile_id","YOUR_PROFILE_ID")
+
+
+  beforeEach(() => {
+    getIframeBody = () => cy.iframe(iframeSelector);
+    cy.createPaymentIntent(secretKey, createPaymentBody).then(() => {
+      cy.getGlobalState("clientSecret").then((clientSecret) => {
+
+        cy.visit(getClientURL(clientSecret, publishableKey));
+      });
+
+    })
+  });
+
+it("should complete the card payment successfully", () => {
+    // Visit the page with the payment form
+    //cy.visit(CLIENT_URL);
+    const { cardNo, card_exp_month, card_exp_year, cvc } = stripeCards.successCard;
+
+    // Wait for iframe to load and get its body
+    getIframeBody().find('[data-testid=cardNoInput]').type(cardNo); // Example card number
+    getIframeBody().find('[data-testid=expiryInput]').type(card_exp_month); // Expiration month
+    getIframeBody().find('[data-testid=expiryInput]').type(card_exp_year); // Expiration year
+    getIframeBody().find('[data-testid=cvvInput]').type(cvc); // CVV
+
+    // Click on the submit button
+    getIframeBody().get("#submit").click();
+
+    // Wait for the response and assert payment success message
+    cy.wait(3000); // Adjust wait time based on actual response time
+    cy.contains("Thanks for your order!").should("be.visible");
+  });
+
+
+  it("should fail with an invalid card number", () => {
+   // cy.visit(CLIENT_URL);
+   const { cardNo, card_exp_month, card_exp_year, cvc } = stripeCards.invalidCard;
+
+    getIframeBody().find('[data-testid=cardNoInput]').type(cardNo); // Invalid card number
+    getIframeBody().find('[data-testid=expiryInput]').type(card_exp_month); // Expiration month
+    getIframeBody().find('[data-testid=expiryInput]').type(card_exp_year); // Expiration year
+    getIframeBody().find('[data-testid=cvvInput]').type(cvc); // CVV
+
+    getIframeBody().get("#submit").click();
+
+    cy.wait(3000); // Adjust wait time based on actual response time
+    cy.contains("Please enter valid details").should("be.visible"); // Adjust based on actual error message
+  });
+
+  it("should show error for expired card year", () => {
+    //cy.visit(CLIENT_URL);
+    const { cardNo, card_exp_month, card_exp_year, cvc } = stripeCards.invalidYear;
+
+    getIframeBody().find('[data-testid=cardNoInput]').type(cardNo); // Valid card number
+    getIframeBody().find('[data-testid=expiryInput]').type(card_exp_month); // Expiration month
+    getIframeBody().find('[data-testid=expiryInput]').type(card_exp_year); // Expiration year
+    getIframeBody().find('[data-testid=cvvInput]').type(cvc); // CVV
+
+    getIframeBody().get("#submit").click();
+
+    cy.wait(3000); // Adjust wait time based on actual response time
+    getIframeBody().find('.Error.pt-1').should('be.visible')
+      .and('contain.text', "Your card's expiration year is in the past.");
+  });
+
+  it("should show error for incomplete card CVV", () => {
+    //cy.visit(CLIENT_URL);
+    const{ cardNo, card_exp_month , card_exp_year ,cvc}=stripeCards.invalidCVC
+
+    getIframeBody().find('[data-testid=cardNoInput]').type(cardNo); // Valid card number
+    getIframeBody().find('[data-testid=expiryInput]').type(card_exp_month); // Expiration month
+    getIframeBody().find('[data-testid=expiryInput]').type(card_exp_year); // Expiration year
+    getIframeBody().find('[data-testid=cvvInput]').type(cvc); // Incomplete CVV
+
+    getIframeBody().get("#submit").click();
+
+    cy.wait(3000); // Adjust wait time based on actual response time
+    getIframeBody().find('.Error.pt-1').should('be.visible')
+      .and('contain.text', "Your card's security code is incomplete.");
+  });
+
+});

cypress-tests/cypress/e2e/card-flow-e2e-test.cy.ts → cypress-tests/cypress/e2e/savedcard-test.cy.ts

@@ -11,9 +11,9 @@ describe("Card payment flow test", () => {
   let iframeSelector =
     "#orca-payment-element-iframeRef-orca-elements-payment-element-payment-element";
 
-  // changeObjectKeyValue(createPaymentBody,"profile_id","YOUR_PROFILE_ID")
-
+  changeObjectKeyValue(createPaymentBody,"customer_id","hyperswitch_sdk_demo_id")
 
+
   beforeEach(() => {
     getIframeBody = () => cy.iframe(iframeSelector);
     cy.createPaymentIntent(secretKey, createPaymentBody).then(() => {

cypress-tests/cypress/e2e/stripe-3ds-test.cy.ts

@@ -0,0 +1,57 @@
+import * as testIds from "../../../src/Utilities/TestUtils.bs";
+import { getClientURL } from "../support/utils";
+import { createPaymentBody } from "../support/utils";
+import { changeObjectKeyValue } from "../support/utils";
+import { stripeCards } from "cypress/support/cards";
+
+describe("Card payment flow test", () => {
+
+  const publishableKey = Cypress.env('HYPERSWITCH_PUBLISHABLE_KEY')
+  const secretKey = Cypress.env('HYPERSWITCH_SECRET_KEY')
+  let getIframeBody: () => Cypress.Chainable<JQuery<HTMLBodyElement>>;
+  let iframeSelector =
+    "#orca-payment-element-iframeRef-orca-elements-payment-element-payment-element";
+
+  changeObjectKeyValue(createPaymentBody,"authentication_type","three_ds")
+
+
+  beforeEach(() => {
+    getIframeBody = () => cy.iframe(iframeSelector);
+    cy.createPaymentIntent(secretKey, createPaymentBody).then(() => {
+      cy.getGlobalState("clientSecret").then((clientSecret) => {
+
+        cy.visit(getClientURL(clientSecret, publishableKey));
+      });
+
+    })
+  });
+
+  it("title rendered correctly", () => {
+    cy.contains("Hyperswitch Unified Checkout").should("be.visible");
+  });
+
+  it("orca-payment-element iframe loaded", () => {
+    cy.get(iframeSelector)
+      .should("be.visible")
+      .its("0.contentDocument")
+      .its("body");
+  });
+
+  it("should complete the card payment successfully", () => {
+    // Visit the page with the payment form
+const{ cardNo,cvc, card_exp_month, card_exp_year}=stripeCards.threeDSCard
+    // Wait for iframe to load and get its body
+    getIframeBody().find('[data-testid=cardNoInput]').type(cardNo); // Example card number
+    getIframeBody().find('[data-testid=expiryInput]').type(card_exp_month); // Expiration month
+    getIframeBody().find('[data-testid=expiryInput]').type(card_exp_year); // Expiration year
+    getIframeBody().find('[data-testid=cvvInput]').type(cvc); // CVV
+
+    // Click on the submit button
+    getIframeBody().get("#submit").click();
+
+    // Wait for the response and assert payment success message
+    cy.wait(3000); // Adjust wait time based on actual response time
+    cy.url().should('include', 'hooks.stripe.com/3d_secure_2');
+  });
+});
+

cypress-tests/cypress/e2e/stripe-Manualcapture-test.cy.ts

@@ -0,0 +1,48 @@
+import * as testIds from "../../../src/Utilities/TestUtils.bs";
+import { getClientURL } from "../support/utils";
+import { createPaymentBody } from "../support/utils";
+import { changeObjectKeyValue } from "../support/utils";
+import { stripeCards } from "cypress/support/cards";
+
+describe("Card payment flow test", () => {
+
+  const publishableKey = Cypress.env('HYPERSWITCH_PUBLISHABLE_KEY')
+  const secretKey = Cypress.env('HYPERSWITCH_SECRET_KEY')
+  let getIframeBody: () => Cypress.Chainable<JQuery<HTMLBodyElement>>;
+  let iframeSelector =
+    "#orca-payment-element-iframeRef-orca-elements-payment-element-payment-element";
+
+   changeObjectKeyValue(createPaymentBody,"capture_method","manual")
+
+
+  beforeEach(() => {
+    getIframeBody = () => cy.iframe(iframeSelector);
+    cy.createPaymentIntent(secretKey, createPaymentBody).then(() => {
+      cy.getGlobalState("clientSecret").then((clientSecret) => {
+
+        cy.visit(getClientURL(clientSecret, publishableKey));
+      });
+
+    })
+  });
+
+it("should complete the card payment successfully", () => {
+
+    const { cardNo, card_exp_month, card_exp_year, cvc } = stripeCards.successCard;
+
+    // Wait for iframe to load and get its body
+    getIframeBody().find('[data-testid=cardNoInput]').type(cardNo); // Example card number
+    getIframeBody().find('[data-testid=expiryInput]').type(card_exp_month); // Expiration month
+    getIframeBody().find('[data-testid=expiryInput]').type(card_exp_year); // Expiration year
+    getIframeBody().find('[data-testid=cvvInput]').type(cvc); // CVV
+
+    // Click on the submit button
+    getIframeBody().get("#submit").click();
+
+     // Wait for the response and assert payment processing message
+  cy.wait(3000);
+  cy.contains('Payment processing! Requires manual capture')
+  .should('be.visible');
+
+});
+});

cypress-tests/cypress/support/cards.ts

@@ -0,0 +1,72 @@
+export type cardDetails = {
+    cardNo: string,
+    cardScheme: string,
+    cvc: string,
+    card_exp_month: string,
+    card_exp_year: string,
+
+}
+
+
+type connectorCard = {
+    successCard: cardDetails
+    failureCard: cardDetails
+    threeDSCard: cardDetails
+    invalidCard: cardDetails
+    invalidCVC : cardDetails
+    invalidMonth:cardDetails
+    invalidYear: cardDetails
+}
+
+
+export const stripeCards = {
+    successCard: {
+        cardNo: "4242424242424242",
+        cardScheme: "Visa",
+        cvc: "123",
+        card_exp_month:"12",
+        card_exp_year:"30",
+    },
+    failureCard: {
+        cardNo: "4000000000000002",
+        cardScheme: "Visa",
+        cvc: "123",
+        card_exp_month:"12",
+        card_exp_year:"30",
+    },
+    invalidYear: {
+        cardNo: "4242424242424242",
+        cardScheme: "Visa",
+        cvc: "123",
+        card_exp_month:"12",
+        card_exp_year:"10",
+    },
+    invalidCVC: {
+        cardNo: "4000000000000002",
+        cardScheme: "Visa",
+        cvc: "12",
+        card_exp_month:"12",
+        card_exp_year:"30",
+    },
+    invalidCard: {
+        cardNo: "400000000000000",
+        cardScheme: "Visa",
+        cvc: "123",
+        card_exp_month:"12",
+        card_exp_year:"30",
+    },
+    invalidMonth: {
+        cardNo: "4000000000000002",
+        cardScheme: "Visa",
+        cvc: "123",
+        card_exp_month:"13",
+        card_exp_year:"30",
+    },
+    threeDSCard: {
+        cardNo: "4000000000003220",
+        cardScheme: "Visa",
+        cvc: "123",
+        card_exp_month:"13",
+        card_exp_year:"30",
+    },
+}

cypress-tests/cypress/support/commands.ts

@@ -73,7 +73,7 @@ Cypress.Commands.add(
     if (isThreeDSEnabled) {
       mapping[testIds.cardNoInputTestId] = customerData.threeDSCardNo;
     }
-    let publishableKey = "pk_snd_3b33cd9404234113804aa1accaabe22f";
+
     let clientSecret: string;
     cy.request({
       method: "GET",