From 602fe2b8a170258b2bf4b8859ddce1b6b486e79b Mon Sep 17 00:00:00 2001
From: NandanAnantharamu <67676905+NandanAnantharamu@users.noreply.github.com>
Date: Fri, 25 Oct 2024 21:21:57 +0530
Subject: [PATCH] test: fix tabs skipped test CE (#37023)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

[NandanAnantharamu](https://github.com/NandanAnantharamu)
NandanAnantharamu commented [1 hour
ago](https://github.com/appsmithorg/appsmith-ee/pull/5425#issue-2607459836)
•
Skipped test in Tab spec is fixed.
There was change in one of the validation step
/ok-to-test tags="@tag.Sanity"

<!-- This is an auto-generated comment: Cypress test results  -->
> [!TIP]
> 🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉
> Workflow run:
<https://github.com/appsmithorg/appsmith/actions/runs/11504174102>
> Commit: 6b0e6077236862ebd92ee9d121622a4b4af46063
> <a
href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=11504174102&attempt=1"
target="_blank">Cypress dashboard</a>.
> Tags: `@tag.Sanity`
> Spec:
> <hr>Thu, 24 Oct 2024 17:52:38 UTC
<!-- end of auto-generated comment: Cypress test results  -->


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

- **Bug Fixes**
- Re-enabled test case for verifying colors, borders, and shadows of the
Tabs widget.
- Updated border color assertion to dynamically check the widget's
border color.

- **Improvements**
- Enhanced verification of property visibility and functionality for the
Tabs widget, including tab renaming, deletion, and binding with text
widgets.
- Validated behavior when toggling the "Show Tabs" property and ensured
appropriate error handling for invalid default tabs.

- **Chores**
- Updated the test file reference in the limited-tests configuration to
focus on the Tabs widget.
- Introduced new selectors for improved interaction with widget
properties.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: “NandanAnantharamu” <“nandan@thinkify.io”>
---
 .../ClientSide/Widgets/Tab/Tabs_2_spec.ts       | 17 +++++++++++------
 .../cypress/support/Objects/CommonLocators.ts   |  1 +
 .../cypress/support/Pages/PropertyPane.ts       |  1 +
 3 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/app/client/cypress/e2e/Regression/ClientSide/Widgets/Tab/Tabs_2_spec.ts b/app/client/cypress/e2e/Regression/ClientSide/Widgets/Tab/Tabs_2_spec.ts
index 2dc84c08f0..ae871b77be 100644
--- a/app/client/cypress/e2e/Regression/ClientSide/Widgets/Tab/Tabs_2_spec.ts
+++ b/app/client/cypress/e2e/Regression/ClientSide/Widgets/Tab/Tabs_2_spec.ts
@@ -189,7 +189,7 @@ describe(
     });
 
     // to work on redesign of the test, commenting for now
-    it.skip("7. Verify colors, borders and shadows", () => {
+    it("7. Verify colors, borders and shadows", () => {
       // Verify font color picker opens up
       propPane.MoveToTab("Style");
       agHelper.GetNClick(propPane._propertyControlColorPicker("accentcolor"));
@@ -220,11 +220,16 @@ describe(
       // Border Color
       propPane.SelectColorFromColorPicker("bordercolor", 13);
       assertHelper.AssertNetworkStatus("@updateLayout");
-      agHelper.AssertCSS(
-        tabs._tabsWidgetStyle,
-        "border-color",
-        "rgb(185, 28, 28)",
-      );
+
+      agHelper
+        .GetWidgetCSSFrAttribute(propPane._borderColorCursor, "color")
+        .then((color) => {
+          agHelper
+            .GetWidgetCSSFrAttribute(locators._widgetBorder, "color", 1)
+            .then((bgcolor) => {
+              expect(color).to.eq(bgcolor);
+            });
+        });
 
       agHelper.AssertAttribute(propPane._colorPickerInput, "type", "text", 2);
       propPane.TogglePropertyState("bordercolor", "On", "");
diff --git a/app/client/cypress/support/Objects/CommonLocators.ts b/app/client/cypress/support/Objects/CommonLocators.ts
index 600009c550..2200d6eb18 100644
--- a/app/client/cypress/support/Objects/CommonLocators.ts
+++ b/app/client/cypress/support/Objects/CommonLocators.ts
@@ -341,4 +341,5 @@ export class CommonLocators {
   _saveDatasource = `[data-testid='t--store-as-datasource']`;
   _propertyCollapseBody = ".bp3-collapse-body";
   _propertyCollapse = ".bp3-collapse";
+  _widgetBorder = ".t--draggable-tabswidget div div div";
 }
diff --git a/app/client/cypress/support/Pages/PropertyPane.ts b/app/client/cypress/support/Pages/PropertyPane.ts
index f826f788d2..41d5daa99d 100644
--- a/app/client/cypress/support/Pages/PropertyPane.ts
+++ b/app/client/cypress/support/Pages/PropertyPane.ts
@@ -177,6 +177,7 @@ export class PropertyPane {
   _dataIcon = (icon: string) => `[data-icon="${icon}"]`;
   _iconDropdown = "[data-test-id='virtuoso-scroller']";
   _dropdownControlError = "[data-testid='t---dropdown-control-error']";
+  _borderColorCursor = ".t--property-control-bordercolor .bp3-input-group div";
 
   public OpenJsonFormFieldSettings(fieldName: string) {
     this.agHelper.GetNClick(this._jsonFieldEdit(fieldName));