This is an automated email from the ASF dual-hosted git repository.
elizabeth pushed a commit to branch fix/filter-value-metric-based-sorting
in repository https://gitbox.apache.org/repos/asf/superset.git
commit 5fe1955c4953d0e6903611ad2f4c49ca17f874b2
Author: Elizabeth Thompson <eschu...@gmail.com>
AuthorDate: Mon Sep 15 14:39:41 2025 -0700
test(filters): add comprehensive tests for sortMetric functionality
Adds test coverage for the sortMetric sorting behavior implemented in the
SelectFilterPlugin component:
- Tests that backend order is preserved when sortMetric is specified
- Tests that alphabetical sorting is applied when no sortMetric is specified
- Tests ascending and descending alphabetical sorting behavior
- Tests that sortMetric takes precedence over sortAscending setting
These tests ensure the fix for metric-based sorting works correctly across
all scenarios while maintaining backwards compatibility with existing
alphabetical sorting behavior.
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <nore...@anthropic.com>
---
.../components/Select/SelectFilterPlugin.test.tsx | 296 +++++++++++++++++++++
1 file changed, 296 insertions(+)
diff --git
a/superset-frontend/src/filters/components/Select/SelectFilterPlugin.test.tsx
b/superset-frontend/src/filters/components/Select/SelectFilterPlugin.test.tsx
index c867077f3e..ab1097b4c5 100644
---
a/superset-frontend/src/filters/components/Select/SelectFilterPlugin.test.tsx
+++
b/superset-frontend/src/filters/components/Select/SelectFilterPlugin.test.tsx
@@ -378,4 +378,300 @@ describe('SelectFilterPlugin', () => {
userEvent.type(screen.getByRole('combobox'), 'new value');
expect(await screen.findByTitle('new value')).toBeInTheDocument();
});
+
+ test('preserves backend order when sortMetric is specified', () => {
+ const testData = [
+ { gender: 'zebra' },
+ { gender: 'alpha' },
+ { gender: 'beta' },
+ ];
+
+ const testProps = {
+ ...selectMultipleProps,
+ formData: {
+ ...selectMultipleProps.formData,
+ sortMetric: 'count',
+ sortAscending: true,
+ },
+ queriesData: [
+ {
+ rowcount: 3,
+ colnames: ['gender'],
+ coltypes: [1],
+ data: testData,
+ applied_filters: [{ column: 'gender' }],
+ rejected_filters: [],
+ },
+ ],
+ filterState: {
+ value: [],
+ label: '',
+ excludeFilterValues: true,
+ },
+ };
+
+ render(
+ // @ts-ignore
+ <SelectFilterPlugin
+ // @ts-ignore
+ {...transformProps(testProps)}
+ setDataMask={jest.fn()}
+ showOverflow={false}
+ />,
+ {
+ useRedux: true,
+ initialState: {
+ nativeFilters: {
+ filters: {
+ 'test-filter': {
+ name: 'Test Filter',
+ },
+ },
+ },
+ dataMask: {
+ 'test-filter': {
+ extraFormData: {},
+ filterState: {
+ value: [],
+ label: '',
+ excludeFilterValues: true,
+ },
+ },
+ },
+ },
+ },
+ );
+
+ const filterSelect = screen.getAllByRole('combobox')[0];
+ userEvent.click(filterSelect);
+
+ // When sortMetric is specified, options should appear in the original
data order
+ // (zebra, alpha, beta) not alphabetically sorted
+ const options = screen.getAllByRole('option');
+ expect(options[0]).toHaveTextContent('zebra');
+ expect(options[1]).toHaveTextContent('alpha');
+ expect(options[2]).toHaveTextContent('beta');
+ });
+
+ test('applies alphabetical sorting when sortMetric is not specified', () => {
+ const testData = [
+ { gender: 'zebra' },
+ { gender: 'alpha' },
+ { gender: 'beta' },
+ ];
+
+ const testProps = {
+ ...selectMultipleProps,
+ formData: {
+ ...selectMultipleProps.formData,
+ sortMetric: undefined,
+ sortAscending: true,
+ },
+ queriesData: [
+ {
+ rowcount: 3,
+ colnames: ['gender'],
+ coltypes: [1],
+ data: testData,
+ applied_filters: [{ column: 'gender' }],
+ rejected_filters: [],
+ },
+ ],
+ filterState: {
+ value: [],
+ label: '',
+ excludeFilterValues: true,
+ },
+ };
+
+ render(
+ // @ts-ignore
+ <SelectFilterPlugin
+ // @ts-ignore
+ {...transformProps(testProps)}
+ setDataMask={jest.fn()}
+ showOverflow={false}
+ />,
+ {
+ useRedux: true,
+ initialState: {
+ nativeFilters: {
+ filters: {
+ 'test-filter': {
+ name: 'Test Filter',
+ },
+ },
+ },
+ dataMask: {
+ 'test-filter': {
+ extraFormData: {},
+ filterState: {
+ value: [],
+ label: '',
+ excludeFilterValues: true,
+ },
+ },
+ },
+ },
+ },
+ );
+
+ const filterSelect = screen.getAllByRole('combobox')[0];
+ userEvent.click(filterSelect);
+
+ // When sortMetric is not specified, options should be sorted
alphabetically
+ // (alpha, beta, zebra)
+ const options = screen.getAllByRole('option');
+ expect(options[0]).toHaveTextContent('alpha');
+ expect(options[1]).toHaveTextContent('beta');
+ expect(options[2]).toHaveTextContent('zebra');
+ });
+
+ test('applies descending alphabetical sorting when sortAscending is false
and no sortMetric', () => {
+ const testData = [
+ { gender: 'zebra' },
+ { gender: 'alpha' },
+ { gender: 'beta' },
+ ];
+
+ const testProps = {
+ ...selectMultipleProps,
+ formData: {
+ ...selectMultipleProps.formData,
+ sortMetric: undefined,
+ sortAscending: false,
+ },
+ queriesData: [
+ {
+ rowcount: 3,
+ colnames: ['gender'],
+ coltypes: [1],
+ data: testData,
+ applied_filters: [{ column: 'gender' }],
+ rejected_filters: [],
+ },
+ ],
+ filterState: {
+ value: [],
+ label: '',
+ excludeFilterValues: true,
+ },
+ };
+
+ render(
+ // @ts-ignore
+ <SelectFilterPlugin
+ // @ts-ignore
+ {...transformProps(testProps)}
+ setDataMask={jest.fn()}
+ showOverflow={false}
+ />,
+ {
+ useRedux: true,
+ initialState: {
+ nativeFilters: {
+ filters: {
+ 'test-filter': {
+ name: 'Test Filter',
+ },
+ },
+ },
+ dataMask: {
+ 'test-filter': {
+ extraFormData: {},
+ filterState: {
+ value: [],
+ label: '',
+ excludeFilterValues: true,
+ },
+ },
+ },
+ },
+ },
+ );
+
+ const filterSelect = screen.getAllByRole('combobox')[0];
+ userEvent.click(filterSelect);
+
+ // When sortAscending is false and no sortMetric, options should be sorted
+ // in descending alphabetical order (zebra, beta, alpha)
+ const options = screen.getAllByRole('option');
+ expect(options[0]).toHaveTextContent('zebra');
+ expect(options[1]).toHaveTextContent('beta');
+ expect(options[2]).toHaveTextContent('alpha');
+ });
+
+ test('preserves backend order even when sortAscending is false and
sortMetric is specified', () => {
+ const testData = [
+ { gender: 'zebra' },
+ { gender: 'alpha' },
+ { gender: 'beta' },
+ ];
+
+ const testProps = {
+ ...selectMultipleProps,
+ formData: {
+ ...selectMultipleProps.formData,
+ sortMetric: 'count',
+ sortAscending: false,
+ },
+ queriesData: [
+ {
+ rowcount: 3,
+ colnames: ['gender'],
+ coltypes: [1],
+ data: testData,
+ applied_filters: [{ column: 'gender' }],
+ rejected_filters: [],
+ },
+ ],
+ filterState: {
+ value: [],
+ label: '',
+ excludeFilterValues: true,
+ },
+ };
+
+ render(
+ // @ts-ignore
+ <SelectFilterPlugin
+ // @ts-ignore
+ {...transformProps(testProps)}
+ setDataMask={jest.fn()}
+ showOverflow={false}
+ />,
+ {
+ useRedux: true,
+ initialState: {
+ nativeFilters: {
+ filters: {
+ 'test-filter': {
+ name: 'Test Filter',
+ },
+ },
+ },
+ dataMask: {
+ 'test-filter': {
+ extraFormData: {},
+ filterState: {
+ value: [],
+ label: '',
+ excludeFilterValues: true,
+ },
+ },
+ },
+ },
+ },
+ );
+
+ const filterSelect = screen.getAllByRole('combobox')[0];
+ userEvent.click(filterSelect);
+
+ // When sortMetric is specified, original order should be preserved
regardless
+ // of sortAscending value (zebra, alpha, beta)
+ const options = screen.getAllByRole('option');
+ expect(options[0]).toHaveTextContent('zebra');
+ expect(options[1]).toHaveTextContent('alpha');
+ expect(options[2]).toHaveTextContent('beta');
+ });
});
