Added tests for Table binding with Input Widget (#1955)

Co-authored-by: nandan.anantharamu <nandan.anantharamu@thoughtspot.com>
Co-authored-by: Arpit Mohan <arpit@appsmith.com>

app/client/.eslintrc.js

@@ -1,37 +0,0 @@
-module.exports = {
-  parser: "@typescript-eslint/parser",
-  plugins: ["react", "@typescript-eslint", "prettier", "react-hooks"],
-  extends: [
-    "plugin:react/recommended", // Uses the recommended rules from @eslint-plugin-react
-    "plugin:@typescript-eslint/recommended",
-    "prettier/@typescript-eslint",
-    "plugin:prettier/recommended",
-  ],
-  parserOptions: {
-    ecmaVersion: 2020, // Allows for the parsing of modern ECMAScript features
-    sourceType: "module", // Allows for the use of imports
-    ecmaFeatures: {
-      jsx: true, // Allows for the parsing of JSX
-    },
-  },
-  rules: {
-    "@typescript-eslint/no-explicit-any": 0,
-    "react-hooks/rules-of-hooks": "error",
-    "@typescript-eslint/no-use-before-define": 0,
-    "@typescript-eslint/no-var-requires": 0,
-    "import/no-webpack-loader-syntax": 0,
-    "no-undef": 0,
-    "react/prop-types": 0,
-    "@typescript-eslint/explicit-module-boundary-types": 0,
-  },
-  settings: {
-    react: {
-      pragma: "React",
-      version: "detect", // Tells eslint-plugin-react to automatically detect the version of React to use
-    },
-  },
-  env: {
-    browser: true,
-    node: true,
-  },
-};

app/client/.eslintrc.json

@@ -0,0 +1,41 @@
+// This JSON file configures the eslint plugin. It supports comments as well as per the JSON5 spec
+{
+  "parser": "@typescript-eslint/parser",
+  "plugins": ["react", "@typescript-eslint", "prettier", "react-hooks"],
+  "extends": [
+    "plugin:react/recommended", // Uses the recommended rules from @eslint-plugin-react
+    "plugin:@typescript-eslint/recommended",
+    "prettier/@typescript-eslint",
+    "plugin:prettier/recommended",
+    "plugin:cypress/recommended"
+  ],
+  "parserOptions": {
+    "ecmaVersion": 2020, // Allows for the parsing of modern ECMAScript features
+    "sourceType": "module", // Allows for the use of imports
+    "ecmaFeatures": {
+      "jsx": true // Allows for the parsing of JSX
+    }
+  },
+  "rules": {
+    "@typescript-eslint/no-explicit-any": 0,
+    "react-hooks/rules-of-hooks": "error",
+    "@typescript-eslint/no-use-before-define": 0,
+    "@typescript-eslint/no-var-requires": 0,
+    "import/no-webpack-loader-syntax": 0,
+    "no-undef": 0,
+    "react/prop-types": 0,
+    "@typescript-eslint/explicit-module-boundary-types": 0
+  },
+  "settings": {
+    "react": {
+      "pragma": "React",
+      // Tells eslint-plugin-react to automatically detect the version of React to use
+      "version": "detect" 
+    }
+  },
+  "env": {
+    "browser": true,
+    "node": true,
+    "cypress/globals": true
+  }
+}

app/client/cypress/fixtures/testdata.json

@@ -181,5 +181,6 @@
   "btoaInput": "{{btoa('A')",
   "defaultInputBinding": "{{Input2.text",
   "tabBinding": "{{Tabs1.selectedTab",
-  "pageloadBinding": "{{PageLoadApi.data.data[1].id}}{{Input1.text}}"
+  "pageloadBinding": "{{PageLoadApi.data.data[1].id}}{{Input1.text}}",
+  "defaultRowIndexBinding": "{{Table1.selectedRowIndex"
 }

app/client/cypress/integration/Smoke_TestSuite/Binding/Bind_TableWidget_selectedRow_Input_widget_spec.js

@@ -0,0 +1,56 @@
+/// <reference types="Cypress" />
+
+const commonlocators = require("../../../locators/commonlocators.json");
+const dsl = require("../../../fixtures/formInputTableDsl.json");
+const widgetsPage = require("../../../locators/Widgets.json");
+const publish = require("../../../locators/publishWidgetspage.json");
+const testdata = require("../../../fixtures/testdata.json");
+
+describe("Binding the table widget and input Widget", function() {
+  before(() => {
+    cy.addDsl(dsl);
+  });
+
+  it("Input widget test with default value from table widget", function() {
+    cy.SearchEntityandOpen("Input1");
+    cy.get(widgetsPage.defaultInput).type(testdata.defaultInputWidget);
+    cy.get(commonlocators.editPropCrossButton).click();
+    cy.wait("@updateLayout").should(
+      "have.nested.property",
+      "response.body.responseMeta.status",
+      200,
+    );
+  });
+
+  it("Input widget test with default value from table widget", function() {
+    cy.SearchEntityandOpen("Input2");
+    cy.get(widgetsPage.defaultInput).type(testdata.defaultRowIndexBinding);
+    cy.get(commonlocators.editPropCrossButton).click();
+    cy.wait("@updateLayout").should(
+      "have.nested.property",
+      "response.body.responseMeta.status",
+      200,
+    );
+  });
+
+  it("validation of data displayed in input widgets based on selected row", function() {
+    cy.SearchEntityandOpen("Table1");
+    cy.get(commonlocators.deflautSelectedRow)
+      .last()
+      .type("2", { force: true });
+    cy.get(commonlocators.editPropCrossButton).click();
+    cy.readTabledataPublish("2", "0").then(tabData => {
+      const tabValue = tabData;
+      expect(tabValue).to.be.equal("6788734");
+      cy.log("the value is" + tabValue);
+      cy.get(publish.inputWidget + " " + "input")
+        .first()
+        .invoke("attr", "value")
+        .should("contain", tabValue);
+      cy.get(publish.inputWidget + " " + "input")
+        .last()
+        .invoke("attr", "value")
+        .should("contain", 2);
+    });
+  });
+});

app/client/cypress/integration/Smoke_TestSuite/Binding/Binding_Table_Widget_DefaultSearch_Input_widget_spec.js

@@ -0,0 +1,42 @@
+const commonlocators = require("../../../locators/commonlocators.json");
+const formWidgetsPage = require("../../../locators/FormWidgets.json");
+const dsl = require("../../../fixtures/formInputTableDsl.json");
+const pages = require("../../../locators/Pages.json");
+const widgetsPage = require("../../../locators/Widgets.json");
+const publish = require("../../../locators/publishWidgetspage.json");
+const testdata = require("../../../fixtures/testdata.json");
+
+describe("Binding the Table and input Widget", function() {
+  before(() => {
+    cy.addDsl(dsl);
+  });
+
+  it("Input widget test with default value from table widget", function() {
+    cy.SearchEntityandOpen("Input1");
+    cy.get(widgetsPage.defaultInput).type(testdata.defaultInputWidget);
+    cy.get(commonlocators.editPropCrossButton).click();
+    cy.wait("@updateLayout").should(
+      "have.nested.property",
+      "response.body.responseMeta.status",
+      200,
+    );
+  });
+
+  it("validation of data displayed in input widgets based on search value set", function() {
+    cy.SearchEntityandOpen("Table1");
+    cy.get(commonlocators.defaultSearchText)
+      .last()
+      .type("2736212", { force: true });
+    cy.get(commonlocators.editPropCrossButton).click();
+    cy.isSelectRow(0);
+    cy.readTabledataPublish("0", "0").then(tabData => {
+      const tabValue = tabData;
+      expect(tabValue).to.be.equal("2736212");
+      cy.log("the value is" + tabValue);
+      cy.get(publish.inputWidget + " " + "input")
+        .first()
+        .invoke("attr", "value")
+        .should("contain", tabValue);
+    });
+  });
+});

app/client/cypress/integration/Smoke_TestSuite/ExplorerTests/Entity_Explorer_Query_Datasource_spec.js

@@ -1,3 +1,5 @@
+/// <reference types="Cypress" />
+
 const queryLocators = require("../../../locators/QueryEditor.json");
 const datasource = require("../../../locators/DatasourcesEditor.json");
 const apiwidget = require("../../../locators/apiWidgetslocator.json");

app/client/cypress/integration/Smoke_TestSuite/OrganisationTests/CreateDuplicateAppWithinOrg_spec.js

@@ -1,7 +1,5 @@
 /// <reference types="Cypress" />
 
-const homePage = require("../../../locators/HomePage.json");
-
 describe("Create new org and an app within the same", function() {
   let orgid;
   let appid;

app/client/cypress/locators/commonlocators.json

@@ -81,6 +81,8 @@
   "selectedZoomlevel": ".t--property-control-maxzoomlevel button span",
   "imgWidget": "div[data-testid='styledImage']",
   "selectTab": ".t--tab-Tab",
+  "deflautSelectedRow": ".t--property-control-defaultselectedrow textarea",
+  "defaultSearchText": ".t--property-control-defaultsearchtext textarea",
   "entityName": ".t--entity-name",
   "filePickerButton": ".t--widget-filepickerwidget",
   "filePickerInput": ".uppy-Dashboard-input",

app/client/package.json

@@ -189,6 +189,7 @@
     "eslint-plugin-prettier": "^3.1.4",
     "eslint-plugin-react": "^7.21.3",
     "eslint-plugin-react-hooks": "^2.3.0",
+    "eslint-plugin-cypress": "^2.11.2",
     "mocha": "^7.1.0",
     "mocha-junit-reporter": "^1.23.3",
     "mochawesome": "^5.0.0",

app/client/yarn.lock

@@ -8476,6 +8476,13 @@ eslint-module-utils@^2.6.0:
     debug "^2.6.9"
     pkg-dir "^2.0.0"
 
+eslint-plugin-cypress@^2.11.2:
+  version "2.11.2"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-cypress/-/eslint-plugin-cypress-2.11.2.tgz#a8f3fe7ec840f55e4cea37671f93293e6c3e76a0"
+  integrity sha512-1SergF1sGbVhsf7MYfOLiBhdOg6wqyeV9pXUAIDIffYTGMN3dTBQS9nFAzhLsHhO+Bn0GaVM1Ecm71XUidQ7VA==
+  dependencies:
+    globals "^11.12.0"
+
 eslint-plugin-flowtype@^5.2.0:
   version "5.2.0"
   resolved "https://registry.yarnpkg.com/eslint-plugin-flowtype/-/eslint-plugin-flowtype-5.2.0.tgz#a4bef5dc18f9b2bdb41569a4ab05d73805a3d261"
@@ -9753,7 +9760,7 @@ global@^4.3.2, global@^4.4.0:
     min-document "^2.19.0"
     process "^0.11.10"
 
-globals@^11.1.0:
+globals@^11.1.0, globals@^11.12.0:
   version "11.12.0"
   resolved "https://registry.yarnpkg.com/globals/-/globals-11.12.0.tgz#ab8795338868a0babd8525758018c2a7eb95c42e"
   integrity sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==