From 199233be47a41bdb6a0492128b0839e9673a98e9 Mon Sep 17 00:00:00 2001
From: shadabbuchh <39921438+shadabbuchh@users.noreply.github.com>
Date: Wed, 25 Dec 2024 16:53:44 +0530
Subject: [PATCH] test: new test case for renaming JS Object (#38361)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## Description

This PR adds a test case for the bug:
https://github.com/appsmithorg/appsmith/issues/38207

This PR tests the issue where renaming a JS Object via the context menu
caused the focus to shift to another tab in the editor.

Changes:

- Added test cases to validate that focus remains on the current tab
while renaming JS Objects.
- Verified the functionality by renaming multiple JS Objects and
ensuring the changes are reflected without altering tab focus.


## Automation

/ok-to-test tags="@tag.JS"

### :mag: Cypress test results
<!-- This is an auto-generated comment: Cypress test results  -->
> [!TIP]
> 🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉
> Workflow run:
<https://github.com/appsmithorg/appsmith/actions/runs/12492186342>
> Commit: 5611d13c3a8d6fd26598a463b25e370e381323f5
> <a
href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=12492186342&attempt=1"
target="_blank">Cypress dashboard</a>.
> Tags: `@tag.JS`
> Spec:
> <hr>Wed, 25 Dec 2024 11:16:53 UTC
<!-- end of auto-generated comment: Cypress test results  -->


## Communication
Should the DevRel and Marketing teams inform users about this change?
- [ ] Yes
- [x] No


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

- **New Features**
- Introduced a method to rename JavaScript objects via the context menu
in the JSEditor.
	- Added a property for referencing the list of JavaScript objects.

- **Tests**
- Implemented a new test suite to validate the renaming functionality
and ensure focus remains on the correct tab during the process.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---
 .../JSObject/RenameJSObjectBug38207_spec.ts   | 30 +++++++++++++++++++
 app/client/cypress/support/Pages/JSEditor.ts  |  8 +++++
 2 files changed, 38 insertions(+)
 create mode 100644 app/client/cypress/e2e/Regression/ClientSide/JSObject/RenameJSObjectBug38207_spec.ts

diff --git a/app/client/cypress/e2e/Regression/ClientSide/JSObject/RenameJSObjectBug38207_spec.ts b/app/client/cypress/e2e/Regression/ClientSide/JSObject/RenameJSObjectBug38207_spec.ts
new file mode 100644
index 0000000000..bb3018186f
--- /dev/null
+++ b/app/client/cypress/e2e/Regression/ClientSide/JSObject/RenameJSObjectBug38207_spec.ts
@@ -0,0 +1,30 @@
+import { jsEditor } from "../../../../support/Objects/ObjectsCore";
+
+describe(
+  "To test [Bug]: Action redesign: Focus shifts to another tab when renaming a JSObject #38207",
+  { tags: ["@tag.JS"] },
+  () => {
+    it("1. Validate that focus does not shift to another tab while renaming JS Objects from the context menu", () => {
+      // Create first JS file
+      jsEditor.CreateJSObject("", { prettify: false, toRun: false });
+
+      // Rename the first JS Object
+      jsEditor.RenameJSObjectFromContextMenu("ChangedName1");
+
+      // Validate the new name of the JS Object
+      cy.get(jsEditor.listOfJsObjects).eq(0).contains("ChangedName1");
+
+      // Create second JS file
+      jsEditor.CreateJSObject("", { prettify: false, toRun: false });
+
+      // Create third JS file
+      jsEditor.CreateJSObject("", { prettify: false, toRun: false });
+
+      // Rename the third JS Object
+      jsEditor.RenameJSObjectFromContextMenu("ChangedName3");
+
+      // Validate the new name of the 3rd JS Objcte
+      cy.get(jsEditor.listOfJsObjects).eq(2).contains("ChangedName3");
+    });
+  },
+);
diff --git a/app/client/cypress/support/Pages/JSEditor.ts b/app/client/cypress/support/Pages/JSEditor.ts
index a6a0eba855..957ca929a5 100644
--- a/app/client/cypress/support/Pages/JSEditor.ts
+++ b/app/client/cypress/support/Pages/JSEditor.ts
@@ -36,6 +36,7 @@ export class JSEditor {
   public settingsTriggerLocator = "[data-testid='t--js-settings-trigger']";
   public contextMenuTriggerLocator = "[data-testid='t--more-action-trigger']";
   public runFunctionSelectLocator = "[data-testid='t--js-function-run']";
+  public listOfJsObjects = "[data-testid='t--tabs-container']>div>span";
 
   public toolbar = new PluginEditorToolbar(
     this.runButtonLocator,
@@ -230,6 +231,13 @@ export class JSEditor {
     PageLeftPane.assertPresence(renameVal);
   }
 
+  public RenameJSObjectFromContextMenu(renameVal: string) {
+    cy.get(this.contextMenuTriggerLocator).click();
+    cy.contains("Rename").should("be.visible").click();
+    cy.get(this._jsObjTxt).clear().type(renameVal, { force: true }).blur();
+    PageLeftPane.assertPresence(renameVal);
+  }
+
   public RenameJSObjFromExplorer(entityName: string, renameVal: string) {
     this.ee.ActionContextMenuByEntityName({
       entityNameinLeftSidebar: entityName,