prometheus: enable new monaco-based query field (#41357)

* prometheus: enable new monaco-based query field

* updated test

* updated tests

* fix e2e tests

* updated comment

public/app/plugins/datasource/prometheus/components/PromQueryField.test.tsx

@@ -7,6 +7,16 @@ import { DataSourceInstanceSettings, PanelData, LoadingState, DataFrame } from '
 import { PromOptions } from '../types';
 import { render, screen } from '@testing-library/react';
 
+// the monaco-based editor uses lazy-loading and that does not work
+// well with this test, and we do not need the monaco-related
+// functionality in this test anyway, so we mock it out.
+jest.mock('./monaco-query-field/MonacoQueryFieldWrapper', () => {
+  const fakeQueryField = () => <div>prometheus query field</div>;
+  return {
+    MonacoQueryFieldWrapper: fakeQueryField,
+  };
+});
+
 describe('PromQueryField', () => {
   beforeAll(() => {
     // @ts-ignore