chore: external merge request from Contributor

app/client/cypress/e2e/Regression/ClientSide/Widgets/Select/Select4_spec.ts

@@ -0,0 +1,53 @@
+import {
+  agHelper,
+  draggableWidgets,
+  deployMode,
+  entityExplorer,
+  locators,
+  propPane,
+} from "../../../../../support/Objects/ObjectsCore";
+
+// Issue link: https://github.com/appsmithorg/appsmith/issues/26696
+describe(
+  "Select widget tests validating OnDropdownClose events are rendering show alert only once",
+  { tags: ["@tag.Widget", "@tag.Select"] },
+  function () {
+    before(() => {
+      entityExplorer.DragDropWidgetNVerify(draggableWidgets.SELECT);
+    });
+
+    it("Validate OnDropdownClose events are rendering show alert only once", () => {
+      propPane.EnterJSContext(
+        "onDropdownClose",
+        "{{showAlert('Dropdown closed!','success')}}",
+        true,
+      );
+      propPane.ToggleJSMode("onDropdownClose", false);
+      propPane.EnterJSContext(
+        "onDropdownOpen",
+        "{{showAlert('Dropdown opened!','success')}}",
+        true,
+      );
+      propPane.ToggleJSMode("onDropdownOpen", false);
+      propPane.EnterJSContext(
+        "onOptionChange",
+        "{{showAlert('Option changed!','success')}}",
+        true,
+      );
+      propPane.ToggleJSMode("onOptionChange", false);
+      deployMode.DeployApp(locators._widgetInDeployed(draggableWidgets.SELECT));
+      agHelper.GetNClick(locators._widgetInDeployed(draggableWidgets.SELECT));
+      agHelper.ValidateToastMessage("Dropdown opened!");
+      agHelper.AssertElementVisibility(
+        locators._selectOptionValue("Red"),
+        true,
+      );
+      agHelper.GetNClick(locators._selectOptionValue("Red"));
+      agHelper.ValidateToastMessage("Option changed!");
+      agHelper.ValidateToastMessage("Dropdown closed!");
+      cy.get("#ToastId12 > .Toastify__toast-body")
+        .contains("Dropdown closed!")
+        .should("have.length", 1);
+    });
+  },
+);

app/client/src/widgets/SelectWidget/component/index.tsx

@@ -75,7 +75,15 @@ class SelectComponent extends React.Component<
     }
   };
 
-  togglePopoverVisibility = () => {
+  togglePopoverVisibilityFromButton = () => {
+    this.togglePopoverVisibility(true);
+  };
+
+  togglePopoverVisibility = (isButtonClick = false) => {
+    // This is an edge case, this method gets called twice if user closes it by clicking on the `SelectButton`
+    // which in turn triggers handleOnDropdownClose twice, to solve we have this exception to tell if click event is from button
+    if (isButtonClick && this.state.isOpen) return;
+
     if (this.state.isOpen) {
       this.handleOnDropdownClose();
     } else {
@@ -189,7 +197,6 @@ class SelectComponent extends React.Component<
   handleCloseList = () => {
     if (this.state.isOpen) {
       this.togglePopoverVisibility();
-
       if (!this.props.selectedIndex) return;
 
       return this.handleActiveItemChange(
@@ -456,7 +463,7 @@ class SelectComponent extends React.Component<
               hideCancelIcon={this.props.hideCancelIcon}
               isRequired={this.props.isRequired}
               spanRef={this.spanRef}
-              togglePopoverVisibility={this.togglePopoverVisibility}
+              togglePopoverVisibility={this.togglePopoverVisibilityFromButton}
               tooltipText={tooltipText}
               value={this.props.value?.toString()}
             />