fix(assert_has): Fix for failure to match when a hidden text match precedes a visible one in DOM order

CHANGELOG.md

@@ -5,6 +5,10 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/).
 <!-- and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html). -->
 
+## [Unreleased]
+### Fixed
+- Fix for `assert_has(selector, text: ...)` failing when a hidden text match precedes a visible one in DOM order (#194)
+
 ## [0.15.0] 2026-06-19
 ### Added
 - `assert_screenshot/3`: visual regression testing. Commit [18353cc], [@Wigny], #181

lib/phoenix_test/playwright.ex

@@ -727,9 +727,9 @@ defmodule PhoenixTest.Playwright do
       |> Selector.and(Selector.label(opts[:label], exact: true))
       |> Selector.and(checked_selector(opts[:checked]))
       |> selector_has(selected_selector(opts[:selected]))
-      |> Selector.concat("visible=true")
       |> Selector.concat(Selector.text(opts[:text], opts))
       |> Selector.concat(Selector.value(opts[:value]))
+      |> Selector.concat("visible=true")
 
     params =
       case Map.new(opts) do

test/phoenix_test/playwright_test.exs

@@ -222,6 +222,16 @@ defmodule PhoenixTest.PlaywrightTest do
     end
   end
 
+  describe "assert_has/3 visibility" do
+    test "finds visible text when a hidden text match appears first", %{conn: conn} do
+      conn
+      |> visit("/pw/live")
+      |> assert_has("#hidden-text-repro .visible", text: "Text to find")
+      |> assert_has("#hidden-text-repro", text: "Text to find")
+      |> assert_has("#hidden-text-repro", text: "Text to find", count: 1)
+    end
+  end
+
   describe "assert_download/2" do
     test "asserts a download triggered by clicking a link", %{conn: conn} do
       conn

test/support/playwright/live.ex

@@ -37,6 +37,11 @@ defmodule PhoenixTest.Playwright.Live do
       <div id="drag-source" style="background: yellow;" draggable="true">Drag this</div>
       <div id="drag-target" style="border: 1px dashed black;" ondrop="document.getElementById('drag-status').innerHTML = 'dropped'">Drop here</div>
     </div>
+
+    <div id="hidden-text-repro">
+      <span style="display: none">Text to find</span>
+      <span class="visible">Text to find</span>
+    </div>
     """
   end