Fix undefined dataset labels issue (#37)

* Filter data to exclude undefined values * Add test coverage for chartbuilder details
SalesforceLabs · Mar 22, 2021 · dd90fc3 · dd90fc3
1 parent 6aa097a
commit dd90fc3
Show file tree

Hide file tree

Showing 2 changed files with 41 additions and 10 deletions.
diff --git a/__tests__/unit/chartBuilder.test.js b/__tests__/unit/chartBuilder.test.js
@@ -111,6 +111,35 @@ describe('test property', () => {
     // Validate parameters of mocked Apex call
     expect(element.soql).toEqual(`'${ChartBuilder.FAKE_ID}'`);
   });
+
+  test('details success', () => {
+    const element = createElement('c-chartBuilder', { is: ChartBuilder });
+    document.body.appendChild(element);
+    const data = [
+      { labels: 'Item1', detail: [1, 2] },
+      { labels: 'Item2', detail: [9, 8] }
+    ];
+    element.details = JSON.stringify(data);
+
+    return flushPromises().then(() => {
+      expect(element.details.length).toEqual(data.length);
+    });
+  });
+
+  test('details success with undefined data removed', () => {
+    const element = createElement('c-chartBuilder', { is: ChartBuilder });
+    document.body.appendChild(element);
+    const data = [
+      { labels: 'Item1', detail: [1, 2] },
+      { labels: 'Item2', detail: [9, 8] },
+      { labels: 'Item3' }
+    ];
+    element.details = JSON.stringify(data);
+
+    return flushPromises().then(() => {
+      expect(element.details.length).toEqual(2);
+    });
+  });
 });
 
 const MOCK_GETCHARTDATA = [{ labels: ['test'], detail: [10] }];

diff --git a/force-app/main/default/lwc/chartBuilder/chartBuilder.js b/force-app/main/default/lwc/chartBuilder/chartBuilder.js
@@ -87,16 +87,18 @@ export default class ChartBuilder extends LightningElement {
           this.dimensionsLabels = this.dimensionsLabels || [
             ...new Set(data.map((x) => x.labels).flat())
           ];
-          this._details = data.map((x, i) => ({
-            detail: x.detail,
-            labels: this._detailsLabels[i],
-            uuid: x.uuid || nanoid(4),
-            bgColor:
-              x.bgColor || this.isDimensionable
-                ? x.detail.map((_, j) => palette[j % palette.length])
-                : palette[i % palette.length],
-            fill: this.fill
-          }));
+          this._details = data
+            .filter((x) => !!x.detail)
+            .map((x, i) => ({
+              detail: x.detail,
+              labels: this._detailsLabels[i],
+              uuid: x.uuid || nanoid(4),
+              bgColor:
+                x.bgColor || this.isDimensionable
+                  ? x.detail.map((_, j) => palette[j % palette.length])
+                  : palette[i % palette.length],
+              fill: this.fill
+            }));
           this.error = false;
         })
         .catch((error) => this.errorCallback(error));