SQL: Add timeFilter macro to query builder (#74575)

* Add timeFilter macro to query builder

* Only render SQLWhereRow when fields are there

* Change the default query to timeseries and remove 50 limit

* Add timeFilter macro for the first time when timeSeries

* Add test for timeFilter macro

* Lint fix

* Annotation query format should be table

* Set order by as default

* Revert changes that made time series default

* Fix e2e test

* Fix e2e test

* Make sure to reset the date value when operator is changed

* Add docs
This commit is contained in:
Zoltán Bedi
2023-11-09 09:23:26 +01:00
committed by GitHub
parent 375dcc3813
commit 22035565d2
9 changed files with 150 additions and 46 deletions

View File

@@ -9,10 +9,6 @@ const normalTableName = tablesResponse.results.tables.frames[0].data.values[0][0
describe('MySQL datasource', () => {
beforeEach(() => {
e2e.flows.login(Cypress.env('USERNAME'), Cypress.env('PASSWORD'));
});
it('code editor autocomplete should handle table name escaping/quoting', () => {
cy.intercept('POST', '/api/ds/query', (req) => {
if (req.body.queries[0].refId === 'datasets') {
req.alias = 'datasets';
@@ -31,11 +27,14 @@ describe('MySQL datasource', () => {
});
}
});
e2e.flows.login(Cypress.env('USERNAME'), Cypress.env('PASSWORD'));
e2e.pages.Explore.visit();
e2e.components.DataSourcePicker.container().should('be.visible').type('gdev-mysql{enter}');
cy.wait('@datasets');
});
it('code editor autocomplete should handle table name escaping/quoting', () => {
cy.get("label[for^='option-code']").should('be.visible').click();
cy.get('textarea').type('S{downArrow}{enter}');
cy.wait('@tables');
@@ -60,4 +59,61 @@ describe('MySQL datasource', () => {
cy.get('textarea').type('.');
cy.get('.suggest-widget').contains('No suggestions.').should('be.visible');
});
describe('visual query builder', () => {
it('should be able to add timeFilter macro', () => {
cy.get("[aria-label='Table selector']").should('be.visible').click();
selectOption(normalTableName);
// Open column selector
cy.get("[id^='select-column-0']").should('be.visible').click();
selectOption('createdAt');
// Toggle where row
cy.get("label[for^='sql-filter']").last().should('be.visible').click();
// Click add filter button
cy.get('button[title="Add filter"]').should('be.visible').click();
cy.get('button[title="Add filter"]').should('be.visible').click(); // For some reason we need to click twice
// Open field selector
cy.get("[aria-label='Field']").should('be.visible').click();
selectOption('createdAt');
// Open operator selector
cy.get("[aria-label='Operator']").should('be.visible').click();
selectOption('Macros');
// Open macros value selector
cy.get("[aria-label='Macros value selector']").should('be.visible').click();
selectOption('timeFilter');
// Validate that the timeFilter macro was added
e2e.components.CodeEditor.container()
.get('textarea')
.should(
'have.value',
`SELECT\n createdAt\nFROM\n DataMaker.normalTable\nWHERE\n $__timeFilter(createdAt)\nLIMIT\n 50`
);
// Validate that the timeFilter macro was removed when changed to equals operator
// For some reason the input is not visible the second time so we need to force the click
cy.get("[aria-label='Operator']").click({ force: true });
selectOption('==');
e2e.components.DateTimePicker.input().should('be.visible').click().blur();
e2e.components.CodeEditor.container()
.get('textarea')
.should(
'not.have.value',
`SELECT\n createdAt\nFROM\n DataMaker.normalTable\nWHERE\n $__timeFilter(createdAt)\nLIMIT\n 50`
);
});
});
});
function selectOption(option: string) {
cy.get("[aria-label='Select option']").contains(option).should('be.visible').click();
}