From 1df1b4b2387996acae1eeba449de0d9ebb83c906 Mon Sep 17 00:00:00 2001
From: Moritz <moritz.m@local-it.org>
Date: Tue, 16 Dec 2025 14:55:50 +0100
Subject: [PATCH] test: use data-testids instead of regex in a11y tests

Replace regex-based aria-label assertions with data-testid-based
has_element? checks for more stable tests that are resistant to
translation changes.
---
 ...index_custom_fields_accessibility_test.exs | 39 +++++++------------
 1 file changed, 14 insertions(+), 25 deletions(-)

diff --git a/test/mv_web/member_live/index_custom_fields_accessibility_test.exs b/test/mv_web/member_live/index_custom_fields_accessibility_test.exs
index 252de17..149d441 100644
--- a/test/mv_web/member_live/index_custom_fields_accessibility_test.exs
+++ b/test/mv_web/member_live/index_custom_fields_accessibility_test.exs
@@ -52,14 +52,11 @@ defmodule MvWeb.MemberLive.IndexCustomFieldsAccessibilityTest do
     field: field
   } do
     conn = conn_with_oidc_user(conn)
-    {:ok, _view, html} = live(conn, "/members")
+    {:ok, view, _html} = live(conn, "/members")
 
-    # Check that the sort button has aria-label
-    assert html =~ ~r/aria-label=["']Click to sort["']/i or
-             html =~ ~r/aria-label=["'].*sort.*["']/i
-
-    # Check that data-testid is present for testing
-    assert html =~ ~r/data-testid=["']custom_field_#{field.id}["']/
+    # Check that the sort button has aria-label and data-testid
+    test_id = "custom_field_#{field.id}"
+    assert has_element?(view, "[data-testid='#{test_id}'][aria-label='Click to sort']")
   end
 
   test "sort header component shows correct ARIA label when sorted ascending", %{
@@ -71,10 +68,9 @@ defmodule MvWeb.MemberLive.IndexCustomFieldsAccessibilityTest do
     {:ok, view, _html} =
       live(conn, "/members?query=&sort_field=custom_field_#{field.id}&sort_order=asc")
 
-    html = render(view)
-
-    # Check that aria-label indicates ascending sort
-    assert html =~ ~r/aria-label=["'].*ascending.*["']/i
+    # Check that aria-label indicates ascending sort using data-testid
+    test_id = "custom_field_#{field.id}"
+    assert has_element?(view, "[data-testid='#{test_id}'][aria-label='ascending']")
   end
 
   test "sort header component shows correct ARIA label when sorted descending", %{
@@ -86,28 +82,21 @@ defmodule MvWeb.MemberLive.IndexCustomFieldsAccessibilityTest do
     {:ok, view, _html} =
       live(conn, "/members?query=&sort_field=custom_field_#{field.id}&sort_order=desc")
 
-    html = render(view)
-
-    # Check that aria-label indicates descending sort
-    assert html =~ ~r/aria-label=["'].*descending.*["']/i
+    # Check that aria-label indicates descending sort using data-testid
+    test_id = "custom_field_#{field.id}"
+    assert has_element?(view, "[data-testid='#{test_id}'][aria-label='descending']")
   end
 
   test "custom field column header is keyboard accessible", %{conn: conn, field: field} do
     conn = conn_with_oidc_user(conn)
-    {:ok, _view, html} = live(conn, "/members")
+    {:ok, view, _html} = live(conn, "/members")
 
     # Check that the sort button is a button element (keyboard accessible)
-    assert html =~ ~r/<button[^>]*data-testid=["']custom_field_#{field.id}["']/
+    test_id = "custom_field_#{field.id}"
+    assert has_element?(view, "button[data-testid='#{test_id}']")
 
-    # Extract the button element for the custom field and check it doesn't have tabindex="-1"
-    button_match =
-      Regex.run(~r/<button[^>]*data-testid=["']custom_field_#{field.id}["'][^>]*>/, html)
-
-    assert button_match != nil, "Button with data-testid='custom_field_#{field.id}' not found"
-
-    button_html = List.first(button_match)
     # Button should not have tabindex="-1" (which would remove from tab order)
-    refute button_html =~ ~r/tabindex=["']-1["']/
+    refute has_element?(view, "button[data-testid='#{test_id}'][tabindex='-1']")
   end
 
   test "custom field column header has proper semantic structure", %{conn: conn, field: field} do