Migrate entire plugin to new platform

.cypress/support/commands.ts

@@ -50,11 +50,9 @@ Cypress.Commands.add('mockGetDetectorOnAction', function (
   funcMockedOn: VoidFunction
 ) {
   cy.server();
-  cy.route(
-    'GET',
-    buildAdApiUrl(DETECTORS + '*'),
-    `fixture:${fixtureFileName}`
-  ).as('getDetectors');
+  cy.route2(buildAdApiUrl(DETECTORS + '*'), `fixture:${fixtureFileName}`).as(
+    'getDetectors'
+  );
 
   funcMockedOn();
 
@@ -66,11 +64,9 @@ Cypress.Commands.add('mockCreateDetectorOnAction', function (
   funcMockedOn: VoidFunction
 ) {
   cy.server();
-  cy.route(
-    'POST',
-    buildAdApiUrl(DETECTORS + '*'),
-    `fixture:${fixtureFileName}`
-  ).as('createDetector');
+  cy.route2(buildAdApiUrl(DETECTORS + '*'), `fixture:${fixtureFileName}`).as(
+    'createDetector'
+  );
 
   funcMockedOn();
 
@@ -82,11 +78,9 @@ Cypress.Commands.add('mockSearchIndexOnAction', function (
   funcMockedOn: VoidFunction
 ) {
   cy.server();
-  cy.route(
-    'GET',
-    buildAdApiUrl(INDICES_PATH + '*'),
-    `fixture:${fixtureFileName}`
-  ).as('getIndices');
+  cy.route2(buildAdApiUrl(INDICES_PATH + '*'), `fixture:${fixtureFileName}`).as(
+    'getIndices'
+  );
 
   funcMockedOn();
 
@@ -98,7 +92,7 @@ Cypress.Commands.add('mockSearchOnAction', function (
   funcMockedOn: VoidFunction
 ) {
   cy.server();
-  cy.route('POST', buildAdApiUrl(SEARCH_PATH), `fixture:${fixtureFileName}`).as(
+  cy.route2(buildAdApiUrl(SEARCH_PATH), `fixture:${fixtureFileName}`).as(
     'searchES'
   );
 
@@ -112,8 +106,7 @@ Cypress.Commands.add('mockGetIndexMappingsOnAction', function (
   funcMockedOn: VoidFunction
 ) {
   cy.server();
-  cy.route(
-    'GET',
+  cy.route2(
     buildAdApiUrl(MAPPINGS_PATH + '*'),
     `fixture:${fixtureFileName}`
   ).as('getMappings');
@@ -129,8 +122,7 @@ Cypress.Commands.add('mockStartDetectorOnAction', function (
   funcMockedOn: VoidFunction
 ) {
   cy.server();
-  cy.route(
-    'POST',
+  cy.route2(
     buildAdApiUrl([DETECTORS, detectorId, START_PATH].join(SLASH)),
     `fixture:${fixtureFileName}`
   ).as('startDetector');
@@ -146,8 +138,7 @@ Cypress.Commands.add('mockStopDetectorOnAction', function (
   funcMockedOn: VoidFunction
 ) {
   cy.server();
-  cy.route(
-    'POST',
+  cy.route2(
     buildAdApiUrl([DETECTORS, detectorId, STOP_PATH].join(SLASH)),
     `fixture:${fixtureFileName}`
   ).as('stopDetector');
@@ -163,8 +154,7 @@ Cypress.Commands.add('mockDeleteDetectorOnAction', function (
   funcMockedOn: VoidFunction
 ) {
   cy.server();
-  cy.route(
-    'DELETE',
+  cy.route2(
     buildAdApiUrl([DETECTORS, detectorId].join(SLASH)),
     `fixture:${fixtureFileName}`
   ).as('deleteDetector');

.cypress/utils/helpers.ts

@@ -26,7 +26,9 @@ export const buildAdApiUrl = (apiPath: string): string => {
 };
 
 export const buildServerApiUrl = (appPath: string, apiPath: string): string => {
-  return [API_URL_PREFIX, appPath, apiPath].join(SLASH);
+  return [Cypress.config('baseUrl'), API_URL_PREFIX, appPath, apiPath].join(
+    SLASH
+  );
 };
 
 export const buildAdAppUrl = (pagePath: string): string => {

.github/workflows/e2e-tests-workflow.yml

@@ -88,7 +88,7 @@ jobs:
           sleep 180
 
       - name: Run e2e tests
-        uses: cypress-io/github-action@v1
+        uses: cypress-io/github-action@v2.5.0
         with:
           working-directory: kibana/plugins/anomaly-detection-kibana-plugin
           command: yarn cy:run --env SECURITY_ENABLED=true
@@ -149,7 +149,7 @@ jobs:
           cd kibana/plugins/anomaly-detection-kibana-plugin
           yarn kbn bootstrap
       - name: Run e2e tests
-        uses: cypress-io/github-action@v1
+        uses: cypress-io/github-action@v2.5.0
         with:
           working-directory: kibana/plugins/anomaly-detection-kibana-plugin
           command: yarn test:e2e

.gitignore

@@ -16,3 +16,4 @@ offline-module-cache/v2/*
 offline-module-cache/v1/*
 .cypress/screenshots
 .cypress/videos
+target

cypress.json

@@ -10,6 +10,7 @@
   "requestTimeout": 90000,
   "responseTimeout": 90000,
   "defaultCommandTimeout": 90000,
+  "experimentalNetworkStubbing": true,
   "env": {
     "SECURITY_ENABLED": false
   }

kibana.json

@@ -0,0 +1,10 @@
+{
+  "id": "opendistroAnomalyDetectionKibana",
+  "version": "1.11.0.0",
+  "kibanaVersion": "7.9.1",
+  "configPath": ["opendistro_anomaly_detection_kibana"],
+  "requiredPlugins": ["navigation"],
+  "optionalPlugins": [],
+  "server": true,
+  "ui": true
+}

package.json

@@ -17,11 +17,10 @@
     "test:jest": "../../node_modules/.bin/jest --config ./test/jest.config.js",
     "build": "plugin-helpers build",
     "release": "./tasks/release.sh",
-    "start-cy-server": "yarn start --no-base-path --oss",
     "cy:open": "cypress open",
     "cy:run": "cypress run",
     "cy:run-with-security": "cypress run --env SECURITY_ENABLED=true",
-    "test:e2e": "CHOKIDAR_USEPOLLING=1 CYPRESS_responseTimeout=180000 WAIT_ON_TIMEOUT=900000 start-server-and-test 'yarn start-cy-server' http-get://localhost:5601/app/opendistro-anomaly-detection-kibana 'echo sleeping to wait for server to get ready && sleep 180 && yarn cy:run'"
+    "test:e2e": "CHOKIDAR_USEPOLLING=1 CYPRESS_responseTimeout=180000 WAIT_ON_TIMEOUT=900000 start-server-and-test 'cd ../../ && yarn start --no-base-path --oss && cd plugins/anomaly-detection-kibana-plugin' http-get://localhost:5601/app/opendistro-anomaly-detection-kibana 'echo sleeping to wait for server to get ready && sleep 180 && yarn cy:run'"
   },
   "lint-staged": {
     "*.{ts,tsx,js,jsx,json,css,md}": [
@@ -42,7 +41,6 @@
     "@testing-library/jest-dom": "^4.0.0",
     "@testing-library/react": "^8.0.6",
     "@testing-library/user-event": "^4.2.3",
-    "@types/angular": "^1.6.55",
     "@types/chance": "^1.0.6",
     "@types/elasticsearch": "^5.0.34",
     "@types/hapi": "^18.0.2",
@@ -60,7 +58,7 @@
     "babel-jest": "^24.8.0",
     "babel-polyfill": "^6.26.0",
     "chance": "^1.1.0",
-    "cypress": "^4.11.0",
+    "cypress": "^5.6.0",
     "eslint": "^5.6.0",
     "eslint-plugin-babel": "^5.2.0",
     "eslint-plugin-import": "^2.14.0",
@@ -85,7 +83,6 @@
     "formik": "^1.5.8",
     "lodash": "^4.17.19",
     "plotly.js": "^1.55.2",
-    "query-string": "^6.8.2",
     "react-plotly.js": "^2.4.0",
     "react-redux": "^7.1.0",
     "react-vis": "^1.11.7",

public/anomaly_detection_app.tsx

@@ -0,0 +1,51 @@
+/*
+ * Copyright 2020 Amazon.com, Inc. or its affiliates. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License").
+ * You may not use this file except in compliance with the License.
+ * A copy of the License is located at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * or in the "license" file accompanying this file. This file is distributed
+ * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either
+ * express or implied. See the License for the specific language governing
+ * permissions and limitations under the License.
+ */
+
+import { CoreStart, AppMountParameters } from '../../../src/core/public';
+import React from 'react';
+import ReactDOM from 'react-dom';
+import { HashRouter as Router, Route } from 'react-router-dom';
+import { Main } from './pages/main';
+import { Provider } from 'react-redux';
+import configureStore from './redux/configureStore';
+import { CoreServicesContext } from './components/CoreServices/CoreServices';
+
+export function renderApp(coreStart: CoreStart, params: AppMountParameters) {
+  const http = coreStart.http;
+  const store = configureStore(http);
+
+  // Load Chart's dark mode CSS (if applicable)
+  const isDarkMode = coreStart.uiSettings.get('theme:darkMode') || false;
+  if (isDarkMode) {
+    require('@elastic/charts/dist/theme_only_dark.css');
+  } else {
+    require('@elastic/charts/dist/theme_only_light.css');
+  }
+  ReactDOM.render(
+    <Provider store={store}>
+      <Router>
+        <Route
+          render={(props) => (
+            <CoreServicesContext.Provider value={coreStart}>
+              <Main {...props} />
+            </CoreServicesContext.Provider>
+          )}
+        />
+      </Router>
+    </Provider>,
+    params.element
+  );
+  return () => ReactDOM.unmountComponentAtNode(params.element);
+}