test: updated filter tests (#9448)

* Filter Tests

* Test spec added

* updated import

* added some wait

* updated the dependencies

* Added the dependancy files

app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/DisplayWidgets/Table_Filter_spec.js

@@ -0,0 +1,260 @@
+const widgetsPage = require("../../../../locators/Widgets.json");
+const commonlocators = require("../../../../locators/commonlocators.json");
+const publish = require("../../../../locators/publishWidgetspage.json");
+const dsl = require("../../../../fixtures/tableWidgetDsl.json");
+
+describe("Table Widget Filter Functionality", function() {
+  before(() => {
+    cy.addDsl(dsl);
+  });
+
+  it("Table Widget Functionality", function() {
+    cy.openPropertyPane("tablewidget");
+    cy.widgetText("Table1", widgetsPage.tableWidget, commonlocators.tableInner);
+    cy.testJsontext("tabledata", JSON.stringify(this.data.TableInput));
+    cy.wait("@updateLayout");
+  });
+
+  it("Table Widget Functionality To validate download csv and download Excel", function() {
+    cy.isSelectRow(1);
+    cy.readTabledataPublish("1", "3").then((tabData) => {
+      const tabValue = tabData;
+      expect(tabValue).to.be.equal("Lindsay Ferguson");
+      cy.log("the value is" + tabValue);
+      cy.get(publish.searchInput)
+        .first()
+        .type(tabData);
+      // eslint-disable-next-line cypress/no-unnecessary-waiting
+      cy.wait(500);
+      cy.readTabledataPublish("1", "3").then((tabData) => {
+        const tabValue = tabData;
+        expect(tabValue).to.be.equal("Lindsay Ferguson");
+      });
+      cy.downloadData("Download as CSV");
+      // eslint-disable-next-line cypress/no-unnecessary-waiting
+      cy.wait(5000);
+      //cy.validateDownload('Table1.csv');
+      cy.verifyDownload("Table1.csv");
+      cy.downloadData("Download as Excel");
+      cy.wait(5000);
+      //cy.validateDownload('Table1.xlsx');
+      cy.verifyDownload("Table1.xlsx");
+      cy.get(publish.searchInput)
+        .first()
+        .within(() => {
+          return cy.get("input").clear();
+        })
+        .type("7434532");
+      // eslint-disable-next-line cypress/no-unnecessary-waiting
+      cy.wait(1000);
+      cy.readTabledataPublish("3", "3").then((tabData) => {
+        const tabValue = tabData;
+        expect(tabValue).to.be.equal("Byron Fields");
+      });
+    });
+  });
+
+  it("Table Widget Functionality To Filter The Data using does not contain", function() {
+    cy.isSelectRow(1);
+    cy.readTabledataPublish("1", "3").then((tabData) => {
+      const tabValue = tabData;
+      expect(tabValue).to.be.equal("Lindsay Ferguson");
+      cy.log("the value is" + tabValue);
+      cy.get(publish.filterBtn).click();
+      cy.get(publish.attributeDropdown).click();
+      cy.get(publish.attributeValue)
+        .contains("userName")
+        .click();
+      cy.get(publish.conditionDropdown).click();
+      cy.get(publish.attributeValue)
+        .contains("does not contain")
+        .click();
+      cy.get(publish.inputValue).type("Lindsay");
+      // eslint-disable-next-line cypress/no-unnecessary-waiting
+      cy.wait(500);
+      cy.get(widgetsPage.filterApplyBtn).click({ force: true });
+      cy.wait(500);
+      cy.readTabledataPublish("0", "3").then((tabData) => {
+        const tabValue = tabData;
+        expect(tabValue).not.to.be.equal("Lindsay Ferguson");
+      });
+      cy.get(widgetsPage.filterCloseBtn).click({ force: true });
+      cy.get(publish.filterBtn).click();
+      cy.get(publish.removeFilter).click();
+      // eslint-disable-next-line cypress/no-unnecessary-waiting
+      cy.wait(500);
+      cy.readTabledataPublish("0", "3").then((tabData) => {
+        const tabValue = tabData;
+        expect(tabValue).to.be.equal("Michael Lawson");
+      });
+      cy.get(publish.canvas)
+        .first()
+        .click({ force: true });
+    });
+  });
+
+  it("Table Widget Functionality To Filter The Data using OR operator ", function() {
+    cy.isSelectRow(1);
+    cy.readTabledataPublish("1", "3").then((tabData) => {
+      const tabValue = tabData;
+      expect(tabValue).to.be.equal("Lindsay Ferguson");
+      cy.log("the value is" + tabValue);
+      cy.get(publish.filterBtn).click();
+      cy.get(publish.attributeDropdown).click();
+      cy.get(publish.attributeValue)
+        .contains("userName")
+        .click();
+      cy.get(publish.conditionDropdown).click();
+      cy.get(publish.attributeValue)
+        .contains("contains")
+        .click();
+      cy.get(publish.inputValue).type("Tobias Funke");
+
+      // eslint-disable-next-line cypress/no-unnecessary-waiting
+      cy.wait(500);
+      cy.AddFilterWithOperator(
+        "OR",
+        "email",
+        "contains",
+        "tobias.funke@reqres.in",
+      );
+      cy.wait(500);
+      cy.get(widgetsPage.filterApplyBtn).click({ force: true });
+      cy.wait(500);
+      cy.readTabledataPublish("0", "3").then((tabData) => {
+        const tabValue = tabData;
+        expect(tabValue).to.be.equal("Tobias Funke");
+      });
+      cy.get(widgetsPage.filterCloseBtn).click({ force: true });
+      cy.get(publish.filterBtn).click();
+      cy.get(publish.removeFilter)
+        .first()
+        .click({ force: true });
+      cy.get(publish.removeFilter)
+        .last()
+        .click({ force: true });
+      // eslint-disable-next-line cypress/no-unnecessary-waiting
+      cy.wait(500);
+      cy.readTabledataPublish("0", "3").then((tabData) => {
+        const tabValue = tabData;
+        expect(tabValue).to.be.equal("Michael Lawson");
+      });
+      cy.get(publish.canvas)
+        .first()
+        .click({ force: true });
+    });
+  });
+
+  it("Table Widget Functionality To Filter The Data using AND operator ", function() {
+    cy.isSelectRow(1);
+    cy.readTabledataPublish("1", "3").then((tabData) => {
+      const tabValue = tabData;
+      expect(tabValue).to.be.equal("Lindsay Ferguson");
+      cy.log("the value is" + tabValue);
+      cy.get(publish.filterBtn).click();
+      cy.get(publish.attributeDropdown).click();
+      cy.get(publish.attributeValue)
+        .contains("userName")
+        .click();
+      cy.get(publish.conditionDropdown).click();
+      cy.get(publish.attributeValue)
+        .contains("contains")
+        .click();
+      cy.get(publish.inputValue).type("Tobias Funke");
+
+      // eslint-disable-next-line cypress/no-unnecessary-waiting
+      cy.wait(500);
+      cy.AddFilterWithOperator(
+        "AND",
+        "email",
+        "contains",
+        "tobias.funke@reqres.in",
+      );
+      cy.wait(500);
+      cy.get(widgetsPage.filterApplyBtn).click({ force: true });
+      cy.wait(500);
+      cy.readTabledataPublish("0", "3").then((tabData) => {
+        const tabValue = tabData;
+        expect(tabValue).to.be.equal("Tobias Funke");
+      });
+      cy.get(widgetsPage.filterCloseBtn).click({ force: true });
+      cy.get(publish.filterBtn).click();
+      cy.get(publish.removeFilter)
+        .first()
+        .click({ force: true });
+      cy.get(publish.removeFilter)
+        .last()
+        .click({ force: true });
+      // eslint-disable-next-line cypress/no-unnecessary-waiting
+      cy.wait(500);
+      cy.readTabledataPublish("0", "3").then((tabData) => {
+        const tabValue = tabData;
+        expect(tabValue).to.be.equal("Michael Lawson");
+      });
+      cy.get(publish.canvas)
+        .first()
+        .click({ force: true });
+    });
+  });
+
+  it("Table Widget Functionality To Filter The Data using OR operator with different data ", function() {
+    cy.isSelectRow(1);
+    cy.readTabledataPublish("1", "3").then((tabData) => {
+      const tabValue = tabData;
+      expect(tabValue).to.be.equal("Lindsay Ferguson");
+      cy.log("the value is" + tabValue);
+      cy.get(publish.filterBtn).click();
+      cy.get(publish.attributeDropdown).click();
+      cy.get(publish.attributeValue)
+        .contains("userName")
+        .click();
+      cy.get(publish.conditionDropdown).click();
+      cy.get(publish.attributeValue)
+        .contains("contains")
+        .click();
+      cy.get(publish.inputValue).type("Lindsay Ferguson");
+
+      // eslint-disable-next-line cypress/no-unnecessary-waiting
+      cy.wait(500);
+      cy.AddFilterWithOperator(
+        "OR",
+        "email",
+        "contains",
+        "tobias.funke@reqres.in",
+      );
+      cy.wait(500);
+      cy.get(widgetsPage.filterApplyBtn).click({ force: true });
+      cy.wait(500);
+      cy.readTabledataPublish("0", "3").then((tabData) => {
+        const tabValue = tabData;
+        expect(tabValue).to.be.equal("Lindsay Ferguson");
+      });
+      cy.readTabledataPublish("1", "3").then((tabData) => {
+        const tabValue = tabData;
+        expect(tabValue).to.be.equal("Tobias Funke");
+      });
+      cy.get(widgetsPage.filterCloseBtn).click({ force: true });
+      cy.get(publish.filterBtn).click();
+      cy.get(publish.removeFilter)
+        .first()
+        .click({ force: true });
+      cy.wait(500);
+      cy.get(publish.removeFilter)
+        .last()
+        .click({ force: true });
+      // eslint-disable-next-line cypress/no-unnecessary-waiting
+      cy.wait(1000);
+      cy.readTabledataPublish("0", "3").then((tabData) => {
+        const tabValue = tabData;
+        expect(tabValue).to.be.equal("Michael Lawson");
+      });
+      cy.get(publish.canvas)
+        .first()
+        .click({ force: true });
+    });
+  });
+
+  afterEach(() => {
+    // put your clean up code if any
+  });
+});

app/client/cypress/locators/publishWidgetspage.json

@@ -44,5 +44,9 @@
   "pageInfo": ".bp3-heading",
   "inputGrp": ".bp3-input-group input",
   "datePickerNew": ".t--widget-datepickerwidget2",
-  "tab": ".t--tab-Tab"
+  "tab": ".t--tab-Tab",
+  "downloadOption": ".t--table-download-data-option",
+  "addFilter": ".t--add-filter-btn",
+  "operatorsDropdown": ".t--table-filter-operators-dropdown",
+  "attributesDropdown": ".t--table-filter-columns-dropdown"
 }

app/client/cypress/plugins/index.js

@@ -5,6 +5,7 @@ const path = require("path");
 const dotenv = require("dotenv");
 const chalk = require("chalk");
 const cypressLogToOutput = require("cypress-log-to-output");
+const { isFileExist } = require("cy-verify-downloads");
 
 // ***********************************************************
 // This example plugins/index.js can be used to load plugins
@@ -30,13 +31,19 @@ module.exports = (on, config) => {
     }
     return false;
   });
+};
+
+module.exports = (on, config) => {
+  on("task", {
+    isFileExist,
+  });
 
   // `on` is used to hook into various events Cypress emits
   // `config` is the resolved Cypress config
   on("before:browser:launch", (browser = {}, launchOptions) => {
     /*
-      Uncomment below to get console log printed in cypress output
-    */
+        Uncomment below to get console log printed in cypress output
+      */
 
     launchOptions.args = cypressLogToOutput.browserLaunchHandler(
       browser,

app/client/cypress/support/commands.js

@@ -2,7 +2,9 @@
 /* eslint-disable cypress/no-unnecessary-waiting */
 /* eslint-disable cypress/no-assigning-return-values */
 
+require("cy-verify-downloads").addCustomCommand();
 require("cypress-file-upload");
+
 const dayjs = require("dayjs");
 
 const loginPage = require("../locators/LoginPage.json");
@@ -27,6 +29,7 @@ const generatePage = require("../locators/GeneratePage.json");
 const jsEditorLocators = require("../locators/JSEditor.json");
 const queryLocators = require("../locators/QueryEditor.json");
 const welcomePage = require("../locators/welcomePage.json");
+const publishWidgetspage = require("../locators/publishWidgetspage.json");
 
 let pageidcopy = " ";
 const chainStart = Symbol();
@@ -81,6 +84,49 @@ Cypress.Commands.add(
   },
 );
 
+Cypress.Commands.add("downloadData", (filetype) => {
+  cy.get(publishWidgetspage.downloadBtn).click({ force: true });
+
+  cy.get(publishWidgetspage.downloadOption)
+    .contains(filetype)
+    .click({ force: true });
+});
+
+Cypress.Commands.add("validateDownload", (fileName) => {
+  const downloadedFilename = Cypress.config("downloadsFolder")
+    .concat("/")
+    .concat(fileName);
+  cy.readFile(downloadedFilename, "binary", {
+    timeout: 15000,
+  }).should((buffer) => expect(buffer.length).to.be.gt(100));
+});
+
+Cypress.Commands.add(
+  "AddFilterWithOperator",
+  (operator, option, condition, value) => {
+    cy.get(publishWidgetspage.addFilter).click();
+    cy.get(publishWidgetspage.operatorsDropdown).click({ force: true });
+    cy.get(publishWidgetspage.attributeValue)
+      .contains(operator)
+      .click({ force: true });
+    cy.get(publishWidgetspage.attributesDropdown)
+      .last()
+      .click({ force: true });
+    cy.get(publishWidgetspage.attributeValue)
+      .contains(option)
+      .click({ force: true });
+    cy.get(publishWidgetspage.conditionDropdown)
+      .last()
+      .click({ force: true });
+    cy.get(publishWidgetspage.attributeValue)
+      .contains(condition)
+      .click({ force: true });
+    cy.get(publishWidgetspage.inputValue)
+      .last()
+      .type(value);
+  },
+);
+
 Cypress.Commands.add("navigateToOrgSettings", (orgName) => {
   cy.get(homePage.orgList.concat(orgName).concat(")"))
     .scrollIntoView()

app/client/package.json

@@ -250,6 +250,7 @@
     "cypress-multi-reporters": "^1.2.4",
     "cypress-real-events": "^1.5.1",
     "cypress-xpath": "^1.4.0",
+    "cy-verify-downloads": "^0.0.5",
     "dotenv": "^8.1.0",
     "eslint": "^7.11.0",
     "eslint-config-prettier": "^6.12.0",