Skip to content

Commit fa88e17

Browse files
eschuthoclaude
eschutho
and
claude
committed
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 <noreply@anthropic.com>
1 parent 8ecffa7 commit fa88e17

1 file changed

Lines changed: 296 additions & 0 deletions

File tree

‎superset-frontend/src/filters/components/Select/SelectFilterPlugin.test.tsx‎

Lines changed: 296 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -379,4 +379,300 @@ describe('SelectFilterPlugin', () => {
379379
userEvent.type(screen.getByRole('combobox'), 'new value');
380380
expect(await screen.findByTitle('new value')).toBeInTheDocument();
381381
});
382+
383+
test('preserves backend order when sortMetric is specified', () => {
384+
const testData = [
385+
{ gender: 'zebra' },
386+
{ gender: 'alpha' },
387+
{ gender: 'beta' },
388+
];
389+
390+
const testProps = {
391+
...selectMultipleProps,
392+
formData: {
393+
...selectMultipleProps.formData,
394+
sortMetric: 'count',
395+
sortAscending: true,
396+
},
397+
queriesData: [
398+
{
399+
rowcount: 3,
400+
colnames: ['gender'],
401+
coltypes: [1],
402+
data: testData,
403+
applied_filters: [{ column: 'gender' }],
404+
rejected_filters: [],
405+
},
406+
],
407+
filterState: {
408+
value: [],
409+
label: '',
410+
excludeFilterValues: true,
411+
},
412+
};
413+
414+
render(
415+
// @ts-ignore
416+
<SelectFilterPlugin
417+
// @ts-ignore
418+
{...transformProps(testProps)}
419+
setDataMask={jest.fn()}
420+
showOverflow={false}
421+
/>,
422+
{
423+
useRedux: true,
424+
initialState: {
425+
nativeFilters: {
426+
filters: {
427+
'test-filter': {
428+
name: 'Test Filter',
429+
},
430+
},
431+
},
432+
dataMask: {
433+
'test-filter': {
434+
extraFormData: {},
435+
filterState: {
436+
value: [],
437+
label: '',
438+
excludeFilterValues: true,
439+
},
440+
},
441+
},
442+
},
443+
},
444+
);
445+
446+
const filterSelect = screen.getAllByRole('combobox')[0];
447+
userEvent.click(filterSelect);
448+
449+
// When sortMetric is specified, options should appear in the original data order
450+
// (zebra, alpha, beta) not alphabetically sorted
451+
const options = screen.getAllByRole('option');
452+
expect(options[0]).toHaveTextContent('zebra');
453+
expect(options[1]).toHaveTextContent('alpha');
454+
expect(options[2]).toHaveTextContent('beta');
455+
});
456+
457+
test('applies alphabetical sorting when sortMetric is not specified', () => {
458+
const testData = [
459+
{ gender: 'zebra' },
460+
{ gender: 'alpha' },
461+
{ gender: 'beta' },
462+
];
463+
464+
const testProps = {
465+
...selectMultipleProps,
466+
formData: {
467+
...selectMultipleProps.formData,
468+
sortMetric: undefined,
469+
sortAscending: true,
470+
},
471+
queriesData: [
472+
{
473+
rowcount: 3,
474+
colnames: ['gender'],
475+
coltypes: [1],
476+
data: testData,
477+
applied_filters: [{ column: 'gender' }],
478+
rejected_filters: [],
479+
},
480+
],
481+
filterState: {
482+
value: [],
483+
label: '',
484+
excludeFilterValues: true,
485+
},
486+
};
487+
488+
render(
489+
// @ts-ignore
490+
<SelectFilterPlugin
491+
// @ts-ignore
492+
{...transformProps(testProps)}
493+
setDataMask={jest.fn()}
494+
showOverflow={false}
495+
/>,
496+
{
497+
useRedux: true,
498+
initialState: {
499+
nativeFilters: {
500+
filters: {
501+
'test-filter': {
502+
name: 'Test Filter',
503+
},
504+
},
505+
},
506+
dataMask: {
507+
'test-filter': {
508+
extraFormData: {},
509+
filterState: {
510+
value: [],
511+
label: '',
512+
excludeFilterValues: true,
513+
},
514+
},
515+
},
516+
},
517+
},
518+
);
519+
520+
const filterSelect = screen.getAllByRole('combobox')[0];
521+
userEvent.click(filterSelect);
522+
523+
// When sortMetric is not specified, options should be sorted alphabetically
524+
// (alpha, beta, zebra)
525+
const options = screen.getAllByRole('option');
526+
expect(options[0]).toHaveTextContent('alpha');
527+
expect(options[1]).toHaveTextContent('beta');
528+
expect(options[2]).toHaveTextContent('zebra');
529+
});
530+
531+
test('applies descending alphabetical sorting when sortAscending is false and no sortMetric', () => {
532+
const testData = [
533+
{ gender: 'zebra' },
534+
{ gender: 'alpha' },
535+
{ gender: 'beta' },
536+
];
537+
538+
const testProps = {
539+
...selectMultipleProps,
540+
formData: {
541+
...selectMultipleProps.formData,
542+
sortMetric: undefined,
543+
sortAscending: false,
544+
},
545+
queriesData: [
546+
{
547+
rowcount: 3,
548+
colnames: ['gender'],
549+
coltypes: [1],
550+
data: testData,
551+
applied_filters: [{ column: 'gender' }],
552+
rejected_filters: [],
553+
},
554+
],
555+
filterState: {
556+
value: [],
557+
label: '',
558+
excludeFilterValues: true,
559+
},
560+
};
561+
562+
render(
563+
// @ts-ignore
564+
<SelectFilterPlugin
565+
// @ts-ignore
566+
{...transformProps(testProps)}
567+
setDataMask={jest.fn()}
568+
showOverflow={false}
569+
/>,
570+
{
571+
useRedux: true,
572+
initialState: {
573+
nativeFilters: {
574+
filters: {
575+
'test-filter': {
576+
name: 'Test Filter',
577+
},
578+
},
579+
},
580+
dataMask: {
581+
'test-filter': {
582+
extraFormData: {},
583+
filterState: {
584+
value: [],
585+
label: '',
586+
excludeFilterValues: true,
587+
},
588+
},
589+
},
590+
},
591+
},
592+
);
593+
594+
const filterSelect = screen.getAllByRole('combobox')[0];
595+
userEvent.click(filterSelect);
596+
597+
// When sortAscending is false and no sortMetric, options should be sorted
598+
// in descending alphabetical order (zebra, beta, alpha)
599+
const options = screen.getAllByRole('option');
600+
expect(options[0]).toHaveTextContent('zebra');
601+
expect(options[1]).toHaveTextContent('beta');
602+
expect(options[2]).toHaveTextContent('alpha');
603+
});
604+
605+
test('preserves backend order even when sortAscending is false and sortMetric is specified', () => {
606+
const testData = [
607+
{ gender: 'zebra' },
608+
{ gender: 'alpha' },
609+
{ gender: 'beta' },
610+
];
611+
612+
const testProps = {
613+
...selectMultipleProps,
614+
formData: {
615+
...selectMultipleProps.formData,
616+
sortMetric: 'count',
617+
sortAscending: false,
618+
},
619+
queriesData: [
620+
{
621+
rowcount: 3,
622+
colnames: ['gender'],
623+
coltypes: [1],
624+
data: testData,
625+
applied_filters: [{ column: 'gender' }],
626+
rejected_filters: [],
627+
},
628+
],
629+
filterState: {
630+
value: [],
631+
label: '',
632+
excludeFilterValues: true,
633+
},
634+
};
635+
636+
render(
637+
// @ts-ignore
638+
<SelectFilterPlugin
639+
// @ts-ignore
640+
{...transformProps(testProps)}
641+
setDataMask={jest.fn()}
642+
showOverflow={false}
643+
/>,
644+
{
645+
useRedux: true,
646+
initialState: {
647+
nativeFilters: {
648+
filters: {
649+
'test-filter': {
650+
name: 'Test Filter',
651+
},
652+
},
653+
},
654+
dataMask: {
655+
'test-filter': {
656+
extraFormData: {},
657+
filterState: {
658+
value: [],
659+
label: '',
660+
excludeFilterValues: true,
661+
},
662+
},
663+
},
664+
},
665+
},
666+
);
667+
668+
const filterSelect = screen.getAllByRole('combobox')[0];
669+
userEvent.click(filterSelect);
670+
671+
// When sortMetric is specified, original order should be preserved regardless
672+
// of sortAscending value (zebra, alpha, beta)
673+
const options = screen.getAllByRole('option');
674+
expect(options[0]).toHaveTextContent('zebra');
675+
expect(options[1]).toHaveTextContent('alpha');
676+
expect(options[2]).toHaveTextContent('beta');
677+
});
382678
});

0 commit comments

Comments
 (0)