defmodule MvWeb.MemberLive.IndexCustomFieldsAccessibilityTest do
  @moduledoc """
  Accessibility tests for custom field columns in the member overview.

  Tests cover:
  - SortHeaderComponent for custom fields has correct ARIA labels
  - Tab navigation works for custom field columns
  - Screen reader announcements for sorting
  """
  use MvWeb.ConnCase, async: true
  import Phoenix.LiveViewTest
  require Ash.Query

  alias Mv.Membership.{CustomField, CustomFieldValue}

  setup do
    system_actor = Mv.Helpers.SystemActor.get_system_actor()

    # Create test member
    {:ok, member} =
      Mv.Membership.create_member(
        %{first_name: "Alice", last_name: "Anderson", email: "alice@example.com"},
        actor: system_actor
      )

    # Create custom field with show_in_overview: true
    {:ok, field} =
      CustomField
      |> Ash.Changeset.for_create(:create, %{
        name: "membership_number",
        value_type: :string,
        show_in_overview: true
      })
      |> Ash.create(actor: system_actor)

    # Create custom field value
    {:ok, _cfv} =
      CustomFieldValue
      |> Ash.Changeset.for_create(:create, %{
        member_id: member.id,
        custom_field_id: field.id,
        value: %{"_union_type" => "string", "_union_value" => "A001"}
      })
      |> Ash.create(actor: system_actor)

    %{member: member, field: field}
  end

  test "sort header component for custom fields has correct ARIA labels", %{
    conn: conn,
    field: field
  } do
    conn = conn_with_oidc_user(conn)
    {:ok, view, _html} = live(conn, "/members")

    # 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", %{
    conn: conn,
    field: field
  } do
    conn = conn_with_oidc_user(conn)

    {:ok, view, _html} =
      live(conn, "/members?query=&sort_field=custom_field_#{field.id}&sort_order=asc")

    # 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", %{
    conn: conn,
    field: field
  } do
    conn = conn_with_oidc_user(conn)

    {:ok, view, _html} =
      live(conn, "/members?query=&sort_field=custom_field_#{field.id}&sort_order=desc")

    # 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")

    # Check that the sort button is a button element (keyboard accessible)
    test_id = "custom_field_#{field.id}"
    assert has_element?(view, "button[data-testid='#{test_id}']")

    # Button should not have tabindex="-1" (which would remove from tab order)
    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
    conn = conn_with_oidc_user(conn)
    {:ok, _view, html} = live(conn, "/members")

    # Check that custom field name is displayed in the header
    assert html =~ field.name
  end
end
