Fix error when swapping dataset locations (#9183)

chartjs · May 30, 2021 · 9326309 · 9326309
1 parent c853ca6
commit 9326309
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 19 deletions.
diff --git a/src/core/core.controller.js b/src/core/core.controller.js
@@ -347,23 +347,6 @@ class Chart {
     });
   }
 
-  /**
-	 * Updates the given metaset with the given dataset index. Ensures it's stored at that index
-	 * in the _metasets array by swapping with the metaset at that index if necessary.
-	 * @param {Object} meta - the dataset metadata
-	 * @param {number} index - the dataset index
-	 * @private
-	 */
-  _updateMetasetIndex(meta, index) {
-    const metasets = this._metasets;
-    const oldIndex = meta.index;
-    if (oldIndex !== index) {
-      metasets[oldIndex] = metasets[index];
-      metasets[index] = meta;
-      meta.index = index;
-    }
-  }
-
   /**
 	 * @private
 	 */
@@ -373,6 +356,7 @@ class Chart {
     const numData = me.data.datasets.length;
     const numMeta = metasets.length;
 
+    metasets.sort((a, b) => a.index - b.index);
     if (numMeta > numData) {
       for (let i = numData; i < numMeta; ++i) {
         me._destroyDatasetMeta(i);
@@ -418,7 +402,7 @@ class Chart {
       meta.type = type;
       meta.indexAxis = dataset.indexAxis || getIndexAxis(type, me.options);
       meta.order = dataset.order || 0;
-      me._updateMetasetIndex(meta, i);
+      meta.index = i;
       meta.label = '' + dataset.label;
       meta.visible = me.isDatasetVisible(i);
 
@@ -764,7 +748,7 @@ class Chart {
     let meta = metasets.filter(x => x && x._dataset === dataset).pop();
 
     if (!meta) {
-      meta = metasets[datasetIndex] = {
+      meta = {
         type: null,
         data: [],
         dataset: null,
@@ -778,6 +762,7 @@ class Chart {
         _parsed: [],
         _sorted: false
       };
+      metasets.push(meta);
     }
 
     return meta;

diff --git a/test/specs/core.controller.tests.js b/test/specs/core.controller.tests.js
@@ -1778,6 +1778,33 @@ describe('Chart', function() {
       expect(metasets[2].order).toEqual(4);
       expect(metasets[3].order).toEqual(3);
     });
+    it('should update properly when dataset locations are swapped', function() {
+      const orig = this.chart.data.datasets;
+      this.chart.data.datasets = [orig[0], orig[2], orig[1], orig[3]];
+      this.chart.update();
+      let metasets = this.chart._metasets;
+      expect(metasets[0].label).toEqual('1');
+      expect(metasets[1].label).toEqual('3');
+      expect(metasets[2].label).toEqual('2');
+      expect(metasets[3].label).toEqual('4');
+
+      this.chart.data.datasets = [{label: 'new', order: 10}, orig[3], orig[2], orig[1], orig[0]];
+      this.chart.update();
+      metasets = this.chart._metasets;
+      expect(metasets[0].label).toEqual('new');
+      expect(metasets[1].label).toEqual('4');
+      expect(metasets[2].label).toEqual('3');
+      expect(metasets[3].label).toEqual('2');
+      expect(metasets[4].label).toEqual('1');
+
+      this.chart.data.datasets = [orig[3], orig[2], orig[1], {label: 'new', order: 10}];
+      this.chart.update();
+      metasets = this.chart._metasets;
+      expect(metasets[0].label).toEqual('4');
+      expect(metasets[1].label).toEqual('3');
+      expect(metasets[2].label).toEqual('2');
+      expect(metasets[3].label).toEqual('new');
+    });
   });
 
   describe('data visibility', function() {