IO-2327 payments test cases

client/cypress/e2e/payments/entering-payments.cy.js

@@ -0,0 +1,89 @@
+describe(
+  "Entering payment for the job",
+  {
+    defaultCommandTimeout: 5000,
+  },
+  () => {
+    beforeEach(() => {
+      cy.visit("/manage");
+
+      cy.get("body").then(($body) => {
+        if ($body.text().includes("Login")) {
+          // Log in
+          cy.get('[data-cy="username"]').type("john@imex.dev");
+          cy.get('[data-cy="password"]').type("john123");
+          cy.get('[data-cy="sign-in-button"]').click();
+        }
+
+        cy.get(".ant-table-tbody")
+          .should("be.visible")
+          .find("tr")
+          .should("not.have.class", "ant-table-placeholder");
+
+        cy.get(".ant-table-row")
+          .not(':contains("Open")')
+          .first()
+          .find("a")
+          .first()
+          .click();
+
+        cy.url().should("include", "/manage/jobs");
+
+        // Go to totals data tab
+        cy.get('[data-cy="tab-totals"]').should("be.visible").click();
+      });
+    });
+
+    it("enters a payment manually", () => {
+      cy.get('[data-cy="job-payment-button"]').should("be.visible").click();
+
+      // fill out form
+      cy.get('[data-cy="payment-amount"]').type(100);
+      cy.get('[data-cy="payment-transactionid"]').type("QBD-P-03");
+      cy.get('[data-cy="payment-memo"]').type("e2e testing");
+      cy.get('[data-cy="payment-date"]').click();
+      cy.get('[title="2023-07-03"]').should("be.visible").click();
+
+      cy.antdSelect("payer");
+      cy.antdSelect("type");
+
+      cy.get('[data-cy="payment-form-save"]').click();
+    });
+
+    // TODO Add payment using intellipay
+
+    it("marks payment as exported", () => {
+      cy.get('[data-cy="payments-table"]')
+        .find(".ant-table-tbody")
+        .find("> tr:not(.ant-table-measure-row)")
+        .as("payments-table")
+        .should("not.have.class", "ant-table-placeholder");
+
+      cy.get("@payments-table")
+        .first()
+        .find('[data-cy="edit-payment-button"]')
+        .click();
+
+      cy.get('[data-cy="payment-markexported"]')
+        .should("not.be.disabled")
+        .click();
+    });
+
+    it("marks payment for re-export", () => {
+      cy.get('[data-cy="payments-table"]')
+        .find(".ant-table-tbody")
+        .find("> tr:not(.ant-table-measure-row)")
+        .as("payments-table")
+        .should("not.have.class", "ant-table-placeholder");
+
+      cy.get("@payments-table")
+        .last()
+        .find('[data-cy="edit-payment-button"]')
+        .click();
+
+      cy.get('[data-cy="payment-markforreexport"]')
+        .should("not.be.disabled")
+        .click();
+    });
+  }
+);

client/src/components/job-payments/job-payments.component.jsx

@@ -100,6 +100,7 @@ export function JobPayments({
         <Space wrap>
           <Button
             // disabled={record.exportedat}
+            data-cy="edit-payment-button"
             onClick={() => {
               setPaymentContext({
                 actions: { refetch: refetch },
@@ -150,6 +151,7 @@ export function JobPayments({
       extra={
         <Space wrap>
           <Button
+            data-cy="job-payment-button"
             disabled={!job.converted}
             onClick={() =>
               setPaymentContext({
@@ -170,6 +172,7 @@ export function JobPayments({
       }
     >
       <Table
+        data-cy="payments-table"
         columns={columns}
         rowKey="id"
         pagination={false}

client/src/components/payment-form/payment-form.component.jsx

@@ -15,11 +15,7 @@ const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
 });
 
-export function PaymentFormComponent({
+export function PaymentFormComponent({ form, bodyshop, disabled }) {
-  form,
-  bodyshop,
-  disabled,
-}) {
   const { Qb_Multi_Ar } = useTreatments(
     ["Qb_Multi_Ar"],
     {},
@@ -65,16 +61,16 @@ export function PaymentFormComponent({
             },
           ]}
         >
-          <CurrencyInput disabled={disabled} />
+          <CurrencyInput data-cy="payment-amount" disabled={disabled} />
         </Form.Item>
         <Form.Item
           label={t("payments.fields.transactionid")}
           name="transactionid"
         >
-          <Input disabled={disabled} />
+          <Input data-cy="payment-transactionid" disabled={disabled} />
         </Form.Item>
         <Form.Item label={t("payments.fields.memo")} name="memo">
-          <Input disabled={disabled} />
+          <Input data-cy="payment-memo" disabled={disabled} />
         </Form.Item>
         <Form.Item
           label={t("payments.fields.date")}
@@ -86,7 +82,7 @@ export function PaymentFormComponent({
             },
           ]}
         >
-          <DatePickerFormItem disabled={disabled} />
+          <DatePickerFormItem data-cy="payment-date" disabled={disabled} />
         </Form.Item>
       </LayoutFormRow>
 
@@ -101,7 +97,11 @@ export function PaymentFormComponent({
             },
           ]}
         >
-          <Select disabled={disabled}>
+          <Select
+            data-cy="payment-customer"
+            className="ant-select-payer"
+            disabled={disabled}
+          >
             <Select.Option value={t("payments.labels.customer")}>
               {t("payments.labels.customer")}
             </Select.Option>
@@ -133,7 +133,11 @@ export function PaymentFormComponent({
             },
           ]}
         >
-          <Select disabled={disabled}>
+          <Select
+            data-cy="payment-type"
+            className="ant-select-type"
+            disabled={disabled}
+          >
             {bodyshop.md_payment_types.map((v, idx) => (
               <Select.Option key={idx} value={v}>
                 {v}

client/src/components/payment-mark-export-button/payment-mark-export-button-component.jsx

@@ -88,6 +88,7 @@ const PaymentMarkForExportButton = ({
       onClick={handleClick}
       loading={exportLogLoading || updatePaymentLoading}
       disabled={!!payment.exportedat}
+      data-cy="payment-markexported"
     >
       {t("payments.labels.markexported")}
     </Button>

client/src/components/payment-modal/payment-modal.container.jsx

@@ -161,7 +161,11 @@ function PaymentModalContainer({
       footer={
         <span>
           <Button onClick={handleCancel}>{t("general.actions.cancel")}</Button>
-          <Button loading={loading} onClick={() => form.submit()}>
+          <Button
+            data-cy="payment-form-save"
+            loading={loading}
+            onClick={() => form.submit()}
+          >
             {t("general.actions.save")}
           </Button>
           {paymentModal.context && paymentModal.context.id ? null : (

client/src/components/payment-reexport-button/payment-reexport-button.component.jsx

@@ -57,6 +57,7 @@ const PaymentReexportButton = ({ payment, refetch, setPaymentContext }) => {
       onClick={handleClick}
       loading={loading}
       disabled={!payment.exportedat}
+      data-cy="payment-markforreexport"
     >
       {t("payments.labels.markforreexport")}
     </Button>

client/src/pages/jobs-detail/jobs-detail.page.component.jsx

@@ -301,7 +301,7 @@ export function JobsDetailPage({
           </Tabs.TabPane>
           <Tabs.TabPane
             tab={
-              <span>
+              <span data-cy="tab-totals">
                 <DollarCircleOutlined />
                 {t("menus.jobsdetail.totals")}
               </span>