Fix compare button for treatment tables on study view (#5097)

* fix missing compare button for treatment tables * add compare button tests --------- Co-authored-by: Bryan Lai <[email protected]>
cBioPortal · Jan 28, 2025 · ed681f1 · ed681f1
1 parent 3ff4904
commit ed681f1
Show file tree

Hide file tree

Showing 3 changed files with 48 additions and 3 deletions.
diff --git a/end-to-end-test/remote/specs/core/studyview.spec.js b/end-to-end-test/remote/specs/core/studyview.spec.js
@@ -984,6 +984,24 @@ describe('study view treatments table', () => {
         assertScreenShotMatch(res);
     });
 
+    it('compare button appears when selecting multiple rows in sample treatments', async () => {
+        const sampleTreatmentsFirstCheckbox =
+            '[data-test="SAMPLE_TREATMENTS-table"] .ReactVirtualized__Table__row:nth-child(1) input';
+        const sampleTreatmentsSecondCheckbox =
+            '[data-test="SAMPLE_TREATMENTS-table"] .ReactVirtualized__Table__row:nth-child(2) input';
+        const sampleTreatmentsCompareButton = '[data-test="table-compare-btn"]';
+        const url = `${CBIOPORTAL_URL}/study/summary?id=lgg_ucsf_2014`;
+        await goToUrlAndSetLocalStorage(url);
+
+        await (await getElement(sampleTreatmentsFirstCheckbox)).waitForExist();
+        await clickElement(sampleTreatmentsFirstCheckbox);
+        await (await getElement(sampleTreatmentsSecondCheckbox)).waitForExist();
+        await clickElement(sampleTreatmentsSecondCheckbox);
+        assert(
+            await (await getElement(sampleTreatmentsCompareButton)).isExisting()
+        );
+    });
+
     it('can filter a study by patient treatments', async () => {
         const url = `${CBIOPORTAL_URL}/study/summary?id=lgg_ucsf_2014`;
         await goToUrlAndSetLocalStorage(url);
@@ -1004,6 +1022,30 @@ describe('study view treatments table', () => {
         const res = await checkElementWithMouseDisabled('#mainColumn');
         assertScreenShotMatch(res);
     });
+
+    it('compare button appears when selecting multiple rows in patient treatments', async () => {
+        const url = `${CBIOPORTAL_URL}/study/summary?id=lgg_ucsf_2014`;
+        await goToUrlAndSetLocalStorage(url);
+
+        const patientTreatmentsFirstCheckbox =
+            '[data-test="PATIENT_TREATMENTS-table"] .ReactVirtualized__Table__row:nth-child(1) input';
+        const patientTreatmentsSecondCheckbox =
+            '[data-test="PATIENT_TREATMENTS-table"] .ReactVirtualized__Table__row:nth-child(2) input';
+        const patientTreatmentsCompareButton =
+            '[data-test="table-compare-btn"]';
+
+        await (await getElement(patientTreatmentsFirstCheckbox)).waitForExist();
+        await clickElement(patientTreatmentsFirstCheckbox);
+        await (
+            await getElement(patientTreatmentsSecondCheckbox)
+        ).waitForExist();
+        await clickElement(patientTreatmentsSecondCheckbox);
+        assert(
+            await (
+                await getElement(patientTreatmentsCompareButton)
+            ).isExisting()
+        );
+    });
 });
 
 describe('study view mutations table', () => {

diff --git a/src/pages/studyView/StudyViewPageStore.ts b/src/pages/studyView/StudyViewPageStore.ts
@@ -1524,10 +1524,10 @@ export class StudyViewPageStore
                 promises,
                 async (
                     selectedSampleSet: ComplexKeyMap<Sample>,
-                    sampleTreatments: SampleTreatmentRow[]
+                    sampleTreatments: SampleTreatmentReport
                 ) => {
                     const treatmentKeysMap = _.keyBy(treatmentUniqueKeys);
-                    const desiredTreatments = sampleTreatments.filter(
+                    const desiredTreatments = sampleTreatments.treatments.filter(
                         t =>
                             treatmentUniqueKey(t, isPatientType) in
                             treatmentKeysMap

diff --git a/src/pages/studyView/charts/ChartContainer.tsx b/src/pages/studyView/charts/ChartContainer.tsx
@@ -394,7 +394,9 @@ export class ChartContainer extends React.Component<IChartContainerProps, {}> {
     get comparisonPagePossible(): boolean {
         return (
             this.props.promise.isComplete &&
-            this.props.promise.result!.length > 1 &&
+            (this.props.promise.result.treatments ??
+                this.props.promise.result.patientTreatments ??
+                this.props.promise.result)!.length > 1 &&
             COMPARISON_CHART_TYPES.indexOf(this.props.chartType) > -1 &&
             !this.props.chartMeta.mutationOptionType
         );
@@ -492,6 +494,7 @@ export class ChartContainer extends React.Component<IChartContainerProps, {}> {
                 content: (
                     <div
                         data-tour="mutated-genes-table-compare-btn"
+                        data-test="table-compare-btn"
                         style={{ display: 'flex', alignItems: 'center' }}
                     >
                         <ComparisonVsIcon