Skip to content

Commit 01b87ee

Browse files
Pragadesh-45Pragadesh-45
authored
refactor: improve element interactions in preferences and fix playwright tests (#6894)
1 parent 9e1c58a commit 01b87ee

3 files changed

Lines changed: 94 additions & 73 deletions

File tree

‎tests/preferences/autosave/autosave.spec.ts‎

Lines changed: 42 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -33,22 +33,29 @@ test.describe('Autosave', () => {
3333
});
3434

3535
await test.step('Enable autosave in preferences', async () => {
36-
// Open preferences
36+
// Open preferences tab
3737
await page.locator('.status-bar button[data-trigger="preferences"]').click();
3838

39-
const preferencesModal = page.locator('.bruno-modal-card').filter({ hasText: 'Preferences' });
40-
await expect(preferencesModal).toBeVisible();
39+
// Wait for preferences tab to be visible
40+
await page.waitForTimeout(500);
41+
42+
// Navigate to General tab (should be default, but ensure it)
43+
await page.getByRole('tab', { name: 'General' }).click();
4144

4245
// Enable autosave checkbox
43-
const autoSaveCheckbox = preferencesModal.locator('#autoSaveEnabled');
46+
const autoSaveCheckbox = page.locator('#autoSaveEnabled');
4447
await autoSaveCheckbox.check();
4548

4649
// Wait for auto-save to complete (debounce is 500ms)
4750
await page.waitForTimeout(1000);
4851

49-
// Close preferences modal
50-
await preferencesModal.locator('[data-testid="modal-close-button"]').click();
51-
await expect(preferencesModal).not.toBeVisible();
52+
// Close preferences tab using the close icon
53+
const preferencesTab = page.locator('.request-tab').filter({ hasText: 'Preferences' });
54+
await preferencesTab.hover();
55+
await preferencesTab.locator('.close-icon').click();
56+
57+
// Click on the request to make it active again
58+
await page.locator('.collection-item-name').filter({ hasText: 'Test Request' }).click();
5259
});
5360

5461
await test.step('Make changes and verify autosave', async () => {
@@ -82,23 +89,29 @@ test.describe('Autosave', () => {
8289
});
8390

8491
await test.step('Disable autosave in preferences', async () => {
85-
// Open preferences from status bar
92+
// Open preferences tab
8693
await page.locator('.status-bar button[data-trigger="preferences"]').click();
8794

88-
// Wait for preferences modal
89-
const preferencesModal = page.locator('.bruno-modal-card').filter({ hasText: 'Preferences' });
90-
await expect(preferencesModal).toBeVisible();
95+
// Wait for preferences tab to be visible
96+
await page.waitForTimeout(500);
97+
98+
// Navigate to General tab
99+
await page.getByRole('tab', { name: 'General' }).click();
91100

92101
// Disable autosave checkbox
93-
const autoSaveCheckbox = preferencesModal.locator('#autoSaveEnabled');
102+
const autoSaveCheckbox = page.locator('#autoSaveEnabled');
94103
await autoSaveCheckbox.uncheck();
95104

96105
// Wait for auto-save to complete (debounce is 500ms)
97106
await page.waitForTimeout(1000);
98107

99-
// Close preferences modal
100-
await preferencesModal.locator('[data-testid="modal-close-button"]').click();
101-
await expect(preferencesModal).not.toBeVisible();
108+
// Close preferences tab using the close icon
109+
const preferencesTab = page.locator('.request-tab').filter({ hasText: 'Preferences' });
110+
await preferencesTab.hover();
111+
await preferencesTab.locator('.close-icon').click();
112+
113+
// Click on the request to make it active again
114+
await page.locator('.collection-item-name').filter({ hasText: 'Test Request' }).click();
102115
});
103116

104117
await test.step('Make changes and verify no autosave when disabled', async () => {
@@ -160,22 +173,29 @@ test.describe('Autosave', () => {
160173
});
161174

162175
await test.step('Enable autosave and verify existing draft is saved', async () => {
163-
// Open preferences
176+
// Open preferences tab
164177
await page.locator('.status-bar button[data-trigger="preferences"]').click();
165178

166-
const preferencesModal = page.locator('.bruno-modal-card').filter({ hasText: 'Preferences' });
167-
await expect(preferencesModal).toBeVisible();
179+
// Wait for preferences tab to be visible
180+
await page.waitForTimeout(500);
181+
182+
// Navigate to General tab
183+
await page.getByRole('tab', { name: 'General' }).click();
168184

169185
// Enable autosave checkbox
170-
const autoSaveCheckbox = preferencesModal.locator('#autoSaveEnabled');
186+
const autoSaveCheckbox = page.locator('#autoSaveEnabled');
171187
await autoSaveCheckbox.check();
172188

173189
// Wait for auto-save to complete (debounce is 500ms)
174190
await page.waitForTimeout(1000);
175191

176-
// Close preferences modal
177-
await preferencesModal.locator('[data-testid="modal-close-button"]').click();
178-
await expect(preferencesModal).not.toBeVisible();
192+
// Close preferences tab using the close icon
193+
const preferencesTab = page.locator('.request-tab').filter({ hasText: 'Preferences' });
194+
await preferencesTab.hover();
195+
await preferencesTab.locator('.close-icon').click();
196+
197+
// Click on the request to make it active again
198+
await page.locator('.collection-item-name').filter({ hasText: 'Draft Request' }).click();
179199

180200
await page.waitForTimeout(1000);
181201

‎tests/preferences/default-collection-location/default-collection-location.spec.js‎

Lines changed: 52 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -2,46 +2,29 @@ import { test, expect } from '../../../playwright';
22

33
test.describe('Default Collection Location Feature', () => {
44
test('Should hydrate the default location from preferences', async ({ pageWithUserData: page }) => {
5-
// open preferences
5+
// open preferences tab
66
await page.locator('.preferences-button').click();
77

8+
// wait for preferences tab to be visible
9+
await page.waitForTimeout(500);
10+
11+
// navigate to General tab
12+
await page.getByRole('tab', { name: 'General' }).click();
13+
814
// verify the default location is pre-filled
915
const defaultLocationInput = page.locator('.default-collection-location-input');
1016
await expect(defaultLocationInput).toHaveValue('/tmp/bruno-collections');
11-
12-
// close the preferences
13-
await page.getByTestId('modal-close-button').click();
14-
15-
// wait for 2 seconds
16-
await page.waitForTimeout(2000);
1717
});
1818

19-
test('Should save empty default location', async ({ pageWithUserData: page }) => {
20-
// open preferences
19+
test('Should save a valid default location', async ({ pageWithUserData: page }) => {
20+
// open preferences tab
2121
await page.locator('.preferences-button').click();
2222

23-
// clear the default location field (readonly input, remove readonly then clear)
24-
const defaultLocationInput = page.locator('.default-collection-location-input');
25-
await defaultLocationInput.evaluate((el) => {
26-
const input = el;
27-
input.removeAttribute('readonly');
28-
input.readOnly = false;
29-
});
30-
await defaultLocationInput.clear();
31-
32-
// wait for auto-save to complete (debounce is 500ms)
33-
await page.waitForTimeout(1000);
34-
35-
// close the preferences
36-
await page.getByTestId('modal-close-button').click();
37-
38-
// wait for modal to close
23+
// wait for preferences tab to be visible
3924
await page.waitForTimeout(500);
40-
});
4125

42-
test('Should save a valid default location', async ({ pageWithUserData: page }) => {
43-
// open preferences
44-
await page.locator('.preferences-button').click();
26+
// navigate to General tab
27+
await page.getByRole('tab', { name: 'General' }).click();
4528

4629
// set a default location (readonly input, remove readonly then fill)
4730
const defaultLocationInput = page.locator('.default-collection-location-input');
@@ -54,30 +37,27 @@ test.describe('Default Collection Location Feature', () => {
5437

5538
// wait for auto-save to complete (debounce is 500ms)
5639
await page.waitForTimeout(1000);
57-
58-
// close the preferences
59-
await page.getByTestId('modal-close-button').click();
60-
61-
// wait for modal to close
62-
await page.waitForTimeout(500);
6340
});
6441

6542
test('Should use default location in Create Collection modal', async ({ pageWithUserData: page }) => {
6643
// test Create Collection modal
6744
await page.getByTestId('collections-header-add-menu').click();
6845
await page.locator('.tippy-box .dropdown-item').filter({ hasText: 'Create collection' }).click();
6946

70-
// verify the default location is pre-filled (if location input is visible)
71-
const collectionLocationInput = page.getByLabel('Location');
72-
if (await collectionLocationInput.isVisible()) {
73-
await expect(collectionLocationInput).toHaveValue('/tmp/bruno-collections');
74-
}
47+
// Wait for modal to be visible
48+
await page.locator('.bruno-modal').waitFor({ state: 'visible' });
49+
50+
// verify the default location is pre-filled
51+
// Scope to the modal to avoid conflict with preferences tab
52+
const collectionLocationInput = page.locator('.bruno-modal').getByLabel('Location', { exact: true });
53+
await expect(collectionLocationInput).toBeVisible();
54+
55+
const inputValue = await collectionLocationInput.inputValue();
56+
57+
await expect(collectionLocationInput).toHaveValue('/tmp/bruno-collections', { timeout: 5000 });
7558

7659
// cancel the collection creation
7760
await page.locator('.bruno-modal').getByRole('button', { name: 'Cancel' }).click();
78-
79-
// wait for 2 seconds
80-
await page.waitForTimeout(2000);
8161
});
8262

8363
test('Should use default location in Clone Collection modal', async ({ pageWithUserData: page }) => {
@@ -87,16 +67,39 @@ test.describe('Default Collection Location Feature', () => {
8767
await collection.locator('.collection-actions .icon').click();
8868
await page.locator('.dropdown-item').filter({ hasText: 'Clone' }).click();
8969

70+
// Wait for modal to be visible
71+
await page.locator('.bruno-modal').waitFor({ state: 'visible' });
72+
9073
// verify the default location is pre-filled
91-
const cloneLocationInput = page.getByLabel('Location');
92-
if (await cloneLocationInput.isVisible()) {
93-
await expect(cloneLocationInput).toHaveValue('/tmp/bruno-collections');
94-
}
74+
// Scope to the modal to avoid conflict with preferences tab
75+
const cloneLocationInput = page.locator('.bruno-modal').getByLabel('Location', { exact: true });
76+
await expect(cloneLocationInput).toBeVisible();
77+
await expect(cloneLocationInput).toHaveValue('/tmp/bruno-collections', { timeout: 5000 });
9578

9679
// cancel the clone operation
9780
await page.locator('.bruno-modal').getByRole('button', { name: 'Cancel' }).click();
81+
});
82+
83+
test('Should save empty default location', async ({ pageWithUserData: page }) => {
84+
// open preferences tab
85+
await page.locator('.preferences-button').click();
86+
87+
// wait for preferences tab to be visible
88+
await page.waitForTimeout(500);
9889

99-
// wait for 2 seconds
100-
await page.waitForTimeout(2000);
90+
// navigate to General tab
91+
await page.getByRole('tab', { name: 'General' }).click();
92+
93+
// clear the default location field (readonly input, remove readonly then clear)
94+
const defaultLocationInput = page.locator('.default-collection-location-input');
95+
await defaultLocationInput.evaluate((el) => {
96+
const input = el;
97+
input.removeAttribute('readonly');
98+
input.readOnly = false;
99+
});
100+
await defaultLocationInput.clear();
101+
102+
// wait for auto-save to complete (debounce is 500ms)
103+
await page.waitForTimeout(1000);
101104
});
102105
});

‎tests/preferences/support-links.spec.js‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,4 @@ test('Should verify all support links with correct URL in preference > Support t
2222

2323
const locator_documentation = page.getByRole('link', { name: 'Documentation', exact: true });
2424
expect(await locator_documentation.getAttribute('href')).toEqual('https://docs.usebruno.com');
25-
26-
await page.getByTestId('modal-close-button').click();
2725
});

0 commit comments

Comments
 (0)