cleanup and functional test

IanMatthewHuff · IanMatthewHuff · commit c77edb7412ba · 2019-04-22T14:41:27.000-07:00
diff --git a/src/datascience-ui/history-react/variableExplorer.tsx b/src/datascience-ui/history-react/variableExplorer.tsx
@@ -195,7 +195,7 @@ export class VariableExplorer extends React.Component<IVariableExplorerProps, IV
         this.props.variableExplorerToggled(!this.state.open);
     }
 
-    private sortRows = (sortColumn: string | number, sortDirection: string) => {
+    public sortRows = (sortColumn: string | number, sortDirection: string) => {
         this.setState({
             sortColumn,
             sortDirection,
@@ -204,20 +204,20 @@ export class VariableExplorer extends React.Component<IVariableExplorerProps, IV
     }
 
     private getColumnType(key: string | number) : string | undefined {
-        // Special case our "size" column. It's displayed as a string but
-        // we will compare it as a number
-        if (key === 'size') {
-            return 'number';
-        }
-
         let column;
         if (typeof key === 'string') {
             //tslint:disable-next-line:no-any
             column = this.state.gridColumns.find(c => c.key === key) as any;
         } else {
+            // This is the index lookup
             column = this.state.gridColumns[key];
         }
-        if (column && column.type) {
+
+        // Special case our size column, it's displayed as a string
+        // but we will sort it like a number
+        if (column && column.key === 'size') {
+            return 'number';
+        } else if (column && column.type) {
             return column.type;
         }
     }
@@ -256,27 +256,31 @@ export class VariableExplorer extends React.Component<IVariableExplorerProps, IV
         return gridRows.sort(comparer);
     }
 
+    // Get the numerical comparison value for a column
     private getComparisonValue(gridRow: IGridRow, sortColumn: string | number): number {
-        // We need a special case here for the size column
-        if (sortColumn === 'size') {
-            const sizeStr: string = gridRow.size as string;
-            if (!sizeStr || sizeStr.length === 0) {
-                return 0;
-            } else if (sizeStr[0] === '(') {
-                const commaIndex = sizeStr.indexOf(',');
-                if (commaIndex > 0) {
-                    return parseInt(sizeStr.substring(1, commaIndex), 10);
-                }
-            } else {
-                // In this case we expect a straight i to a conversion
-                return parseInt(sizeStr, 10);
-            }
+        return (sortColumn === 'size') ? this.sizeColumnComparisonValue(gridRow) : gridRow[sortColumn];
+    }
+
+    // The size column needs special casing
+    private sizeColumnComparisonValue(gridRow: IGridRow): number {
+        const sizeStr: string = gridRow.size as string;
+
+        if (!sizeStr) {
+            return -1;
+        }
+
+        let sizeNumber = -1;
+        const commaIndex = sizeStr.indexOf(',');
+        // First check the shape case like so (5000,1000) in this case we want the 5000 to compare with
+        if (sizeStr[0] === '(' && commaIndex > 0) {
+            sizeNumber = parseInt(sizeStr.substring(1, commaIndex), 10);
         } else {
-            // For none size column just assume a standard numeric column
-            return gridRow[sortColumn];
+            // If not in the shape format, assume a to i conversion
+            sizeNumber = parseInt(sizeStr, 10);
         }
 
-        return 0;
+        // If our parse fails we get NaN for any case that like return -1
+        return isNaN(sizeNumber) ? -1 : sizeNumber;
     }
 
     private rowDoubleClick = (_rowIndex: number, row: IGridRow) => {
diff --git a/src/test/datascience/variableexplorer.functional.test.tsx b/src/test/datascience/variableexplorer.functional.test.tsx
@@ -220,6 +220,8 @@ myTuple = 1,2,3,4,5,6,7,8,9
             {name: 'myDataframe', value: '                  0\n0           0.00000\n1           2.00004\n2           4.00008\n3           6.00012\n4           8.00016\n5          10.00020\n6          12.00024\n7          14.00028\n8          16.00032\n', supportsDataExplorer: true, type: 'DataFrame', size: 54, shape: '', count: 0, truncated: false},
             {name: 'myFloat', value: '9999.9999', supportsDataExplorer: false, type: 'float', size: 58, shape: '', count: 0, truncated: false},
             {name: 'myInt', value: '99999999', supportsDataExplorer: false, type: 'int', size: 56, shape: '', count: 0, truncated: false},
+            {name: 'mynpArray', value: `[0.00000000e+00 2.00004000e+00 4.00008000e+00 ... 9.99959999e+04
+ 9.99980000e+04 1.00000000e+05]`, supportsDataExplorer: true, type: 'ndarray', size: 54, shape: '', count: 0, truncated: false},
             {name: 'mySeries', value: `0             0.00000
 1             2.00004
 2             4.00008
@@ -230,9 +232,44 @@ myTuple = 1,2,3,4,5,6,7,8,9
 7            14.00028
 8            16.00032
 9 `, supportsDataExplorer: true, type: 'Series', size: 54, shape: '', count: 0, truncated: false},
-            {name: 'myTuple', value: '(1, 2, 3, 4, 5, 6, 7, 8, 9)', supportsDataExplorer: false, type: 'tuple', size: 54, shape: '', count: 0, truncated: false},
-            {name: 'mynpArray', value: `[0.00000000e+00 2.00004000e+00 4.00008000e+00 ... 9.99959999e+04
- 9.99980000e+04 1.00000000e+05]`, supportsDataExplorer: true, type: 'ndarray', size: 54, shape: '', count: 0, truncated: false}
+            {name: 'myTuple', value: '(1, 2, 3, 4, 5, 6, 7, 8, 9)', supportsDataExplorer: false, type: 'tuple', size: 54, shape: '', count: 0, truncated: false}
+        ];
+        verifyVariables(wrapper, targetVariables);
+    }, () => { return ioc; });
+
+    runMountedTest('Variable explorer - Sorting', async (wrapper) => {
+        const basicCode: string = `b = 2
+c = 3
+stra = 'a'
+strb = 'b'
+strc = 'c'`;
+
+        openVariableExplorer(wrapper);
+
+        await addCode(getOrCreateHistory, wrapper, 'a=1\na');
+        await addCode(getOrCreateHistory, wrapper, basicCode, 4);
+
+        await waitForUpdate(wrapper, VariableExplorer, 7);
+
+        let targetVariables: IJupyterVariable[] = [
+            {name: 'a', value: '1', supportsDataExplorer: false, type: 'int', size: 54, shape: '', count: 0, truncated: false},
+            {name: 'b', value: '2', supportsDataExplorer: false, type: 'int', size: 54, shape: '', count: 0, truncated: false},
+            {name: 'c', value: '3', supportsDataExplorer: false, type: 'int', size: 54, shape: '', count: 0, truncated: false},
+            {name: 'stra', value: 'a', supportsDataExplorer: false, type: 'str', size: 54, shape: '', count: 0, truncated: false},
+            {name: 'strb', value: 'b', supportsDataExplorer: false, type: 'str', size: 54, shape: '', count: 0, truncated: false},
+            {name: 'strc', value: 'c', supportsDataExplorer: false, type: 'str', size: 54, shape: '', count: 0, truncated: false},
+        ];
+        verifyVariables(wrapper, targetVariables);
+
+        sortVariableExplorer(wrapper, 'value', 'DESC');
+
+        targetVariables = [
+            {name: 'strc', value: 'c', supportsDataExplorer: false, type: 'str', size: 54, shape: '', count: 0, truncated: false},
+            {name: 'strb', value: 'b', supportsDataExplorer: false, type: 'str', size: 54, shape: '', count: 0, truncated: false},
+            {name: 'stra', value: 'a', supportsDataExplorer: false, type: 'str', size: 54, shape: '', count: 0, truncated: false},
+            {name: 'c', value: '3', supportsDataExplorer: false, type: 'int', size: 54, shape: '', count: 0, truncated: false},
+            {name: 'b', value: '2', supportsDataExplorer: false, type: 'int', size: 54, shape: '', count: 0, truncated: false},
+            {name: 'a', value: '1', supportsDataExplorer: false, type: 'int', size: 54, shape: '', count: 0, truncated: false},
         ];
         verifyVariables(wrapper, targetVariables);
     }, () => { return ioc; });
@@ -249,6 +286,16 @@ function openVariableExplorer(wrapper: ReactWrapper<any, Readonly<{}>, React.Com
     }
 }
 
+function sortVariableExplorer(wrapper: ReactWrapper<any, Readonly<{}>, React.Component>, sortColumn: string, sortDirection: string) {
+    const varExp: VariableExplorer = wrapper.find('VariableExplorer').instance() as VariableExplorer;
+
+    assert(varExp);
+
+    if (varExp) {
+        varExp.sortRows(sortColumn, sortDirection);
+    }
+}
+
 // Verify a set of rows versus a set of expected variables
 function verifyVariables(wrapper: ReactWrapper<any, Readonly<{}>, React.Component>, targetVariables: IJupyterVariable[]) {
     const foundRows = wrapper.find('div.react-grid-Row');
