mirror of https://github.com/grafana/grafana
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>pull/98908/head
parent
5a45f59573
commit
ee0129e8cf
@ -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); |
||||
}); |
||||
}); |
||||
@ -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'); |
||||
}); |
||||
}); |
||||
Loading…
Reference in new issue