Loki Monaco Editor: add component tests (#56658)

* feat(loki-monaco-editor): add component tests

* feat(loki-monaco-editor): rename test case

* Chore: add missing export

public/app/plugins/datasource/loki/components/monaco-query-field/MonacoFieldWrapper.test.tsx

@@ -0,0 +1,36 @@
+import { render, screen } from '@testing-library/react';
+import React from 'react';
+
+import LokiLanguageProvider from '../../LanguageProvider';
+import { createLokiDatasource } from '../../mocks';
+
+import { MonacoQueryFieldWrapper, Props } from './MonacoQueryFieldWrapper';
+
+function renderComponent({
+  initialValue = '',
+  onChange = jest.fn(),
+  onRunQuery = jest.fn(),
+  runQueryOnBlur = false,
+}: Partial<Props> = {}) {
+  const datasource = createLokiDatasource();
+  const languageProvider = new LokiLanguageProvider(datasource);
+
+  render(
+    <MonacoQueryFieldWrapper
+      languageProvider={languageProvider}
+      history={[]}
+      initialValue={initialValue}
+      onChange={onChange}
+      onRunQuery={onRunQuery}
+      runQueryOnBlur={runQueryOnBlur}
+    />
+  );
+}
+
+describe('MonacoFieldWrapper', () => {
+  test('Renders with no errors', async () => {
+    renderComponent();
+
+    expect(await screen.findByText('Loading...')).toBeInTheDocument();
+  });
+});

public/app/plugins/datasource/loki/components/monaco-query-field/MonacoQueryField.test.tsx

@@ -0,0 +1,31 @@
+import { render, screen } from '@testing-library/react';
+import React from 'react';
+
+import LokiLanguageProvider from '../../LanguageProvider';
+import { createLokiDatasource } from '../../mocks';
+
+import MonacoQueryField from './MonacoQueryField';
+import { Props } from './MonacoQueryFieldProps';
+
+function renderComponent({ initialValue = '', onRunQuery = jest.fn(), onBlur = jest.fn() }: Partial<Props> = {}) {
+  const datasource = createLokiDatasource();
+  const languageProvider = new LokiLanguageProvider(datasource);
+
+  render(
+    <MonacoQueryField
+      languageProvider={languageProvider}
+      initialValue={initialValue}
+      history={[]}
+      onRunQuery={onRunQuery}
+      onBlur={onBlur}
+    />
+  );
+}
+
+describe('MonacoQueryField', () => {
+  test('Renders with no errors', async () => {
+    renderComponent();
+
+    expect(await screen.findByText('Loading...')).toBeInTheDocument();
+  });
+});

public/app/plugins/datasource/loki/components/monaco-query-field/MonacoQueryFieldWrapper.tsx

@@ -3,7 +3,7 @@ import React, { useRef } from 'react';
 import { MonacoQueryFieldLazy } from './MonacoQueryFieldLazy';
 import { Props as MonacoProps } from './MonacoQueryFieldProps';
 
-type Props = Omit<MonacoProps, 'onRunQuery' | 'onBlur'> & {
+export type Props = Omit<MonacoProps, 'onRunQuery' | 'onBlur'> & {
   onChange: (query: string) => void;
   onRunQuery: () => void;
   runQueryOnBlur: boolean;