From c47f3163c35881b929913c65ae43a1cd9640ef82 Mon Sep 17 00:00:00 2001
From: Jack Fragassi <jfragassi98@gmail.com>
Date: Thu, 16 Nov 2023 12:06:05 -0800
Subject: [PATCH] fix: Make Select component fire onChange listener when a
 selection is pasted in (#25993)

---
 .../src/components/Select/AsyncSelect.test.tsx     | 14 ++++++++++++++
 .../src/components/Select/AsyncSelect.tsx          |  1 +
 .../src/components/Select/Select.test.tsx          | 14 ++++++++++++++
 superset-frontend/src/components/Select/Select.tsx |  1 +
 4 files changed, 30 insertions(+)

diff --git a/superset-frontend/src/components/Select/AsyncSelect.test.tsx b/superset-frontend/src/components/Select/AsyncSelect.test.tsx
index c1442a6b70a1c..0bb24b474a0cc 100644
--- a/superset-frontend/src/components/Select/AsyncSelect.test.tsx
+++ b/superset-frontend/src/components/Select/AsyncSelect.test.tsx
@@ -868,6 +868,20 @@ test('fires onChange when clearing the selection in multiple mode', async () =>
   expect(onChange).toHaveBeenCalledTimes(1);
 });
 
+test('fires onChange when pasting a selection', async () => {
+  const onChange = jest.fn();
+  render(<AsyncSelect {...defaultProps} onChange={onChange} />);
+  await open();
+  const input = getElementByClassName('.ant-select-selection-search-input');
+  const paste = createEvent.paste(input, {
+    clipboardData: {
+      getData: () => OPTIONS[0].label,
+    },
+  });
+  fireEvent(input, paste);
+  expect(onChange).toHaveBeenCalledTimes(1);
+});
+
 test('does not duplicate options when using numeric values', async () => {
   render(
     <AsyncSelect
diff --git a/superset-frontend/src/components/Select/AsyncSelect.tsx b/superset-frontend/src/components/Select/AsyncSelect.tsx
index 20de7bb5911c0..d102af74833ee 100644
--- a/superset-frontend/src/components/Select/AsyncSelect.tsx
+++ b/superset-frontend/src/components/Select/AsyncSelect.tsx
@@ -554,6 +554,7 @@ const AsyncSelect = forwardRef(
           ...values,
         ]);
       }
+      fireOnChange();
     };
 
     const shouldRenderChildrenOptions = useMemo(
diff --git a/superset-frontend/src/components/Select/Select.test.tsx b/superset-frontend/src/components/Select/Select.test.tsx
index a6b83075825be..2910353295187 100644
--- a/superset-frontend/src/components/Select/Select.test.tsx
+++ b/superset-frontend/src/components/Select/Select.test.tsx
@@ -985,6 +985,20 @@ test('fires onChange when clearing the selection in multiple mode', async () =>
   expect(onChange).toHaveBeenCalledTimes(1);
 });
 
+test('fires onChange when pasting a selection', async () => {
+  const onChange = jest.fn();
+  render(<Select {...defaultProps} onChange={onChange} />);
+  await open();
+  const input = getElementByClassName('.ant-select-selection-search-input');
+  const paste = createEvent.paste(input, {
+    clipboardData: {
+      getData: () => OPTIONS[0].label,
+    },
+  });
+  fireEvent(input, paste);
+  expect(onChange).toHaveBeenCalledTimes(1);
+});
+
 test('does not duplicate options when using numeric values', async () => {
   render(
     <Select
diff --git a/superset-frontend/src/components/Select/Select.tsx b/superset-frontend/src/components/Select/Select.tsx
index 6ccc1e1715dd5..1e3bc73758cb1 100644
--- a/superset-frontend/src/components/Select/Select.tsx
+++ b/superset-frontend/src/components/Select/Select.tsx
@@ -571,6 +571,7 @@ const Select = forwardRef(
           ]);
         }
       }
+      fireOnChange();
     };
 
     return (