fix(stacked-series-chart): Clearing selection when using stack mode.

dynatrace-oss · Feb 23, 2021 · 87764fa · 87764fa
1 parent 7fc3305
commit 87764fa
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 10 deletions.
diff --git a/apps/dev/src/stacked-series-chart/stacked-series-chart-demo.component.html b/apps/dev/src/stacked-series-chart/stacked-series-chart-demo.component.html
@@ -91,14 +91,7 @@ <h4>Selection Mode</h4>
     </dt-button-group>
     <br />
     <br />
-    <!-- TODO: APM-282124 Allow clearing the selection on stack mode from the outside -->
-    <button
-      dt-button
-      (click)="clearSelection()"
-      [disabled]="selectionMode === 'stack'"
-    >
-      Clear selection
-    </button>
+    <button dt-button (click)="clearSelection()">Clear selection</button>
 
     <pre>{{ selected | json }}</pre>
   </div>

diff --git a/libs/barista-components/stacked-series-chart/src/stacked-series-chart.spec.ts b/libs/barista-components/stacked-series-chart/src/stacked-series-chart.spec.ts
@@ -326,6 +326,22 @@ describe('DtStackedSeriesChart', () => {
 
       expect(selectedChangeSpy).not.toHaveBeenCalled();
     });
+
+    it('should clear the selection from the outside on stack mode', () => {
+      rootComponent.selectionMode = 'stack';
+      rootComponent.selected = [
+        stackedSeriesChartDemoDataCoffee[1],
+        stackedSeriesChartDemoDataCoffee[1].nodes[1],
+      ];
+      fixture.detectChanges();
+
+      expect(getSelectedSlice() !== null).toBe(true);
+
+      rootComponent.selected = [];
+      fixture.detectChanges();
+
+      expect(getSelectedSlice()).toBe(null);
+    });
   });
 
   describe('Value Display Mode', () => {

diff --git a/libs/barista-components/stacked-series-chart/src/stacked-series-chart.ts b/libs/barista-components/stacked-series-chart/src/stacked-series-chart.ts
@@ -289,8 +289,8 @@ export class DtStackedSeriesChart implements OnDestroy, OnInit {
     return this._selected;
   }
   set selected([series, node]: DtStackedSeriesChartSelection | []) {
-    // if selected node is different than current
-    if (this._selected[1] !== node) {
+    // if selected node or series are different than current
+    if (this._selected[0] !== series || this._selected[1] !== node) {
       this._toggleSelect(series, node);
     }
   }