(superset) 02/07: fix(select): ensure filter dropdown matches input field width (#38886)

[mi...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

michaelsmolina pushed a commit to branch 6.1
in repository https://gitbox.apache.org/repos/asf/superset.git

commit f1f757b5c537510b8fe4b88e2741cfa92ef8fc1d
Author: Enzo Martellucci <52...@users.noreply.github.com>
AuthorDate: Mon Mar 30 15:52:37 2026 +0200

    fix(select): ensure filter dropdown matches input field width (#38886)
    
    (cherry picked from commit 41d401a879e58ccb2aa3ec195646d2485b4b986d)
---
 .../src/components/Select/Select.test.tsx          | 32 ++++++++++++++++++++++
 .../src/components/Select/Select.tsx               |  2 +-
 2 files changed, 33 insertions(+), 1 deletion(-)

diff --git a/superset-frontend/packages/superset-ui-core/src/components/Select/Select.test.tsx b/superset-frontend/packages/superset-ui-core/src/components/Select/Select.test.tsx
index 45656928757..6b89561627a 100644
--- a/superset-frontend/packages/superset-ui-core/src/components/Select/Select.test.tsx
+++ b/superset-frontend/packages/superset-ui-core/src/components/Select/Select.test.tsx
@@ -915,6 +915,38 @@ test('"Select all" does not affect disabled options', async () => {
   expect(await findSelectValue()).not.toHaveTextContent(options[1].label);
 });
 
+test('dropdown takes full width of the select input for multi select', async () => {
+  render(
+    <div style={{ width: '400px' }}>
+      <Select {...defaultProps} mode="multiple" options={OPTIONS} />
+    </div>,
+  );
+  await open();
+  const dropdown = document.querySelector(
+    '.ant-select-dropdown',
+  ) as HTMLElement;
+  expect(dropdown).toBeInTheDocument();
+  // When popupMatchSelectWidth is true, antd dynamically matches the
+  // trigger width and does not set a fixed inline width on the dropdown.
+  const widthValue = parseInt(dropdown.style.width, 10);
+  expect(Number.isNaN(widthValue) || widthValue === 0).toBe(true);
+});
+
+test('dropdown takes full width of the select input for single select', async () => {
+  render(
+    <div style={{ width: '400px' }}>
+      <Select {...defaultProps} mode="single" options={OPTIONS} />
+    </div>,
+  );
+  await open();
+  const dropdown = document.querySelector(
+    '.ant-select-dropdown',
+  ) as HTMLElement;
+  expect(dropdown).toBeInTheDocument();
+  const widthValue = parseInt(dropdown.style.width, 10);
+  expect(Number.isNaN(widthValue) || widthValue === 0).toBe(true);
+});
+
 test('does not fire onChange when searching but no selection', async () => {
   const onChange = jest.fn();
   render(
diff --git a/superset-frontend/packages/superset-ui-core/src/components/Select/Select.tsx b/superset-frontend/packages/superset-ui-core/src/components/Select/Select.tsx
index a5863d1a6f4..3f5d9cf4bf8 100644
--- a/superset-frontend/packages/superset-ui-core/src/components/Select/Select.tsx
+++ b/superset-frontend/packages/superset-ui-core/src/components/Select/Select.tsx
@@ -777,7 +777,7 @@ const Select = forwardRef(
           options={visibleOptions}
           optionRender={option => <Space>{option.label || option.value}</Space>}
           oneLine={oneLine}
-          popupMatchSelectWidth={selectAllEnabled ? 168 : true}
+          popupMatchSelectWidth
           css={props.css}
           dropdownAlign={DROPDOWN_ALIGN_BOTTOM}
           {...props}