ArrayDataFrame: use normal property for fields and length (#24145)

packages/grafana-data/src/dataframe/ArrayDataFrame.test.ts

 import { ArrayDataFrame } from './ArrayDataFrame';
 import { toDataFrameDTO } from './processDataFrame';
-import { FieldType } from '../types';
+import { FieldType, DataFrame } from '../types';
 
 describe('Array DataFrame', () => {
   const input = [
@@ -92,4 +92,14 @@ describe('Array DataFrame', () => {
       }
     `);
   });
+
+  test('Survives ES6 operations', () => {
+    const copy: DataFrame = {
+      ...frame,
+      name: 'hello',
+    };
+    expect(copy.fields).toEqual(frame.fields);
+    expect(copy.length).toEqual(frame.length);
+    expect(copy.length).toEqual(input.length);
+  });
 });

packages/grafana-data/src/dataframe/ArrayDataFrame.ts

@@ -40,14 +40,16 @@ export class ArrayDataFrame<T = any> extends FunctionalVector<T> implements Data
   refId?: string;
   meta?: QueryResultMeta;
 
-  private theFields: Field[] = [];
+  fields: Field[] = [];
+  length = 0;
 
   constructor(private source: T[], names?: string[]) {
     super();
 
+    this.length = source.length;
     const first: any = source.length ? source[0] : {};
     if (names) {
-      this.theFields = names.map(name => {
+      this.fields = names.map(name => {
         return {
           name,
           type: guessFieldTypeFromNameAndValue(name, first[name]),
@@ -64,7 +66,7 @@ export class ArrayDataFrame<T = any> extends FunctionalVector<T> implements Data
    * Add a field for each property in the object.  This will guess the type
    */
   setFieldsFromObject(obj: any) {
-    this.theFields = Object.keys(obj).map(name => {
+    this.fields = Object.keys(obj).map(name => {
       return {
         name,
         type: guessFieldTypeFromNameAndValue(name, obj[name]),
@@ -94,15 +96,6 @@ export class ArrayDataFrame<T = any> extends FunctionalVector<T> implements Data
     return field;
   }
 
-  get fields(): Field[] {
-    return this.theFields;
-  }
-
-  // Defined for Vector interface
-  get length() {
-    return this.source.length;
-  }
-
   /**
    * Get an object with a property for each field in the DataFrame
    */

packages/grafana-data/src/dataframe/processDataFrame.ts

@@ -19,6 +19,7 @@ import { isDateTime } from '../datetime/moment_wrapper';
 import { ArrayVector } from '../vector/ArrayVector';
 import { MutableDataFrame } from './MutableDataFrame';
 import { SortedVector } from '../vector/SortedVector';
+import { ArrayDataFrame } from './ArrayDataFrame';
 
 function convertTableToDataFrame(table: TableData): DataFrame {
   const fields = table.columns.map(c => {
@@ -293,6 +294,10 @@ export function toDataFrame(data: any): DataFrame {
     return convertTableToDataFrame(data);
   }
 
+  if (Array.isArray(data)) {
+    return new ArrayDataFrame(data);
+  }
+
   console.warn('Can not convert', data);
   throw new Error('Unsupported data format');
 }