Skip to content

Commit 427c09c

Browse files
sadpandajoeclaude
sadpandajoe
and
claude
committed
test(sqllab): align Playwright tests with sc-102088 story requirements
Add 5 new tests and reorganize files to match the story spec: - query-execution.spec.ts: error handling + re-run query tests - tabs.spec.ts: create/close/preserve-state tests - save-and-share.spec.ts: moved save query + new dataset creation test - SqlLabPage POM: error alert, save dataset button/modal methods Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
1 parent 49911fa commit 427c09c

4 files changed

Lines changed: 270 additions & 66 deletions

File tree

‎superset-frontend/playwright/pages/SqlLabPage.ts‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -50,6 +50,7 @@ export class SqlLabPage {
5050
DATABASE_SELECTOR: '[data-test="DatabaseSelector"]',
5151
LIMIT_DROPDOWN: '.limitDropdown',
5252
TAB_REMOVE: '[aria-label="remove"]',
53+
SAVE_DATASET_BUTTON: 'button[aria-label="Save dataset"]',
5354
} as const;
5455

5556
constructor(page: Page) {
@@ -237,6 +238,10 @@ export class SqlLabPage {
237238
return this.page.locator(SqlLabPage.SELECTORS.SOUTH_PANE);
238239
}
239240

241+
getErrorAlert(): Locator {
242+
return this.getResultsPane().locator('.ant-alert-error');
243+
}
244+
240245
// ── Row Limit ──
241246

242247
async getRowLimit(): Promise<string> {
@@ -261,6 +266,21 @@ export class SqlLabPage {
261266
return new Modal(this.page, SqlLabPage.SELECTORS.SAVE_QUERY_MODAL);
262267
}
263268

269+
// ── Save Dataset ──
270+
271+
async clickSaveDatasetButton(): Promise<void> {
272+
await this.activePanel
273+
.locator(SqlLabPage.SELECTORS.SAVE_DATASET_BUTTON)
274+
.click();
275+
}
276+
277+
getSaveDatasetModal(): Modal {
278+
return new Modal(
279+
this.page,
280+
'[data-test="Save or Overwrite Dataset-modal"] .ant-modal',
281+
);
282+
}
283+
264284
// ── Create Chart ──
265285

266286
getCreateChartButton(): Locator {

‎superset-frontend/playwright/tests/sqllab/query-execution.spec.ts‎

Lines changed: 38 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -17,10 +17,9 @@
1717
* under the License.
1818
*/
1919

20-
import { test, expect } from '../../helpers/fixtures/testAssets';
20+
import { test, expect } from '@playwright/test';
2121
import { SqlLabPage } from '../../pages/SqlLabPage';
2222
import { waitForPost } from '../../helpers/api/intercepts';
23-
import { apiGetSavedQuery } from '../../helpers/api/savedQuery';
2423
import { TIMEOUT } from '../../utils/constants';
2524

2625
let sqlLabPage: SqlLabPage;
@@ -32,7 +31,9 @@ test.beforeEach(async ({ page }) => {
3231
await sqlLabPage.ensureEditorReady();
3332
});
3433

35-
test('should execute a query and display results', async ({ page }) => {
34+
test('executes a simple SELECT query and displays results', async ({
35+
page,
36+
}) => {
3637
// Verify the left sidebar database selector is visible and interactive (#38833)
3738
await expect(sqlLabPage.getDatabaseSelectorText()).toBeVisible();
3839

@@ -54,57 +55,51 @@ test('should execute a query and display results', async ({ page }) => {
5455
expect(headers.some(h => h.includes('test_col'))).toBe(true);
5556
});
5657

57-
test('should save and reload a query', async ({ page, testAssets }) => {
58-
const queryText = 'SELECT 1 AS saved_test_col';
59-
const savedQueryTitle = `pw_test_saved_query_${Date.now()}`;
60-
61-
// Verify left sidebar is interactive
62-
await expect(sqlLabPage.getDatabaseSelectorText()).toBeVisible();
63-
64-
// Set and run query
65-
await sqlLabPage.setQuery(queryText);
58+
test('shows error message for invalid SQL', async ({ page }) => {
59+
await sqlLabPage.setQuery(
60+
'SELECT * FROM a_table_that_does_not_exist_xyz_pw',
61+
);
6662

6763
const executePromise = waitForPost(page, 'api/v1/sqllab/execute/', {
6864
timeout: TIMEOUT.QUERY_EXECUTION,
6965
});
7066
await sqlLabPage.runQuery();
7167
await executePromise;
72-
await sqlLabPage.waitForQueryResults();
7368

74-
// Open the save query modal
75-
await sqlLabPage.clickSaveButton();
76-
const saveModal = sqlLabPage.getSaveQueryModal();
77-
await saveModal.waitForReady();
69+
// Wait for error alert to render in south pane
70+
const errorAlert = sqlLabPage.getErrorAlert();
71+
await expect(errorAlert).toBeVisible({ timeout: TIMEOUT.QUERY_EXECUTION });
7872

79-
// Fill in the query name
80-
await saveModal.body.locator('input[type="text"]').first().clear();
81-
await saveModal.body
82-
.locator('input[type="text"]')
83-
.first()
84-
.fill(savedQueryTitle);
73+
// Verify the south pane contains an error indicator (engine-agnostic)
74+
const southPane = sqlLabPage.getResultsPane();
75+
await expect(southPane).toContainText(/error/i);
76+
});
8577

86-
// Save and intercept the API response
87-
const savePromise = waitForPost(page, 'api/v1/saved_query/', {
88-
timeout: TIMEOUT.API_RESPONSE,
78+
test('re-runs a query and refreshes results', async ({ page }) => {
79+
// First query
80+
await sqlLabPage.setQuery('SELECT 1 AS first_col');
81+
const firstExecute = waitForPost(page, 'api/v1/sqllab/execute/', {
82+
timeout: TIMEOUT.QUERY_EXECUTION,
8983
});
90-
await saveModal.footer
91-
.getByRole('button', { name: 'Save', exact: true })
92-
.click();
93-
const saveResponse = await savePromise;
94-
expect(saveResponse.status()).toBe(201);
84+
await sqlLabPage.runQuery();
85+
const firstResponse = await firstExecute;
86+
expect(firstResponse.status()).toBe(200);
87+
await sqlLabPage.waitForQueryResults();
9588

96-
// Extract saved query ID for cleanup
97-
const saveBody = await saveResponse.json();
98-
const savedQueryId: number = saveBody.id ?? saveBody.result?.id;
99-
expect(savedQueryId).toBeTruthy();
100-
testAssets.trackSavedQuery(savedQueryId);
89+
const firstHeaders = await sqlLabPage.getResultsGrid().getHeaderTexts();
90+
expect(firstHeaders.some(h => h.includes('first_col'))).toBe(true);
10191

102-
// Verify the modal closed
103-
await saveModal.waitForHidden();
92+
// Second query (re-run with different SQL)
93+
await sqlLabPage.setQuery('SELECT 2 AS second_col');
94+
const secondExecute = waitForPost(page, 'api/v1/sqllab/execute/', {
95+
timeout: TIMEOUT.QUERY_EXECUTION,
96+
});
97+
await sqlLabPage.runQuery();
98+
const secondResponse = await secondExecute;
99+
expect(secondResponse.status()).toBe(200);
100+
await sqlLabPage.waitForQueryResults();
104101

105-
// Verify the saved query via API (round-trip persistence check)
106-
const getResponse = await apiGetSavedQuery(page, savedQueryId);
107-
const savedQuery = (await getResponse.json()).result;
108-
expect(savedQuery.sql).toContain('saved_test_col');
109-
expect(savedQuery.label).toBe(savedQueryTitle);
102+
const secondHeaders = await sqlLabPage.getResultsGrid().getHeaderTexts();
103+
expect(secondHeaders.some(h => h.includes('second_col'))).toBe(true);
104+
expect(secondHeaders.some(h => h.includes('first_col'))).toBe(false);
110105
});

‎superset-frontend/playwright/tests/sqllab/save-and-share.spec.ts‎

Lines changed: 163 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,163 @@
1+
/**
2+
* Licensed to the Apache Software Foundation (ASF) under one
3+
* or more contributor license agreements. See the NOTICE file
4+
* distributed with this work for additional information
5+
* regarding copyright ownership. The ASF licenses this file
6+
* to you under the Apache License, Version 2.0 (the
7+
* "License"); you may not use this file except in compliance
8+
* with the License. You may obtain a copy of the License at
9+
*
10+
* http://www.apache.org/licenses/LICENSE-2.0
11+
*
12+
* Unless required by applicable law or agreed to in writing,
13+
* software distributed under the License is distributed on an
14+
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
15+
* KIND, either express or implied. See the License for the
16+
* specific language governing permissions and limitations
17+
* under the License.
18+
*/
19+
20+
import { expect } from '@playwright/test';
21+
import { test } from '../../helpers/fixtures/testAssets';
22+
import { SqlLabPage } from '../../pages/SqlLabPage';
23+
import { ExplorePage } from '../../pages/ExplorePage';
24+
import { waitForPost } from '../../helpers/api/intercepts';
25+
import { apiGetSavedQuery } from '../../helpers/api/savedQuery';
26+
import { TIMEOUT } from '../../utils/constants';
27+
28+
let sqlLabPage: SqlLabPage;
29+
30+
test.beforeEach(async ({ page }) => {
31+
sqlLabPage = new SqlLabPage(page);
32+
await sqlLabPage.goto();
33+
await sqlLabPage.waitForPageLoad();
34+
await sqlLabPage.ensureEditorReady();
35+
});
36+
37+
test('saves a query and loads it from saved queries', async ({
38+
page,
39+
testAssets,
40+
}) => {
41+
const queryText = 'SELECT 1 AS saved_test_col';
42+
const savedQueryTitle = `pw_test_saved_query_${Date.now()}`;
43+
44+
// Verify left sidebar is interactive
45+
await expect(sqlLabPage.getDatabaseSelectorText()).toBeVisible();
46+
47+
// Set and run query
48+
await sqlLabPage.setQuery(queryText);
49+
50+
const executePromise = waitForPost(page, 'api/v1/sqllab/execute/', {
51+
timeout: TIMEOUT.QUERY_EXECUTION,
52+
});
53+
await sqlLabPage.runQuery();
54+
await executePromise;
55+
await sqlLabPage.waitForQueryResults();
56+
57+
// Open the save query modal
58+
await sqlLabPage.clickSaveButton();
59+
const saveModal = sqlLabPage.getSaveQueryModal();
60+
await saveModal.waitForReady();
61+
62+
// Fill in the query name
63+
await saveModal.body.locator('input[type="text"]').first().clear();
64+
await saveModal.body
65+
.locator('input[type="text"]')
66+
.first()
67+
.fill(savedQueryTitle);
68+
69+
// Save and intercept the API response
70+
const savePromise = waitForPost(page, 'api/v1/saved_query/', {
71+
timeout: TIMEOUT.API_RESPONSE,
72+
});
73+
await saveModal.footer
74+
.getByRole('button', { name: 'Save', exact: true })
75+
.click();
76+
const saveResponse = await savePromise;
77+
expect(saveResponse.status()).toBe(201);
78+
79+
// Extract saved query ID for cleanup
80+
const saveBody = await saveResponse.json();
81+
const savedQueryId: number = saveBody.id ?? saveBody.result?.id;
82+
expect(savedQueryId).toBeTruthy();
83+
testAssets.trackSavedQuery(savedQueryId);
84+
85+
// Verify the modal closed
86+
await saveModal.waitForHidden();
87+
88+
// Verify the saved query via API (round-trip persistence check)
89+
const getResponse = await apiGetSavedQuery(page, savedQueryId);
90+
const savedQuery = (await getResponse.json()).result;
91+
expect(savedQuery.sql).toContain('saved_test_col');
92+
expect(savedQuery.label).toBe(savedQueryTitle);
93+
});
94+
95+
test('creates a dataset from query results', async ({ page, testAssets }) => {
96+
// Select database to enable the "Save dataset" toolbar button
97+
await sqlLabPage.selectDatabase('examples');
98+
99+
const queryText = 'SELECT 1 AS ds_test_col';
100+
await sqlLabPage.setQuery(queryText);
101+
102+
const executePromise = waitForPost(page, 'api/v1/sqllab/execute/', {
103+
timeout: TIMEOUT.QUERY_EXECUTION,
104+
});
105+
await sqlLabPage.runQuery();
106+
const executeResponse = await executePromise;
107+
108+
if (executeResponse.status() !== 200) {
109+
test.skip(true, 'Query execution failed — database may not be configured');
110+
}
111+
112+
await sqlLabPage.waitForQueryResults();
113+
114+
// Click "Save dataset" button in the toolbar
115+
await sqlLabPage.clickSaveDatasetButton();
116+
117+
// Wait for the Save Dataset modal
118+
const saveDatasetModal = sqlLabPage.getSaveDatasetModal();
119+
await saveDatasetModal.waitForReady();
120+
121+
// Fill in a unique dataset name
122+
const datasetName = `pw_test_dataset_${Date.now()}`;
123+
const nameInput = saveDatasetModal.body.locator(
124+
'input[placeholder="Dataset name"]',
125+
);
126+
await nameInput.clear();
127+
await nameInput.fill(datasetName);
128+
129+
// Set up intercepts before clicking save:
130+
// 1. Dataset creation API
131+
// 2. New browser tab (SaveDatasetModal opens Explore via window.open)
132+
const datasetCreatePromise = waitForPost(page, 'api/v1/dataset/', {
133+
timeout: TIMEOUT.API_RESPONSE,
134+
});
135+
const newPagePromise = page.context().waitForEvent('page', {
136+
timeout: TIMEOUT.API_RESPONSE,
137+
});
138+
139+
// Click "Save & Explore"
140+
await saveDatasetModal.footer
141+
.getByRole('button', { name: /Save & Explore/i })
142+
.click();
143+
144+
// Capture dataset ID for cleanup
145+
const createResponse = await datasetCreatePromise;
146+
const createBody = await createResponse.json();
147+
const datasetId: number = createBody.result?.id ?? createBody.id;
148+
expect(datasetId).toBeTruthy();
149+
testAssets.trackDataset(datasetId);
150+
151+
// Wait for the new tab with Explore page
152+
const newPage = await newPagePromise;
153+
await newPage.waitForLoadState();
154+
155+
const explorePage = new ExplorePage(newPage);
156+
await explorePage.waitForPageLoad({ timeout: TIMEOUT.PAGE_LOAD });
157+
158+
// Verify the dataset name appears in the Explore datasource control
159+
const loadedDatasetName = await explorePage.getDatasetName();
160+
expect(loadedDatasetName).toContain(datasetName);
161+
162+
await newPage.close();
163+
});

0 commit comments

Comments
 (0)