Set up basic ci workflow for query insights dashboards (#6)

* set up basic ci workflow Signed-off-by: Chenyang Ji <[email protected]> * Add targets, config and pipeline for tests and lint Signed-off-by: Chenyang Ji <[email protected]> --------- Signed-off-by: Chenyang Ji <[email protected]>
LilyCaroline17 · Jul 30, 2024 · ea632fc · ea632fc
1 parent b66bf2a
commit ea632fc
Show file tree

Hide file tree

Showing 9 changed files with 353 additions and 4 deletions.
diff --git a/.github/workflows/build-and-test.yml b/.github/workflows/build-and-test.yml
@@ -0,0 +1,62 @@
+name: Build and test workflow
+on:
+  push:
+    branches:
+      - "*"
+  pull_request:
+    branches:
+      - "*"
+env:
+  OPENSEARCH_DASHBOARDS_VERSION: 'main'
+
+jobs:
+  Get-CI-Image-Tag:
+    uses: opensearch-project/opensearch-build/.github/workflows/get-ci-image-tag.yml@main
+    with:
+      product: opensearch-dashboards
+
+  build-and-test:
+    name: Build query-insights-dashboards plugin and run unit tests
+    strategy:
+      matrix:
+        os: [ ubuntu-latest, macos-latest, windows-latest ]
+    runs-on: ${{ matrix.os }}
+    steps:
+      # Enable longer filenames for windows
+      - name: Enable longer filenames
+        if: ${{ matrix.os == 'windows-latest' }}
+        run: git config --system core.longpaths true
+      - name: Checkout OpenSearch-Dashboards
+        uses: actions/checkout@v2
+        with:
+          repository: opensearch-project/OpenSearch-Dashboards
+          ref: ${{ env.OPENSEARCH_DASHBOARDS_VERSION }}
+          path: OpenSearch-Dashboards
+      - name: Setup Node
+        uses: actions/setup-node@v3
+        with:
+          node-version-file: './OpenSearch-Dashboards/.nvmrc'
+          registry-url: 'https://registry.npmjs.org'
+      - name: Install Yarn
+        # Need to use bash to avoid having a windows/linux specific step
+        shell: bash
+        run: |
+          YARN_VERSION=$(node -p "require('./OpenSearch-Dashboards/package.json').engines.yarn")
+          echo "Installing yarn@$YARN_VERSION"
+          npm i -g yarn@$YARN_VERSION
+      - run: node -v
+      - run: yarn -v
+      - name: Checkout Query Insights OpenSearch Dashboards plugin
+        uses: actions/checkout@v2
+        with:
+          path: OpenSearch-Dashboards/plugins/query-insights-dashboards
+      - name: Bootstrap plugin/OpenSearch-Dashboards
+        run: |
+          cd OpenSearch-Dashboards/plugins/query-insights-dashboards
+          yarn osd bootstrap
+      - name: Run unit tests
+        run: |
+          cd OpenSearch-Dashboards/plugins/query-insights-dashboards
+          yarn run test:jest --coverage
+      - name: Uploads coverage
+        uses: codecov/codecov-action@v1
diff --git a/.github/workflows/lint-workflow.yml b/.github/workflows/lint-workflow.yml
@@ -0,0 +1,47 @@
+name: Lint workflow
+on:
+  push:
+    branches:
+      - '*'
+  pull_request:
+    branches:
+      - '*'
+env:
+  OPENSEARCH_DASHBOARDS_VERSION: 'main'
+jobs:
+  tests:
+    name: Run lint
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout OpenSearch Dashboards
+        uses: actions/checkout@v2
+        with:
+          repository: opensearch-project/OpenSearch-Dashboards
+          ref: ${{ env.OPENSEARCH_DASHBOARDS_VERSION }}
+          path: OpenSearch-Dashboards
+      - name: Setup Node
+        uses: actions/setup-node@v3
+        with:
+          node-version-file: './OpenSearch-Dashboards/.nvmrc'
+          registry-url: 'https://registry.npmjs.org'
+      - name: Install Yarn
+        # Need to use bash to avoid having a windows/linux specific step
+        shell: bash
+        run: |
+          YARN_VERSION=$(node -p "require('./OpenSearch-Dashboards/package.json').engines.yarn")
+          echo "Installing yarn@$YARN_VERSION"
+          npm i -g yarn@$YARN_VERSION
+      - run: node -v
+      - run: yarn -v
+      - name: Checkout Query Insights Dashboards plugin
+        uses: actions/checkout@v2
+        with:
+          path: OpenSearch-Dashboards/plugins/query-insights-dashboards
+      - name: Bootstrap plugin/opensearch-dashboards
+        run: |
+          cd OpenSearch-Dashboards/plugins/query-insights-dashboards
+          yarn osd bootstrap
+      - name: Run lint
+        run: |
+          cd OpenSearch-Dashboards/plugins/query-insights-dashboards
+          yarn run lint
diff --git a/babel.config.js b/babel.config.js
@@ -0,0 +1,19 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+// babelrc doesn't respect NODE_PATH anymore but using require does.
+// Alternative to install them locally in node_modules
+module.exports = {
+  presets: [
+    require('@babel/preset-env'),
+    require('@babel/preset-react'),
+    require('@babel/preset-typescript'),
+  ],
+  plugins: [
+    [require('@babel/plugin-transform-runtime'), { regenerator: true }],
+    require('@babel/plugin-transform-class-properties'),
+    require('@babel/plugin-transform-object-rest-spread'),
+  ],
+};
diff --git a/package.json b/package.json
@@ -1,10 +1,55 @@
 {
-  "name": "queryInsightsDashboards",
-  "version": "0.0.0",
-  "private": true,
+  "name": "opensearch_query_insights_dashboards",
+  "version": "3.0.0.0",
+  "description": "OpenSearch Dashboards plugin for Query Insights",
+  "main": "index.js",
+  "license": "Apache-2.0",
+  "homepage": "https://github.com/opensearch-project/query-insights-dashboards",
+  "config": {
+    "id": "queryInsightsDashboards",
+    "zip_name": "query-insights-dashboards"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/opensearch-project/query-insights-dashboards"
+  },
   "scripts": {
     "build": "yarn plugin-helpers build",
     "plugin-helpers": "../../scripts/use_node ../../scripts/plugin_helpers",
-    "osd": "../../scripts/use_node ../../scripts/osd"
+    "osd": "../../scripts/use_node ../../scripts/osd",
+    "test:jest": "../../node_modules/.bin/jest --config ./test/jest.config.js",
+    "test:jest:dev": "../../node_modules/.bin/jest --watch --config ./test/jest.config.js",
+    "test:jest:update-snapshots": "yarn run test:jest -u",
+    "lint": "node ../../scripts/eslint ."
+  },
+  "resolutions": {
+    "@types/react": "^16.9.8",
+    "**/@types/jest": "^29.3.1",
+    "**/@types/react-dom": "^16.9.8",
+    "eslint-utils": "^1.4.2",
+    "async": "^3.2.3",
+    "json5": "^2.2.3",
+    "@babel/core": "^7.20.12",
+    "@babel/traverse": "^7.20.12",
+    "@cypress/request": "^3.0.0"
+  },
+  "devDependencies": {
+    "@elastic/elastic-eslint-config-kibana": "link:../../packages/opensearch-eslint-config-opensearch-dashboards",
+    "@elastic/eslint-import-resolver-kibana": "link:../../packages/osd-eslint-import-resolver-opensearch-dashboards",
+    "@testing-library/dom": "^8.11.3",
+    "@testing-library/user-event": "^14.4.3",
+    "@types/react-dom": "^16.9.8",
+    "@types/react-router-dom": "^5.3.2",
+    "cypress": "9.5.4",
+    "cypress-real-events": "1.7.6",
+    "cypress-recurse": "^1.27.0",
+    "eslint-plugin-no-unsanitized": "^3.0.2",
+    "eslint-plugin-prefer-object-spread": "^1.2.1",
+    "husky": "^8.0.0",
+    "jest-cli": "^27.5.1",
+    "jest-environment-jsdom": "^27.5.1",
+    "lint-staged": "^10.2.0",
+    "ts-loader": "^6.2.1",
+    "string.prototype.replaceall": "1.0.7"
   }
 }
diff --git a/public/components/__snapshots__/app.test.tsx.snap b/public/components/__snapshots__/app.test.tsx.snap
@@ -0,0 +1,69 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<QueryInsightsDashboardsApp /> spec renders the component 1`] = `
+<div>
+  <div
+    class="euiPage euiPage--paddingMedium euiPage--grow euiPage--restrictWidth-custom"
+    style="max-width: 1000px;"
+  >
+    <main
+      class="euiPageBody euiPageBody--borderRadiusNone"
+    >
+      <header
+        class="euiPageHeader euiPageHeader--responsive euiPageHeader--center"
+      >
+        <h1
+          class="euiTitle euiTitle--large"
+        >
+          query-insights-dashboards
+        </h1>
+      </header>
+      <div
+        class="euiPanel euiPanel--paddingLarge euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow euiPageContent"
+        role="main"
+      >
+        <div
+          class="euiPageContentHeader euiPageContentHeader--responsive"
+        >
+          <h2
+            class="euiTitle euiTitle--medium"
+          >
+            Congratulations, you have successfully created a new OpenSearch Dashboards Plugin!
+          </h2>
+        </div>
+        <div
+          class="euiPageContentBody"
+        >
+          <div
+            class="euiText euiText--medium"
+          >
+            <p>
+              Look through the generated code and check out the plugin development documentation.
+            </p>
+            <hr
+              class="euiHorizontalRule euiHorizontalRule--full euiHorizontalRule--marginLarge"
+            />
+            <p>
+              Last timestamp: Unknown
+            </p>
+            <button
+              class="euiButton euiButton--primary euiButton--small"
+              type="primary"
+            >
+              <span
+                class="euiButtonContent euiButton__content"
+              >
+                <span
+                  class="euiButton__text"
+                >
+                  Get data
+                </span>
+              </span>
+            </button>
+          </div>
+        </div>
+      </div>
+    </main>
+  </div>
+</div>
+`;
diff --git a/public/components/app.test.tsx b/public/components/app.test.tsx
@@ -0,0 +1,33 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ * @jest-environment jsdom
+ */
+
+import React from 'react';
+import { render } from '@testing-library/react';
+import { QueryInsightsDashboardsApp } from './app';
+
+describe('<QueryInsightsDashboardsApp /> spec', () => {
+  it('renders the component', () => {
+    const mockHttpStart = {
+      basePath: {
+        serverBasePath: '/app/opensearch-dashboards',
+      },
+    };
+
+    const { container } = render(
+      <QueryInsightsDashboardsApp
+        basename="/"
+        http={mockHttpStart as any}
+        navigation={
+          {
+            ui: { TopNavMenu: () => null },
+          } as any
+        }
+        notifications={{} as any}
+      />
+    );
+    expect(container).toMatchSnapshot();
+  });
+});
diff --git a/test/jest.config.js b/test/jest.config.js
@@ -0,0 +1,49 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+module.exports = {
+  rootDir: '../',
+  setupFiles: ['<rootDir>/test/setupTests.ts'],
+  setupFilesAfterEnv: ['<rootDir>/test/setup.jest.ts'],
+  roots: ['<rootDir>'],
+  coverageDirectory: './coverage',
+  moduleNameMapper: {
+    '\\.(css|less|scss)$': '<rootDir>/test/mocks/styleMock.ts',
+    '^ui/(.*)': '<rootDir>/../../src/legacy/ui/public/$1/',
+  },
+  coverageReporters: ['lcov', 'text', 'cobertura'],
+  testMatch: ['**/*.test.js', '**/*.test.jsx', '**/*.test.ts', '**/*.test.tsx'],
+  collectCoverageFrom: [
+    '**/*.ts',
+    '**/*.tsx',
+    '**/*.js',
+    '**/*.jsx',
+    '!**/models/**',
+    '!**/node_modules/**',
+    '!**/index.ts',
+    '!<rootDir>/index.js',
+    '!<rootDir>/public/app.js',
+    '!<rootDir>/public/temporary/**',
+    '!<rootDir>/babel.config.js',
+    '!<rootDir>/test/**',
+    '!<rootDir>/server/**',
+    '!<rootDir>/coverage/**',
+    '!<rootDir>/scripts/**',
+    '!<rootDir>/build/**',
+    '!<rootDir>/cypress/**',
+    '!**/vendor/**',
+  ],
+  clearMocks: true,
+  testPathIgnorePatterns: ['<rootDir>/build/', '<rootDir>/node_modules/'],
+  transformIgnorePatterns: [
+    // ignore all node_modules except those which require babel transforms to
+    // handle newer syntax like `??=` which is not already transformed by the
+    // package and not yet supported in the node version we use.
+    '[/\\\\]node_modules(?![\\/\\\\](vega-lite))[/\\\\].+\\.js$',
+  ],
+  modulePathIgnorePatterns: ['queryInsightsDashboards'],
+  testEnvironment: 'jsdom',
+  snapshotSerializers: ['enzyme-to-json/serializer'],
+};
diff --git a/test/setup.jest.ts b/test/setup.jest.ts
@@ -0,0 +1,19 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+// @ts-ignore
+window.Worker = function () {
+  this.postMessage = () => {};
+  // @ts-ignore
+  this.terminate = () => {};
+};
+
+// @ts-ignore
+window.URL = {
+  createObjectURL: () => {
+    return '';
+  },
+};
+
+jest.setTimeout(10000); // in milliseconds
diff --git a/test/setupTests.ts b/test/setupTests.ts
@@ -0,0 +1,6 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+require('babel-polyfill');