Loki datasource: move loki-editor e2e test to playwright (#99192)

* test: rewrite cypress test in playwright

* Update e2e/plugin-e2e/plugin-e2e-api-tests/as-admin-user/lokiEditor.spec.ts

Co-authored-by: Matias Chomicki <matyax@gmail.com>

---------

Co-authored-by: Matias Chomicki <matyax@gmail.com>
This commit is contained in:
Galen Kistler 2025-01-21 07:39:33 -06:00 committed by GitHub
parent 5a45f59573
commit ee0129e8cf
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 87 additions and 89 deletions

View File

@ -0,0 +1,87 @@
import * as e2e from '@grafana/e2e-selectors';
import { expect, test } from '@grafana/plugin-e2e';
test.describe('Loki editor', () => {
test('Autocomplete features should work as expected.', async ({ page }) => {
// Go to loki datasource in explore
await page.goto(
'/explore?schemaVersion=1&panes=%7B%22iap%22:%7B%22datasource%22:%22gdev-loki%22,%22queries%22:%5B%7B%22refId%22:%22A%22,%22expr%22:%22%22,%22queryType%22:%22range%22,%22datasource%22:%7B%22type%22:%22loki%22,%22uid%22:%22gdev-loki%22%7D,%22editorMode%22:%22code%22%7D%5D,%22range%22:%7B%22from%22:%22now-1h%22,%22to%22:%22now%22%7D%7D%7D&orgId=1'
);
const queryEditor = page.getByTestId(e2e.selectors.components.QueryField.container);
const queryEditorRows = page.getByTestId('query-editor-rows');
async function assertQueryEditorEmpty() {
const queryEditorEmptyText = /^Enter to Rename.+/;
await expect(queryEditor).toHaveText(queryEditorEmptyText);
}
async function clearInput() {
// Clear focused input
// Monaco appears to need some time to init keybindings after a change, adding this timeout to prevent flake
await page.waitForTimeout(100);
await page.keyboard.press('ControlOrMeta+A');
await page.keyboard.press('Backspace');
}
// assert that the query builder is shown by default
await expect(page.getByText('Label filters')).toHaveCount(1);
// switch to code editor
await page.getByLabel('Code').click();
await page.waitForFunction(() => window.monaco);
await expect(queryEditor).toHaveCount(1);
await assertQueryEditorEmpty();
// assert editor automatically adds close paren
await queryEditor.click();
await page.keyboard.type('time(');
await expect(queryEditor).toContainText('time()');
// removes closing brace when opening brace is removed
await clearInput();
await assertQueryEditorEmpty();
await page.keyboard.type('avg_over_time(');
await expect(queryEditor).toContainText('avg_over_time()');
await page.keyboard.press('Backspace');
await expect(queryEditor).not.toContainText('avg_over_time()');
await expect(queryEditor).toContainText('avg_over_time');
// keeps closing brace when opening brace is removed and inner values exist
await clearInput();
await assertQueryEditorEmpty();
await page.keyboard.type('time(test');
await page.keyboard.press('ArrowLeft');
await page.keyboard.press('ArrowLeft');
await page.keyboard.press('ArrowLeft');
await page.keyboard.press('ArrowLeft');
await page.keyboard.press('Backspace');
await expect(queryEditor).toContainText('timetest');
// overrides an automatically inserted paren
await clearInput();
await assertQueryEditorEmpty();
await page.keyboard.type('time()');
await expect(queryEditor).toContainText('time()');
// does not override manually inserted braces
await clearInput();
await assertQueryEditorEmpty();
await page.keyboard.type('))');
await expect(queryEditor).toContainText('))');
// Should execute the query when enter with shift is pressed
await clearInput();
await assertQueryEditorEmpty();
await page.keyboard.press('Shift+Enter');
await expect(page.getByTestId('explore-no-data')).toHaveCount(1);
// Suggestions plugin
await clearInput();
await assertQueryEditorEmpty();
await page.keyboard.type('av');
await expect(queryEditorRows.getByLabel(/avg, docs:/)).toHaveCount(1);
await expect(queryEditorRows.getByLabel(/avg_over_time, docs:/)).toHaveCount(1);
});
});

View File

@ -1,89 +0,0 @@
import { e2e } from '../utils';
import { waitForMonacoToLoad } from '../utils/support/monaco';
const dataSourceName = 'LokiEditor';
const addDataSource = () => {
e2e.flows.addDataSource({
type: 'Loki',
expectedAlertMessage: 'Unable to connect with Loki. Please check the server logs for more details.',
name: dataSourceName,
form: () => {
cy.get('#connection-url').type('http://loki-url:3100');
},
});
};
describe('Loki Query Editor', () => {
beforeEach(() => {
e2e.flows.login(Cypress.env('USERNAME'), Cypress.env('PASSWORD'));
});
afterEach(() => {
e2e.flows.revertAllChanges();
});
it('Autocomplete features should work as expected.', function () {
this.skip(); // Test disabled due to being flaky
addDataSource();
cy.intercept(/labels?/, (req) => {
req.reply({ status: 'success', data: ['instance', 'job', 'source'] });
});
cy.intercept(/series?/, (req) => {
req.reply({ status: 'success', data: [{ instance: 'instance1' }] });
});
// Go to Explore and choose Loki data source
e2e.pages.Explore.visit();
e2e.components.DataSourcePicker.container().should('be.visible').click();
cy.contains(dataSourceName).scrollIntoView().should('be.visible').click();
e2e.components.RadioButton.container().filter(':contains("Code")').click();
waitForMonacoToLoad();
// adds closing braces around empty value
e2e.components.QueryField.container().type('time(');
cy.get('.monaco-editor textarea:first').should(($el) => {
expect($el.val()).to.eq('time()');
});
// removes closing brace when opening brace is removed
e2e.components.QueryField.container().type('{selectall}{backspace}avg_over_time({backspace}');
cy.get('.monaco-editor textarea:first').should(($el) => {
expect($el.val()).to.eq('avg_over_time');
});
// keeps closing brace when opening brace is removed and inner values exist
e2e.components.QueryField.container().type(
'{selectall}{backspace}time(test{leftArrow}{leftArrow}{leftArrow}{leftArrow}{backspace}'
);
cy.get('.monaco-editor textarea:first').should(($el) => {
expect($el.val()).to.eq('timetest)');
});
// overrides an automatically inserted brace
e2e.components.QueryField.container().type('{selectall}{backspace}time()');
cy.get('.monaco-editor textarea:first').should(($el) => {
expect($el.val()).to.eq('time()');
});
// does not override manually inserted braces
e2e.components.QueryField.container().type('{selectall}{backspace}))');
cy.get('.monaco-editor textarea:first').should(($el) => {
expect($el.val()).to.eq('))');
});
/** Runner plugin */
// Should execute the query when enter with shift is pressed
e2e.components.QueryField.container().type('{selectall}{backspace}{shift+enter}');
cy.get('[data-testid="explore-no-data"]').should('be.visible');
/** Suggestions plugin */
e2e.components.QueryField.container().type('{selectall}av');
cy.contains('avg').should('be.visible');
cy.contains('avg_over_time').should('be.visible');
});
});