add test for config editor

e2e/configurationEditor.spec.ts

@@ -0,0 +1,28 @@
+import { test, expect } from '@grafana/plugin-e2e';
+import { BitmovinDataSourceOptions } from '../src/types/grafanaTypes';
+
+test('"Save & test" should be successful when configuration is valid', async ({
+  createDataSourceConfigPage,
+  readProvisionedDataSource,
+  page,
+  selectors,
+}) => {
+  await page.route('*/**/analytics/licenses', async (route) => {
+    await route.fulfill({ status: 200, body: 'OK' });
+  });
+  const ds = await readProvisionedDataSource<BitmovinDataSourceOptions>({ fileName: 'datasources.yml' });
+  const configPage = await createDataSourceConfigPage({ type: ds.type });
+
+  await page.locator(`#config-editor-${configPage.datasource.name}_api-key-input`).fill('test-api-key');
+  await page.locator(`#config-editor-${configPage.datasource.name}_tenant-org-id-input`).fill('test-tenant-org-id');
+
+  const queryPromise = page.waitForRequest('*/**/analytics/licenses');
+  await configPage.getByGrafanaSelector(selectors.pages.DataSource.saveAndTest).click();
+  const queryRequest = await queryPromise;
+
+  expect(queryRequest.headers()['x-api-client']).toBe('analytics-grafana-datasource');
+  expect(queryRequest.headers()['x-api-key']).toBe('test-api-key');
+  expect(queryRequest.headers()['x-tenant-org-id']).toBe('test-tenant-org-id');
+
+  expect(configPage).toHaveAlert('success');
+});

src/components/ConfigEditor.tsx

@@ -59,6 +59,7 @@ export function ConfigEditor(props: Props) {
             value={jsonData.apiKey || ''}
             placeholder="Analytics API Key"
             width={40}
+            id={`config-editor-${props.options.name}_api-key-input`}
           />
         </InlineField>
         <InlineField label="Tenant Org Id" labelWidth={26}>
@@ -67,6 +68,7 @@ export function ConfigEditor(props: Props) {
             value={jsonData.tenantOrgId || ''}
             placeholder="Tenant Org Id"
             width={40}
+            id={`config-editor-${props.options.name}_tenant-org-id-input`}
           />
         </InlineField>
         <InlineField label="Ad Analytics" tooltip={'Check if you want to query ads data'} labelWidth={26}>