Skip to content

Fix flaky filter deselection tests - missing wait states and race conditions #4656

@frano-m

Description

@frano-m

Summary

Tests testDeselectFiltersThroughSearchBar and testFilterTags are flaky due to missing wait states and race conditions when interacting with filter checkboxes.

Affected Tests

  • e2e/anvil-catalog/anvilcatalog-filters.spec.ts:46 - "Check that deselecting filters through the 'Search all Filters' textbox works correctly on the Consortia tab"
  • e2e/anvil/anvil-filters.spec.ts:139 - "Check that the filter tags match the selected filter for an arbitrary filter on the BioSamples tab"

Root Cause Analysis

Issue 1: testDeselectFiltersThroughSearchBar (e2e/testFunctions.ts:764-801)

  1. Missing waitForLoadState("load") after selecting the filter - Lines 779-780:

    await firstFilterOptionLocator.click();
    await page.locator("body").click();  // No wait after filter selection!

    Compare with the working testFilterTags function (lines 643-645) which has an explicit wait:

    await firstFilterOptionLocator.getByRole("checkbox").click();
    await page.waitForLoadState("load");  // ← Has explicit wait
    await page.locator("body").click();
  2. No wait for checkbox state before using :checked selector - Lines 793-796 use a static CSS selector:

    await filterOptionLocator
      .locator("input[type='checkbox']:checked")  // ← Race condition!
      .first()
      .click();

    The :checked CSS selector doesn't auto-retry waiting for state changes like Playwright's expect(locator).toBeChecked() would.

Issue 2: testFilterTags (e2e/testFunctions.ts:625-661)

The local failures on BioSamples tab suggest timing issues with filter tag visibility/removal after interactions.

Recommended Fix

For testDeselectFiltersThroughSearchBar:

// After line 779, add waitForLoadState:
await firstFilterOptionLocator.click();
await page.waitForLoadState("load");  // ADD THIS
await page.locator("body").click();

// Replace lines 793-796 with explicit state wait:
const checkboxLocator = filterOptionLocator.getByRole("checkbox");
await expect(checkboxLocator).toBeChecked();  // Wait for checked state
await checkboxLocator.click();

Acceptance Criteria

  • Add page.waitForLoadState("load") after filter selection in testDeselectFiltersThroughSearchBar
  • Replace :checked CSS selector with expect(checkbox).toBeChecked() pattern
  • Tests pass consistently across multiple CI runs

Metadata

Metadata

Labels

No labels
No labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions