Fixes #13571 : Introduce webapp tests to mattermost-plugin-starte… (#78)

* added test setup

* added missing deps

* support for new babel config

* update enzyme types to restrict to 3.10.4 itself

Co-Authored-By: Michael Kochell <mjkochell@gmail.com>

* pkg name change

* fixed to absolute versioning for all dependencies

Co-authored-by: Michael Kochell <mjkochell@gmail.com>

webapp/.babelrc

@@ -1,4 +0,0 @@
-{
-    presets: ['@babel/preset-env', '@babel/preset-react', '@babel/typescript']
-}
-

webapp/babel.config.js

@@ -0,0 +1,44 @@
+// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
+// See LICENSE.txt for license information.
+
+const config = {
+    presets: [
+        ['@babel/preset-env', {
+            targets: {
+                chrome: 66,
+                firefox: 60,
+                edge: 42,
+                safari: 12,
+            },
+            modules: false,
+            corejs: 3,
+            debug: false,
+            useBuiltIns: 'usage',
+            shippedProposals: true,
+        }],
+        ['@babel/preset-react', {
+            useBuiltIns: true,
+        }],
+        ['@babel/typescript', {
+            allExtensions: true,
+            isTSX: true,
+        }],
+    ],
+    plugins: [
+        '@babel/plugin-proposal-class-properties',
+        '@babel/plugin-syntax-dynamic-import',
+        '@babel/proposal-object-rest-spread',
+        'babel-plugin-typescript-to-proptypes',
+    ],
+};
+
+// Jest needs module transformation
+config.env = {
+    test: {
+        presets: config.presets,
+        plugins: config.plugins,
+    },
+};
+config.env.test.presets[0][1].modules = 'auto';
+
+module.exports = config;

webapp/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "webapp",
+  "name": "plugin-starter",
   "version": "0.0.1",
   "description": "This plugin serves as a starting point for writing a Mattermost plugin.",
   "main": "src/index.js",
@@ -8,7 +8,8 @@
     "debug": "webpack --mode=none",
     "lint": "eslint --ignore-pattern node_modules --ignore-pattern dist --ext .js --ext .jsx --ext tsx --ext ts . --quiet",
     "fix": "eslint --ignore-pattern node_modules --ignore-pattern dist --ext .js --ext .jsx --ext tsx --ext ts . --quiet --fix",
-    "test": "jest --forceExit --detectOpenHandles --verbose"
+    "test": "jest --forceExit --detectOpenHandles --verbose",
+    "test-ci": "jest --forceExit --detectOpenHandles --maxWorkers=2"
   },
   "author": "",
   "license": "",
@@ -23,32 +24,86 @@
     "@babel/preset-react": "7.0.0",
     "@babel/preset-typescript": "7.3.3",
     "@babel/runtime": "7.4.5",
+    "@types/enzyme": "3.10.4",
+    "@types/jest": "24.0.25",
+    "@types/node": "12.12.24",
+    "@types/react": "16.9.17",
+    "@types/react-dom": "16.9.4",
     "@types/react-intl": "2.3.18",
+    "@types/react-router-dom": "4.3.4",
+    "@types/react-transition-group": "4.2.2",
     "@typescript-eslint/eslint-plugin": "1.13.0",
+    "@typescript-eslint/parser": "1.13.0",
     "babel-eslint": "10.0.2",
+    "babel-jest": "24.9.0",
     "babel-loader": "8.0.6",
     "babel-plugin-typescript-to-proptypes": "0.17.1",
+    "enzyme": "3.11.0",
+    "enzyme-adapter-react-16": "1.15.2",
+    "enzyme-to-json": "3.4.3",
     "eslint": "6.0.1",
     "eslint-import-resolver-webpack": "0.11.1",
     "eslint-plugin-import": "2.18.0",
     "eslint-plugin-react": "7.14.2",
     "file-loader": "4.0.0",
-    "jest": "^24.8.0",
+    "identity-obj-proxy": "3.0.0",
+    "jest": "24.9.0",
+    "jest-canvas-mock": "2.2.0",
+    "jest-junit": "10.0.0",
+    "mattermost-webapp": "github:mattermost/mattermost-webapp#23f5f93d9f12a7e2b5623e5cee6814366abd9a0f",
     "webpack": "4.35.0",
     "webpack-cli": "3.3.5"
   },
   "dependencies": {
-    "@types/enzyme": "3.10.3",
-    "@types/jest": "24.0.17",
-    "@types/node": "12.7.0",
-    "@types/react": "16.8.24",
-    "@types/react-dom": "16.8.5",
-    "@types/react-router-dom": "4.3.4",
-    "@types/react-transition-group": "4.2.2",
-    "@typescript-eslint/parser": "1.13.0",
+    "core-js": "3.6.2",
     "react": "16.8.6",
     "react-redux": "5.0.7",
     "redux": "4.0.1",
     "typescript": "3.5.3"
+  },
+  "jest": {
+    "snapshotSerializers": [
+      "<rootDir>/node_modules/enzyme-to-json/serializer"
+    ],
+    "testPathIgnorePatterns": [
+      "/node_modules/",
+      "/non_npm_dependencies/"
+    ],
+    "clearMocks": true,
+    "collectCoverageFrom": [
+      "src/**/*.{js,jsx}"
+    ],
+    "coverageReporters": [
+      "lcov",
+      "text-summary"
+    ],
+    "moduleNameMapper": {
+      "^.+\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "identity-obj-proxy",
+      "^.+\\.(css|less|scss)$": "identity-obj-proxy",
+      "^.*i18n.*\\.(json)$": "<rootDir>/tests/i18n_mock.json",
+      "^bundle-loader\\?lazy\\!(.*)$": "$1"
+    },
+    "moduleDirectories": [
+      "",
+      "node_modules",
+      "non_npm_dependencies"
+    ],
+    "reporters": [
+      "default",
+      "jest-junit"
+    ],
+    "transformIgnorePatterns": [
+      "node_modules/(?!react-native|react-router|mattermost-webapp)"
+    ],
+    "setupFiles": [
+      "jest-canvas-mock"
+    ],
+    "setupFilesAfterEnv": [
+      "<rootDir>/tests/setup.js"
+    ],
+    "testURL": "http://localhost:8065"
+  },
+  "jest-junit": {
+    "output": "build/test-results.xml"
   }
 }

webapp/tests/i18n_mock.json

@@ -0,0 +1 @@
+{}

webapp/tests/setup.js

@@ -0,0 +1,4 @@
+// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
+// See LICENSE.txt for license information.
+
+import 'mattermost-webapp/tests/setup';