From 32de0f3ef03a959633028ff2da48bf03011974a4 Mon Sep 17 00:00:00 2001 From: Anton Standrik Date: Fri, 2 Aug 2024 18:19:27 +0300 Subject: [PATCH 1/2] fix(QueryHistory): query history not saving --- .../Tenant/Query/QueryEditor/QueryEditor.tsx | 6 +- .../QueryEditorControls.tsx | 16 ++- .../suites/tenant/queryEditor/QueryEditor.ts | 4 + .../tenant/queryHistory/queryHistory.test.ts | 99 +++++++++++++++++++ 4 files changed, 118 insertions(+), 7 deletions(-) create mode 100644 tests/suites/tenant/queryHistory/queryHistory.test.ts diff --git a/src/containers/Tenant/Query/QueryEditor/QueryEditor.tsx b/src/containers/Tenant/Query/QueryEditor/QueryEditor.tsx index f9f2955b9..cce539394 100644 --- a/src/containers/Tenant/Query/QueryEditor/QueryEditor.tsx +++ b/src/containers/Tenant/Query/QueryEditor/QueryEditor.tsx @@ -150,7 +150,7 @@ function QueryEditor(props: QueryEditorProps) { const schema = useMultiSchema ? 'multi' : 'modern'; - const query = text && typeof text === 'string' ? text : input; + const query = text ?? input; setLastUsedQueryAction(QUERY_ACTIONS.execute); if (!isEqual(lastQueryExecutionSettings, querySettings)) { @@ -312,10 +312,10 @@ function QueryEditor(props: QueryEditorProps) { const renderControls = () => { return ( { }; interface QueryEditorControlsProps { - onRunButtonClick: () => void; + handleSendExecuteClick: () => void; onSettingsButtonClick: () => void; runIsLoading: boolean; - onExplainButtonClick: () => void; + handleGetExplainQueryClick: () => void; explainIsLoading: boolean; disabled: boolean; highlightedAction: QueryAction; } export const QueryEditorControls = ({ - onRunButtonClick, + handleSendExecuteClick, onSettingsButtonClick, runIsLoading, - onExplainButtonClick, + handleGetExplainQueryClick, explainIsLoading, disabled, highlightedAction, @@ -76,6 +76,14 @@ export const QueryEditorControls = ({ const explainView: ButtonView | undefined = highlightedAction === 'explain' ? 'action' : undefined; + const onRunButtonClick = () => { + handleSendExecuteClick(); + }; + + const onExplainButtonClick = () => { + handleGetExplainQueryClick(); + }; + return (
diff --git a/tests/suites/tenant/queryEditor/QueryEditor.ts b/tests/suites/tenant/queryEditor/QueryEditor.ts index 318fde7a9..4a93cf822 100644 --- a/tests/suites/tenant/queryEditor/QueryEditor.ts +++ b/tests/suites/tenant/queryEditor/QueryEditor.ts @@ -169,6 +169,10 @@ export class QueryEditor { } } + async focusEditor() { + await this.editorTextArea.focus(); + } + async clickGearButton() { await this.gearButton.waitFor({state: 'visible', timeout: VISIBILITY_TIMEOUT}); await this.gearButton.click(); diff --git a/tests/suites/tenant/queryHistory/queryHistory.test.ts b/tests/suites/tenant/queryHistory/queryHistory.test.ts new file mode 100644 index 000000000..6bc1c3db1 --- /dev/null +++ b/tests/suites/tenant/queryHistory/queryHistory.test.ts @@ -0,0 +1,99 @@ +import {expect, test} from '@playwright/test'; + +import {tenantName} from '../../../utils/constants'; +import {TenantPage} from '../TenantPage'; +import {QueryEditor, QueryMode} from '../queryEditor/QueryEditor'; + +export const VISIBILITY_TIMEOUT = 5000; + +test.describe('Query History', () => { + let tenantPage: TenantPage; + let queryEditor: QueryEditor; + + test.beforeEach(async ({page}) => { + const pageQueryParams = { + schema: tenantName, + name: tenantName, + general: 'query', + }; + + tenantPage = new TenantPage(page); + await tenantPage.goto(pageQueryParams); + queryEditor = new QueryEditor(page); + }); + + test('New query appears in history after execution', async ({page}) => { + const testQuery = 'SELECT 1 AS test_column;'; + + // Execute the query + await queryEditor.run(testQuery, QueryMode.YQLScript); + + // Navigate to the history tab + await page.click('text=History'); + + // Check if the query appears in the history + const historyTable = page.locator('.ydb-queries-history table'); + await expect(historyTable.locator(`text="${testQuery}"`)).toBeVisible({ + timeout: VISIBILITY_TIMEOUT, + }); + }); + + test('Multiple queries appear in correct order in history', async ({page}) => { + const queries = [ + 'SELECT 1 AS first_query;', + 'SELECT 2 AS second_query;', + 'SELECT 3 AS third_query;', + ]; + + // Execute multiple queries + for (const query of queries) { + await queryEditor.run(query, QueryMode.YQLScript); + } + + // Navigate to the history tab + await page.click('text=History'); + + // Check if queries appear in reverse order (most recent first) + const historyTable = page.locator('.ydb-queries-history table'); + const rows = historyTable.locator('tbody tr'); + + await expect(rows).toHaveCount(queries.length); + + for (let i = 0; i < queries.length; i++) { + await expect(rows.nth(i)).toContainText(queries[queries.length - 1 - i]); + } + }); + + test('Query executed with keybinding is saved in history', async ({page, browserName}) => { + const testQuery = 'SELECT 1 AS keybinding_test;'; + + // Focus on the query editor + await queryEditor.focusEditor(); + + // Type the query + await page.keyboard.type(testQuery); + + // Use the keybinding to execute the query + if (browserName === 'chromium') { + // For Chromium, we need to press the keys separately + await page.keyboard.down('Control'); + await page.keyboard.press('Enter'); + await page.keyboard.up('Control'); + } else { + // For other browsers, we can use the combined key press + await page.keyboard.press( + process.platform === 'darwin' ? 'Meta+Enter' : 'Control+Enter', + ); + } + + // Wait for the query to be executed + await page.waitForSelector('.ydb-query-execute-result__result'); + + // Navigate to the history tab + await page.click('text=History'); + + // Check if the query appears in the history + const historyTable = page.locator('.ydb-queries-history table'); + await expect(historyTable.locator(`text="${testQuery}"`)).toBeVisible(); + }); +}); From 95d54ca02e71b28210ac7a92ddd50fc77502f9dc Mon Sep 17 00:00:00 2001 From: Anton Standrik Date: Fri, 2 Aug 2024 19:51:07 +0300 Subject: [PATCH 2/2] fix: final fix --- .../tenant/queryHistory/queryHistory.test.ts | 16 ++++------------ tests/suites/tenant/queryHistory/utils.ts | 18 ++++++++++++++++++ 2 files changed, 22 insertions(+), 12 deletions(-) create mode 100644 tests/suites/tenant/queryHistory/utils.ts diff --git a/tests/suites/tenant/queryHistory/queryHistory.test.ts b/tests/suites/tenant/queryHistory/queryHistory.test.ts index 6bc1c3db1..4e17b2b52 100644 --- a/tests/suites/tenant/queryHistory/queryHistory.test.ts +++ b/tests/suites/tenant/queryHistory/queryHistory.test.ts @@ -4,6 +4,8 @@ import {tenantName} from '../../../utils/constants'; import {TenantPage} from '../TenantPage'; import {QueryEditor, QueryMode} from '../queryEditor/QueryEditor'; +import executeQueryWithKeybinding from './utils'; + export const VISIBILITY_TIMEOUT = 5000; test.describe('Query History', () => { @@ -74,20 +76,10 @@ test.describe('Query History', () => { await page.keyboard.type(testQuery); // Use the keybinding to execute the query - if (browserName === 'chromium') { - // For Chromium, we need to press the keys separately - await page.keyboard.down('Control'); - await page.keyboard.press('Enter'); - await page.keyboard.up('Control'); - } else { - // For other browsers, we can use the combined key press - await page.keyboard.press( - process.platform === 'darwin' ? 'Meta+Enter' : 'Control+Enter', - ); - } + await executeQueryWithKeybinding(page, browserName); // Wait for the query to be executed - await page.waitForSelector('.ydb-query-execute-result__result'); + await page.waitForSelector('.ydb-query-execute-result__result', {timeout: 10000}); // Navigate to the history tab await page.click('text=History'); diff --git a/tests/suites/tenant/queryHistory/utils.ts b/tests/suites/tenant/queryHistory/utils.ts new file mode 100644 index 000000000..b7e03798a --- /dev/null +++ b/tests/suites/tenant/queryHistory/utils.ts @@ -0,0 +1,18 @@ +import type {Page} from '@playwright/test'; + +// eslint-disable-next-line no-implicit-globals +export default async function executeQueryWithKeybinding(page: Page, browserName: string) { + const isMac = process.platform === 'darwin'; + const modifierKey = browserName === 'webkit' ? 'Meta' : 'Control'; + + if (browserName !== 'webkit' || isMac) { + await page.keyboard.down(modifierKey); + await page.keyboard.press('Enter'); + await page.keyboard.up(modifierKey); + } else { + await page.keyboard.press('Meta+Enter'); + } + + // Add a small delay to ensure the event is processed + await page.waitForTimeout(1000); +}