Update e2e tests

.config/bundler/externals.ts

@@ -0,0 +1,50 @@
+/*
+ * ⚠️⚠️⚠️ THIS FILE WAS SCAFFOLDED BY `@grafana/create-plugin`. DO NOT EDIT THIS FILE DIRECTLY. ⚠️⚠️⚠️
+ *
+ */
+
+import type { Configuration, ExternalItemFunctionData } from 'webpack';
+
+type ExternalsType = Configuration['externals'];
+
+export const externals: ExternalsType = [
+  // Required for dynamic publicPath resolution
+  { 'amd-module': 'module' },
+  'lodash',
+  'jquery',
+  'moment',
+  'slate',
+  'emotion',
+  '@emotion/react',
+  '@emotion/css',
+  'prismjs',
+  'slate-plain-serializer',
+  '@grafana/slate-react',
+  'react',
+  'react/jsx-runtime',
+  'react/jsx-dev-runtime',
+  'react-dom',
+  'react-redux',
+  'redux',
+  'rxjs',
+  'i18next',
+  'react-router',
+  'd3',
+  'angular',
+  /^@grafana\/ui/i,
+  /^@grafana\/runtime/i,
+  /^@grafana\/data/i,
+
+  // Mark legacy SDK imports as external if their name starts with the "grafana/" prefix
+  ({ request }: ExternalItemFunctionData, callback: (error?: Error, result?: string) => void) => {
+    const prefix = 'grafana/';
+    const hasPrefix = (request: string) => request.indexOf(prefix) === 0;
+    const stripPrefix = (request: string) => request.slice(prefix.length);
+
+    if (request && hasPrefix(request)) {
+      return callback(undefined, stripPrefix(request));
+    }
+
+    callback();
+  },
+];

.config/webpack/webpack.config.ts

@@ -16,6 +16,8 @@ import { Configuration } from 'webpack';
 import { getPackageJson, getPluginJson, hasReadme, getEntries, isWSL } from './utils';
 import { SOURCE_DIR, DIST_DIR } from './constants';
 
+import { externals } from '../bundler/externals.ts';
+
 const pluginJson = getPluginJson();
 
 const config = async (env): Promise<Configuration> => {
@@ -33,43 +35,7 @@ const config = async (env): Promise<Configuration> => {
 
     entry: await getEntries(),
 
-    externals: [
-      'lodash',
-      'jquery',
-      'moment',
-      'slate',
-      'emotion',
-      '@emotion/react',
-      '@emotion/css',
-      'prismjs',
-      'slate-plain-serializer',
-      '@grafana/slate-react',
-      'react',
-      'react-dom',
-      'react-redux',
-      'redux',
-      'rxjs',
-      'react-router',
-      'react-router-dom',
-      'd3',
-      'angular',
-      '@grafana/ui',
-      '@grafana/runtime',
-      '@grafana/data',
-
-      // Mark legacy SDK imports as external if their name starts with the "grafana/" prefix
-      ({ request }, callback) => {
-        const prefix = 'grafana/';
-        const hasPrefix = (request) => request.indexOf(prefix) === 0;
-        const stripPrefix = (request) => request.substr(prefix.length);
-
-        if (hasPrefix(request)) {
-          return callback(undefined, stripPrefix(request));
-        }
-
-        callback();
-      },
-    ],
+    externals,
 
     mode: env.production ? 'production' : 'development',
 

.github/workflows/ci.yml

@@ -14,6 +14,8 @@ on:
 jobs:
   build:
     runs-on: ubuntu-latest
+    outputs:
+      e2e-matrix: ${{ steps.resolve-versions.outputs.matrix }}
     steps:
       - uses: actions/checkout@v6
       - name: Setup Node.js environment
@@ -22,6 +24,12 @@ jobs:
           node-version: '22'
           cache: 'npm'
 
+      - name: Cache node_modules for future jobs
+        uses: actions/cache@v4
+        with:
+          path: node_modules
+          key: node-modules-${{ hashFiles('package-lock.json') }}
+
       - name: Install dependencies
         run: npm ci
 
@@ -34,15 +42,6 @@ jobs:
       - name: Build frontend
         run: npm run build
 
-      - name: Start grafana docker
-        run: docker compose up -d
-
-      - name: Run e2e tests
-        run: npm run e2e
-
-      - name: Stop grafana docker
-        run: docker compose down
-
       - name: Check for backend
         id: check-for-backend
         run: |
@@ -70,3 +69,69 @@ jobs:
         with:
           version: latest
           args: buildAll
+
+      - name: Upload build artifact
+        uses: actions/upload-artifact@v4
+        with:
+          name: dist
+          path: dist/
+
+      - name: Resolve Grafana E2E versions
+        id: resolve-versions
+        uses: grafana/plugin-actions/e2e-version@e2e-version/v1.2.1
+        with:
+          skip-grafana-react-19-preview-image: false
+
+  e2e:
+    runs-on: ubuntu-latest
+    timeout-minutes: 15
+    needs: build
+    strategy:
+      fail-fast: false
+      matrix:
+        GRAFANA_IMAGE: ${{ fromJson(needs.build.outputs.e2e-matrix) }}
+        QUICKWIT_VERSION: [edge]
+    steps:
+      - uses: actions/checkout@v6
+
+      - name: Download build artifact
+        uses: actions/download-artifact@v4
+        with:
+          name: dist
+          path: dist/
+
+      - name: Restore executable permissions
+        run: chmod +x dist/gpx_quickwit_*
+
+      - name: Setup Node.js environment
+        uses: actions/setup-node@v6
+        with:
+          node-version: '22'
+
+      - name: Restore node_modules
+        uses: actions/cache/restore@v4
+        with:
+          path: node_modules
+          key: node-modules-${{ hashFiles('package-lock.json') }}
+
+      - name: Install Playwright
+        run: npx playwright install --with-deps chromium
+
+      - name: Start Grafana (${{ matrix.GRAFANA_IMAGE.name }}:${{ matrix.GRAFANA_IMAGE.version }}) + Quickwit (${{ matrix.QUICKWIT_VERSION }})
+        run: docker compose up -d --build
+        env:
+          GRAFANA_VERSION: ${{ matrix.GRAFANA_IMAGE.version }}
+          GRAFANA_IMAGE: ${{ matrix.GRAFANA_IMAGE.name }}
+          QUICKWIT_VERSION: ${{ matrix.QUICKWIT_VERSION }}
+
+      - name: Wait for Grafana and Quickwit to start
+        run: |
+          timeout 60 bash -c 'until curl -sf http://localhost:3000/api/health; do sleep 2; done' || { docker compose logs grafana; exit 1; }
+          timeout 60 bash -c 'until curl -sf http://localhost:7280/health/readyz; do sleep 2; done' || { docker compose logs quickwit; exit 1; }
+
+      - name: Run e2e tests
+        run: npm run e2e
+
+      - name: Stop Grafana
+        if: always()
+        run: docker compose down

.gitignore

@@ -31,8 +31,9 @@ artifacts/
 work/
 ci/
 e2e-results/
-**/cypress/videos
-**/cypress/report.json 
+playwright-report/
+test-results/
+playwright/.auth/
 
 # Editor
 .idea

docker-compose.yaml

@@ -2,7 +2,7 @@ version: '3.0'
 
 services:
   quickwit:
-    image: quickwit/quickwit:edge
+    image: quickwit/quickwit:${QUICKWIT_VERSION:-edge}
     environment:
       - OTEL_EXPORTER_OTLP_TRACES_ENDPOINT=http://localhost:7281
       - QW_ENABLE_OPENTELEMETRY_OTLP_EXPORTER=true
@@ -16,7 +16,8 @@ services:
     build:
       context: ./.config
       args:
-        grafana_version: 12.1.0
+        grafana_version: ${GRAFANA_VERSION:-12.4.0}
+        grafana_image: ${GRAFANA_IMAGE:-grafana-oss}
     ports:
       - 3000:3000/tcp
     volumes: