fix: delete selected key when input is cleared (#2529) (#2574)

Co-authored-by: Serhii Kulykov <iamkulykov@gmail.com>

Author: vaadin-bot

vaadin-combo-box-flow-parent/vaadin-combo-box-flow-integration-tests/src/test/java/com/vaadin/flow/component/combobox/test/ClearValueIT.java

@@ -19,6 +19,7 @@
 import com.vaadin.flow.component.combobox.testbench.ComboBoxElement;
 import com.vaadin.tests.AbstractComponentIT;
 import com.vaadin.flow.testutil.TestPath;
+import com.vaadin.testbench.ElementQuery;
 import com.vaadin.testbench.TestBenchElement;
 import org.junit.Assert;
 import org.junit.Before;
@@ -60,6 +61,28 @@ public void valueIsCorrectlyClearedWithClearButtonBeforeOpened() {
                         .getText());
     }
 
+    @Test
+    public void openPopup_clearButton_selectedItemIsReset() {
+        String comboBoxId = ClearValuePage.COMBO_BOX_WITH_CLEAR_BUTTON_ID;
+        ComboBoxElement comboBox = $(ComboBoxElement.class).id(comboBoxId);
+
+        comboBox.openPopup();
+        comboBox.closePopup();
+
+        comboBox.$("[part~='clear-button']").get(0).click();
+
+        comboBox.openPopup();
+
+        TestBenchElement overlay = $("vaadin-combo-box-overlay").first();
+        ElementQuery<TestBenchElement> items = overlay
+                .$("vaadin-combo-box-item");
+
+        items.all()
+                .forEach(item -> Assert.assertFalse(
+                        "Item is not selected after clear button click",
+                        item.hasAttribute("selected")));
+    }
+
     @Test
     public void valueIsCorrectlySetToNull() {
         Assert.assertNull(

vaadin-combo-box-flow-parent/vaadin-combo-box-flow/src/main/resources/META-INF/resources/frontend/comboBoxConnector.js

@@ -260,6 +260,11 @@ import { ComboBoxPlaceholder } from '@vaadin/combo-box/src/vaadin-combo-box-plac
                 }
             }), { once: true });
 
+            comboBox.addEventListener('value-changed', tryCatchWrapper((event) => {
+                if (comboBox._selectedKey && !event.detail.value) {
+                    delete comboBox._selectedKey;
+                }
+            }));
 
             comboBox.$connector.enableClientValidation = tryCatchWrapper(function( enable ){
                 if ( comboBox.$ ){