nocodb/scripts/cypress/integration/common/3e_duration_column.js

import { mainPage } from "../../support/page_objects/mainPage";
import { isTestSuiteActive } from "../../support/page_objects/projectConstants";

export const genTest = (apiType, dbType) => {
  if (!isTestSuiteActive(apiType, dbType)) return;

  describe(`${apiType.toUpperCase()} api - DURATION`, () => {
    const tableName = "DurationTable";

    // to retrieve few v-input nodes from their label
    //
    const fetchParentFromLabel = (label) => {
      cy.get("label").contains(label).parents(".ant-row").first().click();
    };

    before(() => {
      cy.restoreLocalStorage();
      cy.createTable(tableName);
      cy.saveLocalStorage();
    });

    // Run once before test- create table
    //
    beforeEach(() => {
      cy.restoreLocalStorage();
    });

    afterEach(() => {
      cy.saveLocalStorage();
    });

    after(() => {
      cy.restoreLocalStorage();
      cy.deleteTable(tableName);
      cy.saveLocalStorage();
    });

    // Routine to create a new look up column
    //
    const addDurationColumn = (columnName, durationFormat) => {
      cy.get(".nc-grid  tr > th:last .nc-icon").click({
        force: true,
      });

      cy.getActiveMenu(".nc-dropdown-grid-add-column")
        .find("input.nc-column-name-input", { timeout: 3000 })
        .should("exist")
        .clear()
        .type(columnName);
      cy.getActiveMenu(".nc-dropdown-grid-add-column")
        .find(".nc-column-type-input")
        .last()
        .click()
        .type("Duration");
      cy.getActiveSelection(".nc-dropdown-column-type")
        .find(".ant-select-item-option")
        .contains("Duration")
        .click();

      cy.inputHighlightRenderWait();

      // Configure Duration format
      fetchParentFromLabel("Duration Format");
      cy.getActiveSelection(".nc-dropdown-duration-option")
        .find(".ant-select-item-option")
        .contains(durationFormat)
        .click();

      cy.getActiveMenu(".nc-dropdown-grid-add-column")
        .find(".ant-btn-primary:visible")
        .contains("Save")
        .click();
      cy.toastWait(`Column created`);

      cy.get(`th[data-title="${columnName}"]`).should("exist");
    };

    // routine to delete column
    //
    const deleteColumnByName = (columnName) => {
      mainPage.deleteColumn(columnName);
    };

    // routine to edit column
    //
    const editColumnByName = (oldName, newName, newDurationFormat) => {
      cy.get(`th:contains(${oldName}) .nc-icon.ant-dropdown-trigger`)
        .trigger("mouseover", { force: true })
        .click({ force: true });

      cy.getActiveMenu(".nc-dropdown-column-operations")
        .find(".nc-column-edit")
        .click();

      // rename column and verify
      cy.getActiveMenu(".nc-dropdown-edit-column")
        .find("input.nc-column-name-input", { timeout: 3000 })
        .should("exist")
        .clear()
        .type(newName);

      cy.inputHighlightRenderWait();

      // Configure Duration format
      fetchParentFromLabel("Duration Format");
      cy.getActiveSelection(".nc-dropdown-duration-option")
        .find(".ant-select-item-option")
        .contains(newDurationFormat)
        .click();

      cy.getActiveMenu(".nc-dropdown-edit-column")
        .find(".ant-btn-primary:visible")
        .contains("Save")
        .click();

      cy.toastWait("Column updated");

      cy.get(`th:contains(${oldName})`).should("not.exist");
      cy.get(`th:contains(${newName})`).should("exist");
    };

    const addDurationData = (
      colName,
      index,
      cellValue,
      expectedValue,
      isNewRow = false
    ) => {
      if (isNewRow) {
        mainPage.addNewRowExpand("DurationTable");
      } else {
        // mainPage.getRow(index).find(".nc-row-expand-icon").click({ force: true });
        cy.get(".nc-row-expand")
          .eq(index - 1)
          .click({ force: true });
      }
      cy.get(".duration-cell-wrapper > input")
        .first()
        .should("exist")
        .type(cellValue);
      cy.getActiveDrawer(".nc-drawer-expanded-form")
        .find("button")
        .contains("Save row")
        .should("exist")
        .click();
      cy.toastWait("Row updated successfully");
      cy.getActiveDrawer(".nc-drawer-expanded-form")
        .find("button")
        .contains("Cancel")
        .should("exist")
        .click();
      mainPage.getCell(colName, index).contains(expectedValue).should("exist");
    };

    ///////////////////////////////////////////////////
    // Test case
    {
      // Duration: h:mm
      it("Duration: h:mm", () => {
        addDurationColumn("NC_DURATION_0", "h:mm (e.g. 1:23)");
        addDurationData("NC_DURATION_0", 1, "1:30", "01:30", true);
        addDurationData("NC_DURATION_0", 2, "30", "00:30", true);
        addDurationData("NC_DURATION_0", 3, "60", "01:00", true);
        addDurationData("NC_DURATION_0", 4, "80", "01:20", true);
        addDurationData("NC_DURATION_0", 5, "12:34", "12:34", true);
        addDurationData("NC_DURATION_0", 6, "15:130", "17:10", true);
        addDurationData("NC_DURATION_0", 7, "123123", "2052:03", true);
      });

      it("Duration: Edit Column NC_DURATION_0", () => {
        editColumnByName(
          "NC_DURATION_0",
          "NC_DURATION_EDITED_0",
          "h:mm:ss (e.g. 3:45, 1:23:40)"
        );
      });

      it("Duration: Delete column", () => {
        deleteColumnByName("NC_DURATION_EDITED_0");
      });
    }

    {
      // Duration: h:mm:ss
      it("Duration: h:mm:ss", () => {
        addDurationColumn("NC_DURATION_1", "h:mm:ss (e.g. 3:45, 1:23:40)");
        addDurationData("NC_DURATION_1", 1, "11:22:33", "11:22:33");
        addDurationData("NC_DURATION_1", 2, "1234", "00:20:34");
        addDurationData("NC_DURATION_1", 3, "50", "00:00:50");
        addDurationData("NC_DURATION_1", 4, "1:1111", "00:19:31");
        addDurationData("NC_DURATION_1", 5, "1:11:1111", "01:29:31");
        addDurationData("NC_DURATION_1", 6, "15:130", "00:17:10");
        addDurationData("NC_DURATION_1", 7, "123123", "34:12:03");
      });

      it("Duration: Edit Column NC_DURATION_1", () => {
        editColumnByName(
          "NC_DURATION_1",
          "NC_DURATION_EDITED_1",
          "h:mm:ss.s (e.g. 3:34.6, 1:23:40.0)"
        );
      });

      it("Duration: Delete column", () => {
        deleteColumnByName("NC_DURATION_EDITED_1");
      });
    }

    {
      // h:mm:ss.s
      it("Duration: h:mm:ss.s", () => {
        addDurationColumn(
          "NC_DURATION_2",
          "h:mm:ss.s (e.g. 3:34.6, 1:23:40.0)"
        );
        addDurationData("NC_DURATION_2", 1, "1234", "00:20:34.0");
        addDurationData("NC_DURATION_2", 2, "12:34", "00:12:34.0");
        addDurationData("NC_DURATION_2", 3, "12:34:56", "12:34:56.0");
        addDurationData("NC_DURATION_2", 4, "12:34:999", "12:50:39.0");
        addDurationData("NC_DURATION_2", 5, "12:999:56", "28:39:56.0");
        addDurationData("NC_DURATION_2", 6, "12:34:56.12", "12:34:56.1");
        addDurationData("NC_DURATION_2", 7, "12:34:56.199", "12:34:56.2");
      });

      it("Duration: Edit Column NC_DURATION_2", () => {
        editColumnByName(
          "NC_DURATION_2",
          "NC_DURATION_EDITED_2",
          "h:mm:ss (e.g. 3:45, 1:23:40)"
        );
      });

      it("Duration: Delete column", () => {
        deleteColumnByName("NC_DURATION_EDITED_2");
      });
    }

    {
      // h:mm:ss.ss
      it("Duration: h:mm:ss.ss", () => {
        addDurationColumn(
          "NC_DURATION_3",
          "h:mm:ss.ss (e.g. 3.45.67, 1:23:40.00)"
        );
        addDurationData("NC_DURATION_3", 1, "1234", "00:20:34.00");
        addDurationData("NC_DURATION_3", 2, "12:34", "00:12:34.00");
        addDurationData("NC_DURATION_3", 3, "12:34:56", "12:34:56.00");
        addDurationData("NC_DURATION_3", 4, "12:34:999", "12:50:39.00");
        addDurationData("NC_DURATION_3", 5, "12:999:56", "28:39:56.00");
        addDurationData("NC_DURATION_3", 6, "12:34:56.12", "12:34:56.12");
        addDurationData("NC_DURATION_3", 7, "12:34:56.199", "12:34:56.20");
      });

      it("Duration: Edit Column NC_DURATION_3", () => {
        editColumnByName(
          "NC_DURATION_3",
          "NC_DURATION_EDITED_3",
          "h:mm:ss.ss (e.g. 3.45.67, 1:23:40.00)"
        );
      });

      it("Duration: Delete column", () => {
        deleteColumnByName("NC_DURATION_EDITED_3");
      });
    }

    {
      // h:mm:ss.sss
      it("Duration: h:mm:ss.sss", () => {
        addDurationColumn(
          "NC_DURATION_4",
          "h:mm:ss.sss (e.g. 3.45.678, 1:23:40.000)"
        );
        addDurationData("NC_DURATION_4", 1, "1234", "00:20:34.000");
        addDurationData("NC_DURATION_4", 2, "12:34", "00:12:34.000");
        addDurationData("NC_DURATION_4", 3, "12:34:56", "12:34:56.000");
        addDurationData("NC_DURATION_4", 4, "12:34:999", "12:50:39.000");
        addDurationData("NC_DURATION_4", 5, "12:999:56", "28:39:56.000");
        addDurationData("NC_DURATION_4", 6, "12:34:56.12", "12:34:56.012");
        addDurationData("NC_DURATION_4", 7, "12:34:56.199", "12:34:56.199");
      });

      it("Duration: Edit Column NC_DURATION_4", () => {
        editColumnByName(
          "NC_DURATION_4",
          "NC_DURATION_EDITED_4",
          "h:mm (e.g. 1:23)"
        );
      });

      it("Duration: Delete column", () => {
        deleteColumnByName("NC_DURATION_EDITED_4");
      });
    }
  });
};