refactor: improve test reliability and simplify filter tests

- Add saveSearchAndWaitForNavigation() to avoid race condition
  - Starts waiting for URL change BEFORE submitting form
  - Eliminates flaky tests where modal closes but URL hasn't changed yet
  - Replaces manual pattern of await modal hidden + await URL change

- Simplify search-filters.spec.ts to use known test data
  - Use hardcoded 'info' severity from seeded data instead of dynamic discovery
  - Remove 18 lines of complex conditional logic
  - More reliable and easier to understand

These changes leverage consistent test data from ClickHouse seeding.

Author: teeohhem

packages/app/tests/e2e/components/SavedSearchModalComponent.ts

@@ -3,7 +3,7 @@
  * Used for creating and managing saved searches
  * Not used until Saved Search functionality is implemented
  */
-import { Locator, Page } from '@playwright/test';
+import { expect, Locator, Page } from '@playwright/test';
 
 export class SavedSearchModalComponent {
   readonly page: Page;
@@ -69,6 +69,34 @@ export class SavedSearchModalComponent {
     await this.submit();
   }
 
+  /**
+   * Save search and wait for URL to change to the saved search page
+   * This is more reliable than waiting separately for modal close and URL change
+   */
+  async saveSearchAndWaitForNavigation(
+    name: string,
+    tags: string[] = [],
+  ): Promise<void> {
+    await this.fillName(name);
+
+    for (const tag of tags) {
+      await this.addTag(tag);
+    }
+
+    // Start waiting for URL change BEFORE clicking submit to avoid race condition
+    const urlPromise = this.page.waitForURL(/\/search\/[a-f0-9]+/, {
+      timeout: 15000,
+    });
+
+    await this.submit();
+
+    // Wait for navigation to complete
+    await urlPromise;
+
+    // Optionally wait for modal to fully close
+    await expect(this.container).toBeHidden();
+  }
+
   /**
    * Get tag elements
    */

packages/app/tests/e2e/core/navigation.spec.ts

@@ -71,6 +71,7 @@ test.describe('Navigation', { tag: ['@core'] }, () => {
       await test.step('Navigate between each page', async () => {
         for (const { testId, contentTestId } of navLinks) {
           const link = page.locator(`[data-testid="${testId}"]`);
+          await link.scrollIntoViewIfNeeded();
           await link.click();
 
           const content = page.locator(`[data-testid="${contentTestId}"]`);

packages/app/tests/e2e/features/search/saved-search.spec.ts

@@ -1,3 +1,8 @@
+import {
+  DEFAULT_LOGS_SOURCE_NAME,
+  DEFAULT_TRACES_SOURCE_NAME,
+} from 'tests/e2e/utils/constants';
+
 import { SearchPage } from '../../page-objects/SearchPage';
 import { expect, test } from '../../utils/base-test';
 
@@ -34,10 +39,9 @@ test.describe('Saved Search Functionality', { tag: '@full-stack' }, () => {
         await searchPage.setCustomSELECT(customSelect);
         await searchPage.submitEmptySearch();
         await searchPage.openSaveSearchModal();
-        await searchPage.savedSearchModal.saveSearch('Custom Select Search');
-
-        await expect(searchPage.savedSearchModal.container).toBeHidden();
-        await page.waitForURL(/\/search\/[a-f0-9]+/, { timeout: 15000 });
+        await searchPage.savedSearchModal.saveSearchAndWaitForNavigation(
+          'Custom Select Search',
+        );
       });
 
       const savedSearchAUrl = page.url().split('?')[0];
@@ -48,10 +52,9 @@ test.describe('Saved Search Functionality', { tag: '@full-stack' }, () => {
         // Keep default SELECT (don't modify it)
         await searchPage.submitEmptySearch();
         await searchPage.openSaveSearchModal();
-        await searchPage.savedSearchModal.saveSearch('Default Select Search');
-
-        await expect(searchPage.savedSearchModal.container).toBeHidden();
-        await page.waitForURL(/\/search\/[a-f0-9]+/, { timeout: 10000 });
+        await searchPage.savedSearchModal.saveSearchAndWaitForNavigation(
+          'Default Select Search',
+        );
       });
 
       await test.step('Navigate back to first saved search', async () => {
@@ -87,12 +90,9 @@ test.describe('Saved Search Functionality', { tag: '@full-stack' }, () => {
         await searchPage.setCustomSELECT(customSelect);
         await searchPage.submitEmptySearch();
         await searchPage.openSaveSearchModal();
-        await searchPage.savedSearchModal.saveSearch(
+        await searchPage.savedSearchModal.saveSearchAndWaitForNavigation(
           'Custom Select Source Test',
         );
-
-        await expect(searchPage.savedSearchModal.container).toBeHidden();
-        await page.waitForURL(/\/search\/[a-f0-9]+/, { timeout: 5000 });
       });
 
       const savedSearchUrl = page.url().split('?')[0];
@@ -132,25 +132,20 @@ test.describe('Saved Search Functionality', { tag: '@full-stack' }, () => {
     'should use default SELECT when switching sources within a saved search',
     { tag: '@full-stack' },
     async ({ page }) => {
-      let originalSourceName: string | null = null;
-
       await test.step('Create and navigate to saved search', async () => {
         const customSelect =
           'Timestamp, Body, lower(ServiceName) as service_name';
         await searchPage.setCustomSELECT(customSelect);
         await searchPage.submitEmptySearch();
         await searchPage.openSaveSearchModal();
-        await searchPage.savedSearchModal.saveSearch('Source Switching Test');
-
-        await expect(searchPage.savedSearchModal.container).toBeHidden();
-        await page.waitForURL(/\/search\/[a-f0-9]+/, { timeout: 5000 });
+        await searchPage.savedSearchModal.saveSearchAndWaitForNavigation(
+          'Source Switching Test',
+        );
       });
 
       await test.step('Switch to different source via dropdown', async () => {
-        originalSourceName = await searchPage.currentSource.inputValue();
-
         await searchPage.sourceDropdown.click();
-        await searchPage.otherSources.first().click();
+        await searchPage.selectSource(DEFAULT_TRACES_SOURCE_NAME);
         await page.waitForLoadState('networkidle');
         await searchPage.table.waitForRowsToPopulate();
       });
@@ -167,7 +162,7 @@ test.describe('Saved Search Functionality', { tag: '@full-stack' }, () => {
 
       await test.step('Switch back to original source via dropdown', async () => {
         await searchPage.sourceDropdown.click();
-        await searchPage.selectSource(originalSourceName!);
+        await searchPage.selectSource(DEFAULT_LOGS_SOURCE_NAME);
         await page.waitForLoadState('networkidle');
         await searchPage.table.waitForRowsToPopulate();
       });
@@ -280,13 +275,10 @@ test.describe('Saved Search Functionality', { tag: '@full-stack' }, () => {
         await searchPage.setCustomSELECT(customSelect);
         await searchPage.performSearch('ServiceName:frontend');
         await searchPage.openSaveSearchModal();
-        await searchPage.savedSearchModal.saveSearch(
+        await searchPage.savedSearchModal.saveSearchAndWaitForNavigation(
           'Custom Select Navigation Test',
         );
 
-        await expect(searchPage.savedSearchModal.container).toBeHidden();
-        await page.waitForURL(/\/search\/[a-f0-9]+/, { timeout: 5000 });
-
         savedSearchUrl = page.url().split('?')[0];
       });
 
@@ -326,10 +318,9 @@ test.describe('Saved Search Functionality', { tag: '@full-stack' }, () => {
       await test.step('Create and save a search', async () => {
         await searchPage.performSearch('SeverityText:info');
         await searchPage.openSaveSearchModal();
-        await searchPage.savedSearchModal.saveSearch('Browser Navigation Test');
-
-        await expect(searchPage.savedSearchModal.container).toBeHidden();
-        await page.waitForURL(/\/search\/[a-f0-9]+/, { timeout: 5000 });
+        await searchPage.savedSearchModal.saveSearchAndWaitForNavigation(
+          'Browser Navigation Test',
+        );
       });
 
       await test.step('Navigate to sessions page', async () => {
@@ -383,12 +374,9 @@ test.describe('Saved Search Functionality', { tag: '@full-stack' }, () => {
         // Submit and save the search
         await searchPage.submitEmptySearch();
         await searchPage.openSaveSearchModal();
-        await searchPage.savedSearchModal.saveSearch(
+        await searchPage.savedSearchModal.saveSearchAndWaitForNavigation(
           'ORDER BY Multiple Source Switch Test',
         );
-
-        await expect(searchPage.savedSearchModal.container).toBeHidden();
-        await page.waitForURL(/\/search\/[a-f0-9]+/, { timeout: 5000 });
       });
 
       await test.step('Switch to second source', async () => {

packages/app/tests/e2e/features/search/search-filters.spec.ts

@@ -47,26 +47,13 @@ test.describe('Search Filters', { tag: ['@search'] }, () => {
   });
 
   test('Should search for and apply filters', async () => {
-    // Use filter component's helper to find a filter with search capability
-    const skipFilters = ['severity', 'level'];
-    const filterName =
-      await searchPage.filters.findFilterWithSearch(skipFilters);
-
-    if (filterName) {
-      // Search input is already visible from findFilterWithSearch
-      // Test the search functionality
-      await searchPage.filters.searchFilterValues(filterName, 'test');
-
-      // Verify search input has the value
-      const searchInput = searchPage.filters.getFilterSearchInput(filterName);
-      await expect(searchInput).toHaveValue('test');
-
-      // Clear the search
-      await searchPage.filters.clearFilterSearch(filterName);
-
-      // Verify search input is cleared
-      await expect(searchInput).toHaveValue('');
-    }
+    const filterName = 'SeverityText';
+    await searchPage.filters.openFilterGroup(filterName);
+    await searchPage.filters.searchFilterValues(filterName, 'test');
+    const searchInput = searchPage.filters.getFilterSearchInput(filterName);
+    await expect(searchInput).toHaveValue('test');
+    await searchPage.filters.clearFilterSearch(filterName);
+    await expect(searchInput).toHaveValue('');
   });
 
   test('Should pin filter and verify it persists after reload', async () => {