From b75e1793cd6c3ac68bf382ab096fceef86979431 Mon Sep 17 00:00:00 2001
From: ZenMasterJacob20011 <jsnichols0404@hotmail.com>
Date: Mon, 1 Jul 2024 16:00:50 -0500
Subject: [PATCH] fixed select component emitting blur on click

---
 src/Webform.unit.js                  | 4 ++--
 src/components/select/Select.js      | 3 +--
 src/components/select/Select.unit.js | 4 ++--
 3 files changed, 5 insertions(+), 6 deletions(-)

diff --git a/src/Webform.unit.js b/src/Webform.unit.js
index 35dacb08ce..cc1bcac323 100644
--- a/src/Webform.unit.js
+++ b/src/Webform.unit.js
@@ -422,10 +422,10 @@ describe('Webform tests', function() {
       const blurEvent = new Event('blur');
 
       const selectChoices = form.getComponent('selectChoices');
-      selectChoices.focusableElement.dispatchEvent(focusEvent);
+      selectChoices.choices.input.element.dispatchEvent(focusEvent);
 
       setTimeout(() => {
-        selectChoices.focusableElement.dispatchEvent(blurEvent);
+        selectChoices.choices.input.element.dispatchEvent(blurEvent);
 
         const selectHtml = form.getComponent('selectHtml');
         selectHtml.refs.selectContainer.dispatchEvent(focusEvent);
diff --git a/src/components/select/Select.js b/src/components/select/Select.js
index fdbb2c1fa6..37e8a18301 100644
--- a/src/components/select/Select.js
+++ b/src/components/select/Select.js
@@ -1,7 +1,6 @@
 import _ from 'lodash';
 import { Formio } from '../../Formio';
 import ListComponent from '../_classes/list/ListComponent';
-import Input from '../_classes/input/Input';
 import Form from '../../Form';
 import { getRandomComponentId, boolValue, isPromise, componentValueTypes, getComponentSavedTypes, isSelectResourceWithObjectValue, removeHTML } from '../../utils/utils';
 
@@ -1015,7 +1014,7 @@ export default class SelectComponent extends ListComponent {
         this.addEventListener(this.choices.containerOuter.element, 'focus', () => this.focusableElement.focus());
       }
 
-      Input.prototype.addFocusBlurEvents.call(this, this.focusableElement);
+      this.addFocusBlurEvents(this.choices.input.element);
 
       if (this.itemsFromUrl && !this.component.noRefreshOnScroll) {
         this.scrollList = this.choices.choiceList.element;
diff --git a/src/components/select/Select.unit.js b/src/components/select/Select.unit.js
index 372002c9cb..14aafd8d44 100644
--- a/src/components/select/Select.unit.js
+++ b/src/components/select/Select.unit.js
@@ -1108,12 +1108,12 @@ describe('Select Component', () => {
     Formio.createForm(element, comp19).then(form => {
       const select = form.components[0];
       select.setValue('banana');
-      select.focusableElement.focus();
+      select.choices.input.element.focus();
       select.pristine = false;
 
       setTimeout(() => {
         assert(!select.visibleErrors.length, 'Select should be valid while changing');
-        select.focusableElement.dispatchEvent(new Event('blur'));
+        select.choices.input.element.dispatchEvent(new Event('blur'));
 
         setTimeout(() => {
           assert(select.visibleErrors.length, 'Should set error after Select component was blurred');