Annotation query: Render query result in alert box (#83230)

* add alert to annotation result * cleanup * add tests * more refactoring * apply pr feedback * change severity * use toHaveAlert matcher
2024-03-18 14:26:56 +01:00
parent 5b085976bf
commit ebcca97052
5 changed files with 187 additions and 65 deletions
@@ -1,15 +1,53 @@
 import { expect, test } from '@grafana/plugin-e2e';
+import { AlertVariant } from '@grafana/ui';

-import { formatExpectError } from '../errors';
-import { successfulAnnotationQuery } from '../mocks/queries';
+import {
+  successfulAnnotationQueryWithData,
+  failedAnnotationQueryWithMultipleErrors,
+  successfulAnnotationQueryWithoutData,
+  failedAnnotationQuery,
+} from '../mocks/queries';

-test('annotation query data with mocked response', async ({ annotationEditPage, page }) => {
-  annotationEditPage.mockQueryDataResponse(successfulAnnotationQuery);
-  await annotationEditPage.datasource.set('gdev-testdata');
-  await page.getByLabel('Scenario').last().fill('CSV Content');
-  await page.keyboard.press('Tab');
-  await expect(
-    annotationEditPage.runQuery(),
-    formatExpectError('Expected annotation query to execute successfully')
-  ).toBeOK();
-});
+interface Scenario {
+  name: string;
+  mock: object;
+  text: string;
+  severity: AlertVariant;
+  status: number;
+}
+
+const scenarios: Scenario[] = [
+  { name: 'error', severity: 'error', mock: failedAnnotationQuery, text: 'Google API Error 400', status: 400 },
+  {
+    name: 'multiple errors',
+    severity: 'error',
+    mock: failedAnnotationQueryWithMultipleErrors,
+    text: 'Google API Error 400Google API Error 401',
+    status: 400,
+  },
+  {
+    name: 'data',
+    severity: 'success',
+    mock: successfulAnnotationQueryWithData,
+    text: '2 events (from 2 fields)',
+    status: 200,
+  },
+  {
+    name: 'empty result',
+    severity: 'warning',
+    mock: successfulAnnotationQueryWithoutData,
+    text: 'No events found',
+    status: 200,
+  },
+];
+
+for (const scenario of scenarios) {
+  test(`annotation query data with ${scenario.name}`, async ({ annotationEditPage, page }) => {
+    annotationEditPage.mockQueryDataResponse(scenario.mock, scenario.status);
+    await annotationEditPage.datasource.set('gdev-testdata');
+    await page.getByLabel('Scenario').last().fill('CSV Content');
+    await page.keyboard.press('Tab');
+    await annotationEditPage.runQuery();
+    await expect(annotationEditPage).toHaveAlert(scenario.severity, { hasText: scenario.text });
+  });
+}