Transformations: Handle special case with nested dataframes/JSON (#109876)

* Fix crashes

* Remove inline snapshot

packages/grafana-data/src/transformations/transformers/__snapshots__/groupingToMatrix.test.ts.snap

@@ -0,0 +1,33 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Grouping to Matrix generates Matrix ignoring special value when value type is frame 1`] = `
+[
+  {
+    "config": {},
+    "name": "Row\\Column",
+    "type": "string",
+    "values": [
+      "R1",
+      "R2",
+    ],
+  },
+  {
+    "config": {},
+    "name": "C1",
+    "type": "frame",
+    "values": [
+      {},
+      undefined,
+    ],
+  },
+  {
+    "config": {},
+    "name": "C2",
+    "type": "frame",
+    "values": [
+      {},
+      undefined,
+    ],
+  },
+]
+`;

packages/grafana-data/src/transformations/transformers/groupingToMatrix.test.ts

@@ -333,4 +333,31 @@ describe('Grouping to Matrix', () => {
       `);
     });
   });
+
+  it('generates Matrix ignoring special value when value type is frame', async () => {
+    const cfg: DataTransformerConfig<GroupingToMatrixTransformerOptions> = {
+      id: DataTransformerID.groupingToMatrix,
+      options: {
+        columnField: 'Column',
+        rowField: 'Row',
+        valueField: 'Temp',
+        emptyValue: SpecialValue.Zero,
+      },
+    };
+
+    const seriesA = toDataFrame({
+      name: 'C',
+      fields: [
+        { name: 'Column', type: FieldType.string, values: ['C1', 'C1', 'C2'] },
+        { name: 'Row', type: FieldType.string, values: ['R1', 'R2', 'R1'] },
+        { name: 'Temp', type: FieldType.frame, values: [{}, null, {}] },
+      ],
+    });
+
+    await expect(transformDataFrame([cfg], [seriesA])).toEmitValuesWith((received) => {
+      const processed = received[0];
+
+      expect(processed[0].fields).toMatchSnapshot();
+    });
+  });
 });

packages/grafana-data/src/transformations/transformers/groupingToMatrix.ts

@@ -1,7 +1,7 @@
 import { map } from 'rxjs/operators';
 
 import { getFieldDisplayName } from '../../field/fieldState';
-import { DataFrame, Field } from '../../types/dataFrame';
+import { DataFrame, Field, FieldType } from '../../types/dataFrame';
 import {
   SpecialValue,
   DataTransformerInfo,
@@ -114,7 +114,10 @@ export const groupingToMatrixTransformer: DataTransformerInfo<GroupingToMatrixTr
         for (const columnName of columnValues) {
           let values = [];
           for (const rowName of rowValues) {
-            const value = matrixValues[columnName][rowName] ?? getSpecialValue(emptyValue);
+            // nested dataframes need to be undefined when empty
+            const value =
+              matrixValues[columnName][rowName] ??
+              (valueField.type === FieldType.frame ? undefined : getSpecialValue(emptyValue));
             values.push(value);
           }
 

packages/grafana-ui/src/components/Table/Cells/JSONViewCell.tsx

@@ -25,7 +25,12 @@ export function JSONViewCell(props: TableCellProps): JSX.Element {
       value = JSON.parse(value);
     } catch {} // ignore errors
   } else {
-    displayValue = JSON.stringify(value, null, ' ');
+    try {
+      // JSON may refer to itself, which errors on stringify
+      displayValue = JSON.stringify(value, null, ' ');
+    } catch {
+      displayValue = undefined; // if it won't stringify, mark undefined
+    }
   }
 
   const links = getCellLinks(field, row) || [];