Skip to content

Introduce ignoreHidden option for non-role queries (Support for React 19.2 <Activity>) #1370

@naman-luthra-rubrik

Description

@naman-luthra-rubrik

Introduce ignoreHidden option for non-role queries (Support for React 19.2 <Activity>)

Is your feature request related to a problem? Please describe.

With the adoption of React 19.2's <Activity>, keeping components in the DOM hidden via display: none rather than unmounting them is a standard feature supported out of box in React.

However, this creates a significant conflict with Testing Library's non-role queries (getByText, getByLabelText, getByPlaceholderText, etc.):

  1. The Conflict: These queries return elements that are technically in the DOM but invisible to the user. This breaks the guiding philosophy of "testing from the user's perspective."
  2. Ambiguity Errors: In a Wizard flow where "Step 1" is hidden (via Activity) and "Step 2" is visible, querying for a shared element (e.g., getByText('Next')) causes a "Multiple elements found" error.

Why current workarounds fail

  • getByRole: That would be ideal, but many elements won't have a defined role
  • ignore option: Passing ignore: '[style*="display: none"]' to getByText does not work because it acts as a filter on the node itself, not its ancestors. It fails to filter out children of the hidden container.
  • toBeVisible() assertions: This helps assert state, but it does not help select the correct element when duplicates exist in the DOM (one hidden, one visible).
  • Mocking/Wrapping: Forcing <Activity> to unmount in only tests lowers test confidence by creating parity in test/prod envs

Describe the solution you'd like

I would like to request way to filter out hidden elements in non-role queries to support the display: none pattern used by React <Activity>.

Proposed API:
Extend the options for getByText (and others) to support a visibility check:

// Ignores elements that are hidden (or have hidden ancestors)
screen.getByText('Next', { ignoreHidden: true })

Metadata

Metadata

Assignees

No one assigned

    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