Add e2e smoke tests (#526)

.github/dependabot.yml

@@ -20,6 +20,13 @@ updates:
     directory: '/'
     schedule:
       interval: 'weekly'
+    ignore:
+      - dependency-name: '@reduxjs/toolkit'
+        update-types: ['version-update:semver-major']
+      - dependency-name: 'react'
+        update-types: ['version-update:semver-major']
+      - dependency-name: 'react-dom'
+        update-types: ['version-update:semver-major']
     groups:
       all-node-dependencies:
         patterns:

.github/workflows/e2e-tests.yml

@@ -0,0 +1,78 @@
+name: E2E tests
+on:
+  pull_request:
+  schedule:
+    - cron: '0 11 * * *' #once a day at 11 UTC
+
+permissions:
+  contents: read
+  id-token: write
+
+jobs:
+  resolve-versions:
+    name: Resolve Grafana images
+    runs-on: ubuntu-latest
+    timeout-minutes: 3
+    outputs:
+      matrix: ${{ steps.resolve-versions.outputs.matrix }}
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+      - name: Resolve Grafana E2E versions
+        id: resolve-versions
+        uses: grafana/plugin-actions/e2e-version@main
+        with:
+          version-resolver-type: version-support-policy
+
+  playwright-tests:
+    needs: resolve-versions
+    timeout-minutes: 60
+    strategy:
+      fail-fast: false
+      matrix:
+        GRAFANA_IMAGE: ${{fromJson(needs.resolve-versions.outputs.matrix)}}
+    name: e2e ${{ matrix.GRAFANA_IMAGE.name }}@${{ matrix.GRAFANA_IMAGE.VERSION }}
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Setup Node.js environment
+        uses: actions/setup-node@v4
+        with:
+          node-version-file: .nvmrc
+
+      - name: Install yarn dependencies
+        run: yarn install
+
+      - name: Install Mage
+        uses: magefile/mage-action@v3
+        with:
+          install-only: true
+
+      - name: Build binaries
+        run: mage -v build:linux
+
+      - name: Build frontend
+        run: yarn build
+
+      - name: Install Playwright Browsers
+        run: yarn playwright install --with-deps
+
+      - name: Start Grafana
+        run: |
+          docker compose pull
+          GRAFANA_VERSION=${{ matrix.GRAFANA_IMAGE.VERSION }} GRAFANA_IMAGE=${{ matrix.GRAFANA_IMAGE.NAME }} docker compose up -d --wait --wait-timeout 60
+
+      - name: Run Playwright tests
+        id: run-tests
+        run: yarn playwright test
+
+      # Uncomment this step to upload the Playwright report to Github artifacts.
+      # If your repository is public, the report will be public on the Internet so beware not to expose sensitive information.
+      # - name: Upload artifacts
+      #   uses: actions/upload-artifact@v4
+      #   if: ${{ (always() && steps.run-tests.outcome == 'success') || (failure() && steps.run-tests.outcome == 'failure') }}
+      #   with:
+      #     name: playwright-report-${{ matrix.GRAFANA_IMAGE.NAME }}-v${{ matrix.GRAFANA_IMAGE.VERSION }}-${{github.run_id}}
+      #     path: playwright-report/
+      #     retention-days: 30

.gitignore

@@ -32,4 +32,11 @@ e2e-results/
 
 .DS_Store
 __debug_bin*
-.eslintcache
+.eslintcache
+
+# End to end tests
+/test-results/
+/playwright-report/
+/blob-report/
+/playwright/.cache/
+/playwright/.auth/

CONTRIBUTING.md

@@ -4,7 +4,7 @@
 
 ### Run docker env
 
-`$ docker-compose up` starts a single node OpenSearch cluster & OpenSearch Dashboards
+`yarn server` starts a single node OpenSearch cluster & OpenSearch Dashboards
 
 If cluster not starting with error `max virtual memory areas vm.max_map_count [65530] is too low...`, increase mmap limits by running as root:
 
@@ -42,7 +42,13 @@ Open Search provides [sample apps](https://opensearch.org/docs/latest/observing-
 In order to view generated traces in Grafana, add a new datasource, enter https://localhost:9200 as the url. Set “Skip TLS Verify” to true. The auth details are admin:admin.
 After following the steps for querying traces from ../README.md, traces from the sample app should be displayed in the panel.
 
-### Build a release
+## E2E tests
+
+1. `yarn playwright install --with-deps`
+1. `yarn server`
+1. `yarn e2e`
+
+## Build a release
 
 You need to have commit rights to the GitHub repository to publish a release.
 

cspell.config.json

@@ -47,6 +47,7 @@
     "gocyclo",
     "grafana",
     "GROUPBY",
+    "healthcheck",
     "hostnames",
     "httpclient",
     "idelta",
@@ -57,6 +58,7 @@
     "loglevel",
     "lucene",
     "lvta0909",
+    "magefile",
     "memlock",
     "middlewares",
     "millis",
@@ -70,6 +72,7 @@
     "nofile",
     "nolint",
     "ntime",
+    "nvmrc",
     "Onechild",
     "opendistro",
     "opensearch",

docker-compose.yaml

@@ -9,6 +9,10 @@ services:
       args:
         grafana_image: ${GRAFANA_IMAGE:-grafana-enterprise}
         grafana_version: ${GRAFANA_VERSION:-10.0.3}
+    healthcheck:
+      test: curl -f http://localhost:3000 || exit 1
+      start_period: 30s
+      start_interval: 500ms
     ports:
       - 3000:3000/tcp
     volumes:

package.json

@@ -5,6 +5,7 @@
   "scripts": {
     "build": "webpack -c ./.config/webpack/webpack.config.ts --env production",
     "dev": "webpack -w -c ./.config/webpack/webpack.config.ts --env development",
+    "e2e": "playwright test",
     "generate-release-notes": "PREV_TAG=$(git tag | tail -n 1) && gh api --method POST /repos/grafana/opensearch-datasource/releases/generate-notes -f tag_name=v${npm_package_version} -f target_commitish=main -f previous_tag_name=${PREV_TAG} | jq -r .body",
     "lint": "eslint --cache .",
     "lint:fix": "yarn run lint --fix",
@@ -40,8 +41,10 @@
     "@eslint/eslintrc": "^3.1.0",
     "@eslint/js": "^9.14.0",
     "@grafana/eslint-config": "^8.0.0",
+    "@grafana/plugin-e2e": "^1.13.1",
     "@grafana/tsconfig": "^2.0.0",
-    "@reduxjs/toolkit": "^2.3.0",
+    "@playwright/test": "^1.49.1",
+    "@reduxjs/toolkit": "^1.9.7",
     "@stylistic/eslint-plugin-ts": "^2.10.1",
     "@swc/core": "^1.9.1",
     "@swc/helpers": "^0.5.13",

playwright.config.ts

@@ -0,0 +1,57 @@
+import { dirname } from 'path';
+import { defineConfig, devices } from '@playwright/test';
+import type { PluginOptions } from '@grafana/plugin-e2e';
+
+const pluginE2eAuth = `${dirname(require.resolve('@grafana/plugin-e2e'))}/auth`;
+
+/**
+ * Read environment variables from file.
+ * https://github.com/motdotla/dotenv
+ */
+// import dotenv from 'dotenv';
+// import path from 'path';
+// dotenv.config({ path: path.resolve(__dirname, '.env') });
+
+/**
+ * See https://playwright.dev/docs/test-configuration.
+ */
+export default defineConfig<PluginOptions>({
+  testDir: './tests',
+  /* Run tests in files in parallel */
+  fullyParallel: true,
+  /* Fail the build on CI if you accidentally left test.only in the source code. */
+  forbidOnly: !!process.env.CI,
+  /* Retry on CI only */
+  retries: process.env.CI ? 2 : 0,
+  /* Opt out of parallel tests on CI. */
+  workers: process.env.CI ? 1 : undefined,
+  /* Reporter to use. See https://playwright.dev/docs/test-reporters */
+  reporter: 'html',
+  /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
+  use: {
+    /* Base URL to use in actions like `await page.goto('/')`. */
+    baseURL: 'http://localhost:3000',
+
+    /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
+    trace: 'on-first-retry',
+  },
+
+  /* Configure projects for major browsers */
+  projects: [
+    {
+      name: 'auth',
+      testDir: pluginE2eAuth,
+      testMatch: [/.*\.js/],
+    },
+    {
+      name: 'run-tests',
+      use: {
+        ...devices['Desktop Chrome'],
+        // @grafana/plugin-e2e writes the auth state to this file,
+        // the path should not be modified
+        storageState: 'playwright/.auth/admin.json',
+      },
+      dependencies: ['auth'],
+    },
+  ],
+});

provisioning/datasources/aws-opensearch.yaml

@@ -0,0 +1,25 @@
+apiVersion: 1
+
+deleteDatasources:
+  - name: AWS OpenSearch
+    orgId: 1
+
+datasources:
+  - name: AWS OpenSearch
+    type: grafana-opensearch-datasource
+    access: proxy
+    url: http://localhost:9200/
+    basicAuth: true
+    basicAuthUser: 'admin'
+    jsonData:
+      flavor: 'opensearch'
+      maxConcurrentShardRequests: 5
+      pplEnabled: true
+      serverless: false
+      timeField: '@timestamp'
+      tlsAuth: false
+      tlsSkipVerify: true
+      version: '2.18.0'
+      versionLabel: 'OpenSearch 2.18.0'
+    secureJsonData:
+      basicAuthPassword: 'my_%New%_passW0rd!@#' # password is set in docker-compose.yaml with the `OPENSEARCH_INITIAL_ADMIN_PASSWORD` env var

tests/annotationsEditor.spec.ts

@@ -0,0 +1,6 @@
+import { expect, test } from '@grafana/plugin-e2e';
+
+test('should render annotations editor', async ({ annotationEditPage, page, selectors }) => {
+  await annotationEditPage.datasource.set('AWS OpenSearch');
+  await expect(page.getByTestId(selectors.components.QueryField.container)).toBeVisible();
+});

tests/configEditor.spec.ts

@@ -0,0 +1,7 @@
+import { test, expect } from '@grafana/plugin-e2e';
+
+test('should render config editor', async ({ createDataSourceConfigPage, readProvisionedDataSource, page }) => {
+  const ds = await readProvisionedDataSource({ fileName: 'aws-opensearch.yaml', name: 'AWS OpenSearch' });
+  await createDataSourceConfigPage({ type: ds.type });
+  await expect(page.getByText('OpenSearch details')).toBeVisible();
+});

tests/queryEditor.spec.ts

@@ -0,0 +1,8 @@
+import { test, expect } from '@grafana/plugin-e2e';
+
+test('should render query editor', async ({ panelEditPage, selectors }) => {
+  await panelEditPage.datasource.set('AWS OpenSearch');
+  await expect(
+    panelEditPage.getQueryEditorRow('A').getByTestId(selectors.components.QueryField.container)
+  ).toBeVisible();
+});