ENGCOM-6966: Fixed issue 25910 choose drop down not close when open another #26090

Author: slavvka

app/code/Magento/Swatches/Test/Mftf/Section/AdminManageSwatchSection.xml

@@ -17,6 +17,8 @@
         <element name="nthSwatchText" type="input" selector="#swatch-text-options-panel table tbody tr:nth-of-type({{var}}) td:nth-of-type(3) input" parameterized="true"/>
         <element name="nthIsDefault" type="input" selector="(//input[@name='defaultvisual[]'])[{{var}}]" parameterized="true"/>
         <element name="nthSwatchAdminDescription" type="input" selector="#swatch-text-options-panel table tbody tr:nth-of-type({{var}}) td:nth-of-type(4) input" parameterized="true"/>
+        <element name="nthVisualSwatch" type="button" selector="#swatch-visual-options-panel table tbody tr:nth-of-type({{var}}) .swatches-visual-col" parameterized="true"/>
+        <element name="chooserBlock" type="block" selector="#swatch-visual-options-panel table tbody tr:nth-of-type({{var}}) .swatches-visual-col .swatch_sub-menu_container" parameterized="true"/>
         <!-- Selector for Admin Description input where the index is zero-based -->
         <element name="swatchAdminDescriptionByIndex" type="input" selector="input[name='optiontext[value][option_{{index}}][0]']" parameterized="true"/>
         <element name="nthChooseColor" type="button" selector="#swatch-visual-options-panel table tbody tr:nth-of-type({{var}}) .swatch_row_name.colorpicker_handler" parameterized="true"/>

app/code/Magento/Swatches/Test/Mftf/Test/AdminCheckColorUploadChooserVisualSwatchTest.xml

@@ -0,0 +1,39 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+ /**
+  * Copyright © Magento, Inc. All rights reserved.
+  * See COPYING.txt for license details.
+  */
+-->
+<tests xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+       xsi:noNamespaceSchemaLocation="urn:magento:mftf:Test/etc/testSchema.xsd">
+    <test name="AdminCheckColorUploadChooserVisualSwatchTest">
+        <annotations>
+            <features value="Swatches"/>
+            <stories value="Check correct view of visual swatches"/>
+            <title value="Correct view of Swatches while choosing color or upload image"/>
+            <description value="Correct view of Swatches while choosing color or upload image"/>
+            <severity value="AVERAGE"/>
+            <group value="Swatches"/>
+        </annotations>
+        <before>
+            <actionGroup ref="LoginAsAdmin" stepKey="loginAsAdmin"/>
+        </before>
+        <amOnPage url="{{ProductAttributePage.url}}" stepKey="addNewProductAttribute"/>
+        <selectOption selector="{{AttributePropertiesSection.InputType}}"
+                      userInput="{{visualSwatchAttribute.input_type}}" stepKey="fillInputType"/>
+
+        <click selector="{{AdminManageSwatchSection.addSwatch}}" stepKey="clickAddSwatch1"/>
+        <click selector="{{AdminManageSwatchSection.addSwatch}}" stepKey="clickAddSwatch2"/>
+        <click selector="{{AdminManageSwatchSection.addSwatch}}" stepKey="clickAddSwatch3"/>
+        <click selector="{{AdminManageSwatchSection.nthVisualSwatch('3')}}" stepKey="clickSwatch3"/>
+
+        <click selector="{{AdminManageSwatchSection.nthVisualSwatch('2')}}" stepKey="clickSwatch2"/>
+        <seeElement selector="{{AdminManageSwatchSection.chooserBlock('2')}}" stepKey="seeSwatch2"/>
+        <dontSeeElement selector="{{AdminManageSwatchSection.chooserBlock('3')}}" stepKey="dontSeeSwatch3"/>
+
+        <click selector="{{AdminManageSwatchSection.nthVisualSwatch('1')}}" stepKey="clickSwatch1"/>
+        <seeElement selector="{{AdminManageSwatchSection.chooserBlock('1')}}" stepKey="seeSwatch1"/>
+        <dontSeeElement selector="{{AdminManageSwatchSection.chooserBlock('2')}}" stepKey="dontSeeSwatch2"/>
+    </test>
+</tests>

app/code/Magento/Swatches/view/adminhtml/web/js/visual.js

@@ -404,8 +404,11 @@ define([
             /**
              * Toggle color upload chooser
              */
-            $(document).on('click', '.swatch_window', function () {
-                $(this).next('div').toggle();
+            $(document).on('click', '.swatches-visual-col', function () {
+                var currentElement = $(this).find('.swatch_sub-menu_container');
+
+                jQuery('.swatch_sub-menu_container').not(currentElement).hide();
+                currentElement.toggle();
             });
         });
     };