Add tests for the filter tree

This adds jest + enzyme + testing-library to test various components
the of filter tree: the entry-tree itself and the table-tree.

Signed-off-by: Geneviève Bastien <gbastien+lttng@versatic.net>

.vscode/launch.json

@@ -94,6 +94,23 @@
             "smartStep": true,
             "internalConsoleOptions": "openOnSessionStart",
             "outputCapture": "std"
+        },
+        {
+            "type": "node",
+            "request": "launch",
+            "name": "Jest Current File",
+            "program": "${workspaceFolder}/node_modules/.bin/jest",
+            "args": [
+              "${fileBasenameNoExtension}",
+              "--config",
+              "viewer-prototype/jest.config.json"
+            ],
+            "console": "integratedTerminal",
+            "internalConsoleOptions": "neverOpen",
+            "disableOptimisticBPs": true,
+            "windows": {
+              "program": "${workspaceFolder}/node_modules/jest/bin/jest",
+            }
         }
     ]
 }

package.json

@@ -12,7 +12,7 @@
     "start-all:browser": "yarn start:server & yarn start:browser",
     "start-all:electron": "yarn start:server & yarn start:electron",
     "lint": "yarn workspace trace-viewer run lint",
-    "test": "echo test"
+    "test": "yarn workspace trace-viewer run test"
   },
   "devDependencies": {
     "lerna": "2.4.0"

viewer-prototype/.eslintrc.js

@@ -25,7 +25,9 @@ module.exports = {
         'node_modules',
         'lib',
         '.eslintrc.js',
-        'plugins'
+        'plugins',
+        '**/*/__tests__',
+        'jestSetup.ts'
     ],
     parserOptions: {
         tsconfigRootDir: __dirname,

viewer-prototype/jest.config.json

@@ -0,0 +1,23 @@
+{
+    "globals": {
+        "ts-jest": {
+            "tsconfig": "tsconfig.json"
+        }
+    },
+    "transform": {
+        "^.+\\.tsx?$": "ts-jest"
+    },
+    "testEnvironment": "jsdom",
+    "testRegex": "(/__tests__/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$",
+    "moduleFileExtensions": [
+        "ts",
+        "tsx",
+        "js",
+        "jsx",
+        "json",
+        "node"
+    ],
+    "setupFilesAfterEnv": [
+        "./jestSetup.ts"
+    ]
+}

viewer-prototype/jestSetup.ts

@@ -0,0 +1,4 @@
+import Enzyme from 'enzyme';
+import Adapter from 'enzyme-adapter-react-16';
+
+Enzyme.configure({ adapter: new Adapter() });

viewer-prototype/package.json

@@ -36,26 +36,37 @@
     "tsp-typescript-client": "next"
   },
   "devDependencies": {
+    "@testing-library/react": "^10.4.6",
     "@types/chart.js": "^2.7.52",
+    "@types/enzyme": "^3.10.5",
+    "@types/enzyme-adapter-react-16": "^1.0.6",
+    "@types/jest": "^26.0.4",
     "@types/lodash": "^4.14.142",
     "@types/react-grid-layout": "^0.16.7",
     "@types/react-modal": "^3.8.2",
+    "@types/react-test-renderer": "^16.9.2",
     "@types/react-virtualized": "^9.21.1",
     "@typescript-eslint/eslint-plugin": "^3.4.0",
     "@typescript-eslint/parser": "^3.4.0",
+    "enzyme": "^3.11.0",
+    "enzyme-adapter-react-16": "^1.15.2",
     "eslint": "^7.3.0",
     "eslint-plugin-import": "^2.21.2",
     "eslint-plugin-no-null": "^1.0.2",
     "eslint-plugin-react": "^7.20.0",
+    "jest": "^26.1.0",
+    "react-test-renderer": "^16.13.1",
     "rimraf": "latest",
+    "ts-jest": "^26.3.0",
     "typescript": "latest"
   },
   "scripts": {
-    "prepare": "yarn run clean && yarn run build",
-    "clean": "rimraf lib",
     "build": "tsc",
-    "watch": "tsc -w",
-    "lint": "eslint ."
+    "clean": "rimraf lib",
+    "lint": "eslint .",
+    "prepare": "yarn run clean && yarn run build",
+    "test": "jest  --config jest.config.json",
+    "watch": "tsc -w"
   },
   "theiaExtensions": [
     {

viewer-prototype/src/browser/trace-explorer/trace-explorer-widget.tsx

@@ -5,7 +5,7 @@ import { List, ListRowProps } from 'react-virtualized';
 import { OutputDescriptor } from 'tsp-typescript-client/lib/models/output-descriptor';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { faShareSquare, faCopy } from '@fortawesome/free-solid-svg-icons';
-import * as ReactModal from 'react-modal';
+import ReactModal from 'react-modal';
 import { Emitter } from '@theia/core';
 import { SignalManager } from '../../common/signal-manager';
 import { EditorManager, EditorOpenerOptions } from '@theia/editor/lib/browser';