Chart: recreate legend's title to prevent caching leading to stale va…

…lues (T1210271) (#27498)
DevExpress · Jun 12, 2024 · 2b9a655 · 2b9a655
1 parent 960767b
commit 2b9a655
Show file tree

Hide file tree

Showing 3 changed files with 43 additions and 2 deletions.
diff --git a/packages/devextreme/js/viz/components/legend.js b/packages/devextreme/js/viz/components/legend.js
@@ -423,7 +423,9 @@ extend(legendPrototype, {
             y: 0
         };
 
-        if(that.isVisible() && !that._title) {
+        if(that.isVisible()) {
+            that._title?.dispose();
+
             that._title = new Title({ renderer: that._renderer, cssClass: that._titleGroupClass, root: that._legendGroup });
         }
 

diff --git a/packages/devextreme/testing/tests/DevExpress.viz.charts/chartInteraction.tests.js b/packages/devextreme/testing/tests/DevExpress.viz.charts/chartInteraction.tests.js
@@ -7,6 +7,7 @@ import 'viz/chart';
 import 'viz/polar_chart';
 
 const SERIES_POINT_MARKER_SELECTOR = '.dxc-series circle';
+const LEGEND_TEXT_SELECTOR = '.dxc-legend .dxc-title text';
 
 QUnit.testStart(function() {
     const markup =
@@ -223,6 +224,44 @@ QUnit.test('Legend\'s title as string', function(assert) {
     assert.strictEqual(drawn.callCount, 1);
 });
 
+QUnit.test('Legend title position should not change after legend visibility change (T1210271)', function(assert) {
+    const chart = $('#chart').dxChart({
+        legend: {
+            title: 'Legend',
+            visible: true
+        },
+        series: [{}],
+    });
+
+    const initialTextY = Number(chart.find(LEGEND_TEXT_SELECTOR).attr('y'));
+
+    assert.roughEqual(initialTextY, 17, 2);
+
+    const chartInstance = chart.dxChart('instance');
+    chartInstance.option('legend.visible', false);
+    chartInstance.option('legend.visible', true);
+
+    const textYAfterVisibilityChange = Number(chart.find(LEGEND_TEXT_SELECTOR).attr('y'));
+    assert.roughEqual(textYAfterVisibilityChange, 17, 2);
+});
+
+QUnit.test('Old title should be disposed upon creating a new one', function(assert) {
+    const chart = $('#chart').dxChart({
+        legend: {
+            title: 'Legend',
+            visible: true
+        },
+        series: [{}],
+    }).dxChart('instance');
+
+    const disposeSpy = sinon.spy(chart._legend._title, 'dispose');
+
+    chart.option('legend.visible', false);
+    chart.option('legend.visible', true);
+
+    assert.strictEqual(disposeSpy.callCount, 1);
+});
+
 // T999609
 QUnit.test('Value axis range ajusting after resetVisualRange', function(assert) {
     const dataSource = [];

diff --git a/packages/devextreme/testing/tests/DevExpress.viz.vectorMap/legend.tests.js b/packages/devextreme/testing/tests/DevExpress.viz.vectorMap/legend.tests.js
@@ -182,7 +182,7 @@ QUnit.test('resize', function(assert) {
 
     this.legend.resize({ width: 300, height: 100 });
 
-    assert.strictEqual(this.renderer.g.callCount, 18, 'redrawn');
+    assert.strictEqual(this.renderer.g.callCount, 19, 'redrawn');
     assert.strictEqual(this.notifyDirty.callCount, 1, 'notify dirty');
     assert.strictEqual(this.notifyReady.callCount, 1, 'notify ready');
 });