test: Cypress - Added cypress grep library (#29259)

Leveraging the library

[cypress-grep](https://github.com/cypress-io/cypress/tree/develop/npm/grep).
Using this we can tag testcases with relevant tags and use it to run
specific testcases.

**Command to run in local:** 
`CYPRESS_grepTags=@tag.Binding,@tag.Git npx cypress run
`
Pass the tags to CYPRESS_grepTags argument and only the test cases which
has the
tags passed will be picked to run. ex `@tag.Binding and @tag.Git` are
the tag names here.

**Tags can be added in the description on the test case like** 
`{ tags: ["@tag.Datasource"] }` for a single tag
`{ tags: ["@tag.Datasource", "@tag.Git"] }` for multiple tags 

**How to run In CI**
Single Tag - `/ok-to-test tags=@tag.Binding`
Multiple tag - `/ok-to-test tags=@tag.Binding,@tag.Git`


**TODOs in the next release:** 
- [ ] Add tags.ts file with all needed tags
- [ ] Add tags to remaining spec files. 
- [ ] Fail the PR run if tags added are not from tag.ts and post the
message on the same

#### Type of change
- Chore (housekeeping or task changes that don't impact user perception)
- This change requires a documentation update

#### How Has This Been Tested?
- [x] Manual
- [ ] JUnit
- [ ] Jest
- [x] Cypress

## Checklist:
#### Dev activity
- [ ] My code follows the style guidelines of this project
- [ ] I have performed a self-review of my own code
- [ ] I have commented my code, particularly in hard-to-understand areas
- [ ] I have made corresponding changes to the documentation
- [x] My changes generate no new warnings
- [x] I have added tests that prove my fix is effective or that my
feature works
- [ ] New and existing unit tests pass locally with my changes
- [ ] PR is being merged under a feature flag


#### QA activity:
- [x] [Speedbreak
features](https://github.com/appsmithorg/TestSmith/wiki/Guidelines-for-test-plans#speedbreakers-)
have been covered
- [ ] Test plan covers all impacted features and [areas of
interest](https://github.com/appsmithorg/TestSmith/wiki/Guidelines-for-test-plans#areas-of-interest-)
- [ ] Test plan has been peer reviewed by project stakeholders and other
QA members
- [ ] Manually tested functionality on DP
- [ ] We had an implementation alignment call with stakeholders post QA
Round 2
- [ ] Cypress test cases have been added and approved by SDET/manual QA
- [x] Added `Test Plan Approved` label after Cypress tests were reviewed
- [ ] Added `Test Plan Approved` label after JUnit tests were reviewed


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

- **New Features**
  - Added a search functionality to the app.

- **Enhancements**
- Integrated search bar at the top of the `Hero` component and a
`Search` component to the `App` component.
  - Added styles for the search bar.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

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

.github/workflows/ci-test-limited.yml

@@ -198,6 +198,7 @@ jobs:
             -e FLAGSMITH_URL=http://host.docker.internal:5001/flagsmith \
             -e FLAGSMITH_SERVER_KEY=dummykey \
             -e FLAGSMITH_SERVER_KEY_BUSINESS_FEATURES=dummykeybusinessfeatures \
+            -e LAUNCHDARKLY_BUSINESS_FLAGS_SERVER_KEY=$LAUNCHDARKLY_BUSINESS_FLAGS_SERVER_KEY \
             appsmith/cloud-services:release
           cd cicontainerlocal
           docker run -d --name appsmith -p 80:80 -p 9001:9001 \

app/client/cypress-add-tags.js

@@ -0,0 +1,67 @@
+const fs = require("fs");
+const path = require("path");
+const readline = require("readline");
+
+const args = process.argv.slice(2);
+if (args.length < 2) {
+  console.error("Please provide a file path and TAG as CLI arguments");
+  process.exit(1);
+}
+
+const TAG = args[1];
+
+function processFile(filePath) {
+  const fileStream = fs.createReadStream(filePath);
+
+  const rl = readline.createInterface({
+    input: fileStream,
+    crlfDelay: Infinity,
+  });
+
+  let newFileContent = "";
+
+  rl.on("line", (line) => {
+    if (line.trim().startsWith("describe(")) {
+      const startIndex = line.indexOf("(");
+      const endIndex = line.lastIndexOf(",");
+      const firstStringParam = line.substring(startIndex + 1, endIndex);
+
+      if (line.includes("{ tags: ")) {
+        const tagsStartIndex = line.indexOf("{ tags: [") + 9;
+        const tagsEndIndex = line.indexOf("] }");
+        const existingTags = line.substring(tagsStartIndex, tagsEndIndex);
+        const updatedTags = `${existingTags}, "${TAG}"`;
+        const updatedLine = line.replace(existingTags, updatedTags);
+        newFileContent += updatedLine + "\n";
+      } else {
+        const updatedLine = line.replace(
+          firstStringParam,
+          `${firstStringParam}, { tags: ["${TAG}"] }`,
+        );
+        newFileContent += updatedLine + "\n";
+      }
+    } else {
+      newFileContent += line + "\n";
+    }
+  });
+
+  rl.on("close", () => {
+    fs.writeFileSync(filePath, newFileContent);
+  });
+}
+
+function processDirectory(directory) {
+  fs.readdirSync(directory).forEach((file) => {
+    let fullPath = path.join(directory, file);
+    if (fs.lstatSync(fullPath).isDirectory()) {
+      processDirectory(fullPath);
+    } else if (
+      path.extname(fullPath) === ".js" ||
+      path.extname(fullPath) === ".ts"
+    ) {
+      processFile(fullPath);
+    }
+  });
+}
+
+processDirectory(args[0]);

app/client/cypress.config.ts

@@ -28,9 +28,13 @@ export default defineConfig({
     env: {
       USERNAME: "xxxx",
       PASSWORD: "xxx",
+      grepFilterSpecs: true,
+      grepOmitFiltered: true,
     },
     setupNodeEvents(on, config) {
-      return require("./cypress/plugins/index.js")(on, config);
+      require("@cypress/grep/src/plugin")(config);
+      require("./cypress/plugins/index.js")(on, config);
+      return config;
     },
     specPattern: "cypress/e2e/**/*.{js,ts}",
     testIsolation: false,

app/client/cypress/e2e/GSheet/WidgetBinding_AllAccess_Spec.ts

@@ -21,7 +21,7 @@ const workspaceName = "gsheet apps";
 const dataSourceName = "gsheet";
 let appName = "gsheet-app";
 let spreadSheetName = "test-sheet";
-describe("GSheet-widget binding", function () {
+describe("GSheet-widget binding", { tags: ["@tag.Datasource"] }, function () {
   before("Setup app and spreadsheet", function () {
     //Setting up the app name
     const uuid = Cypress._.random(0, 10000);

app/client/cypress/e2e/Regression/ClientSide/Git/GitSync/Merge_spec.js

@@ -5,7 +5,7 @@ import * as _ from "../../../../../support/Objects/ObjectsCore";
 let repoName;
 let childBranchKey = "ChildBranch";
 let mainBranch = "master";
-describe("Git sync modal: merge tab", function () {
+describe("Git sync modal: merge tab", { tags: ["@tag.Git"] }, function () {
   before(() => {
     _.homePage.NavigateToHome();
     cy.createWorkspace();

app/client/cypress/plugins/index.js

@@ -223,6 +223,17 @@ module.exports = async (on, config) => {
     },
   });
 
+  console.log("Type of 'config.specPattern':", typeof config.specPattern);
+  /**
+   * Cypress grep plug return specPattern as object and with absolute path
+   */
+  if (typeof config.specPattern == "object") {
+    config.specPattern = config.specPattern.map((spec) => {
+      return spec.replace(process.cwd() + "/", "");
+    });
+  }
+  console.log("config.specPattern:", config.specPattern);
+
   if (process.env["RUNID"]) {
     config = await new cypressSplit().splitSpecs(on, config);
     cypressHooks(on, config);

app/client/cypress/support/e2e.js

@@ -41,8 +41,10 @@ import {
   FEATURE_WALKTHROUGH_INDEX_KEY,
   WALKTHROUGH_TEST_PAGE,
 } from "./Constants.js";
+const registerCypressGrep = require("@cypress/grep");
 /// <reference types="cypress-xpath" />
 
+registerCypressGrep();
 installLogsCollector();
 
 Cypress.on("uncaught:exception", (error) => {

app/client/cypress/tags.js

@@ -0,0 +1,34 @@
+module.exports = {
+  Tag: [
+    "@tag.excludeForAirgap",
+    "@tag.airgap",
+    "@tag.Git",
+    "@tag.Widget",
+    "@tag.Multiselect",
+    "@tag.Slider",
+    "@tag.CurrencyInput",
+    "@tag.Text",
+    "@tag.Statbox",
+    "@tag.Modal",
+    "@tag.Filepicker",
+    "@tag.Select",
+    "@tag.RichTextEditor",
+    "@tag.Switch",
+    "@tag.List",
+    "@tag.Button",
+    "@tag.Divider",
+    "@tag.Audio",
+    "@tag.Table",
+    "@tag.Image",
+    "@tag.Tab",
+    "@tag.JSONForm",
+    "@tag.Binding",
+    "@tag.IDE",
+    "@tag.Datasource",
+    "@tag.JS",
+    "@tag.GenerateCRUD",
+    "@tag.MobileResponsive",
+    "@tag.Theme",
+    "@tag.Random",
+  ],
+};

app/client/cypress_ci.config.ts

@@ -25,6 +25,7 @@ export default defineConfig({
   e2e: {
     baseUrl: "http://localhost/",
     setupNodeEvents(on, config) {
+      require("@cypress/grep/src/plugin")(config);
       return require("./cypress/plugins/index.js")(on, config);
     },
     specPattern: "cypress/e2e/**/*.{js,ts}",

app/client/cypress_ci_custom.config.ts

@@ -29,6 +29,10 @@ export default defineConfig({
   },
   e2e: {
     baseUrl: "http://localhost/",
+    env: {
+      grepFilterSpecs: true,
+      grepOmitFiltered: true,
+    },
     setupNodeEvents(on, config) {
       require("cypress-mochawesome-reporter/plugin")(on);
       on(
@@ -46,6 +50,7 @@ export default defineConfig({
           }
         },
       );
+      require("@cypress/grep/src/plugin")(config);
       return require("./cypress/plugins/index.js")(on, config);
     },
     specPattern: "cypress/e2e/**/*.{js,ts}",

app/client/cypress_ci_hosted.config.ts

@@ -47,6 +47,7 @@ export default defineConfig({
           }
         },
       );
+      require("@cypress/grep/src/plugin")(config);
       return require("./cypress/plugins/index.js")(on, config);
     },
     specPattern: [

app/client/package.json

@@ -239,6 +239,7 @@
     "@babel/helper-create-regexp-features-plugin": "^7.18.6",
     "@babel/helper-string-parser": "^7.19.4",
     "@craco/craco": "^7.0.0",
+    "@cypress/grep": "^4.0.1",
     "@faker-js/faker": "^7.4.0",
     "@octokit/rest": "^20.0.1",
     "@peculiar/webcrypto": "^1.4.3",

app/client/yarn.lock

@@ -2910,6 +2910,19 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@cypress/grep@npm:^4.0.1":
+  version: 4.0.1
+  resolution: "@cypress/grep@npm:4.0.1"
+  dependencies:
+    debug: ^4.3.4
+    find-test-names: ^1.19.0
+    globby: ^11.0.4
+  peerDependencies:
+    cypress: ">=10"
+  checksum: ca8e69cc6cceda54162fc4fdcd361dea4ef1877b761cd9d2f7a53b83e58f201b58b13427eccdc1a2a5054b83d53a3ca0279d3ea815cb3cc065d72a0e2c48b1be
+  languageName: node
+  linkType: hard
+
 "@cypress/request@npm:^3.0.0":
   version: 3.0.0
   resolution: "@cypress/request@npm:3.0.0"
@@ -12266,6 +12279,7 @@ __metadata:
     "@blueprintjs/popover2": ^0.5.0
     "@blueprintjs/select": ^3.10.0
     "@craco/craco": ^7.0.0
+    "@cypress/grep": ^4.0.1
     "@design-system/storybook": "workspace:^"
     "@design-system/theming": "workspace:^"
     "@design-system/widgets": "workspace:^"
@@ -18796,6 +18810,24 @@ __metadata:
   languageName: node
   linkType: hard
 
+"find-test-names@npm:^1.19.0":
+  version: 1.28.14
+  resolution: "find-test-names@npm:1.28.14"
+  dependencies:
+    "@babel/parser": ^7.23.0
+    "@babel/plugin-syntax-jsx": ^7.22.5
+    acorn-walk: ^8.2.0
+    debug: ^4.3.3
+    globby: ^11.0.4
+    simple-bin-help: ^1.8.0
+  bin:
+    find-test-names: bin/find-test-names.js
+    print-tests: bin/print-tests.js
+    update-test-count: bin/update-test-count.js
+  checksum: 57f96f4b2259b6dd3c6d12c9fdea9ea6c961850b0f7354423ff49d074081c39fffe945ec218496257dcb4f9578f62c4a3794c2ec6d507ef3f04a72219c304708
+  languageName: node
+  linkType: hard
+
 "find-up@npm:^3.0.0":
   version: 3.0.0
   resolution: "find-up@npm:3.0.0"
@@ -30357,6 +30389,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"simple-bin-help@npm:^1.8.0":
+  version: 1.8.0
+  resolution: "simple-bin-help@npm:1.8.0"
+  checksum: 50cd5753325a2632979e63f231fc73ea187fa468e389ab1f44cb6fbafb6257024a3b8ac6744f35cb499b392fe85aecba35e9e26b4dc042c941655022f3b8a2ce
+  languageName: node
+  linkType: hard
+
 "simple-concat@npm:^1.0.0":
   version: 1.0.1
   resolution: "simple-concat@npm:1.0.1"