From c6bc7f4af86fbc540bd82c6e3b930a5cfb8a28ae Mon Sep 17 00:00:00 2001
From: Mohamed Boudra <boudra.moha@gmail.com>
Date: Tue, 5 May 2026 09:52:35 +0700
Subject: [PATCH] fix(app): add aria-checked to Switch for E2E toBeChecked()
 assertions

React Native Web does not map accessibilityState.checked to aria-checked
for role="switch", so Playwright's toBeChecked() always finds the element
unchecked. Adding aria-checked={value} directly to the Pressable sets the
attribute explicitly.

Update the switch.test.tsx mock to accept and pass through the explicit
aria-checked prop, keeping the mock faithful to the fixed component.
---
 packages/app/src/components/ui/switch.test.tsx | 4 +++-
 packages/app/src/components/ui/switch.tsx      | 1 +
 2 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/packages/app/src/components/ui/switch.test.tsx b/packages/app/src/components/ui/switch.test.tsx
index 3d448c1cd..be5bb5dad 100644
--- a/packages/app/src/components/ui/switch.test.tsx
+++ b/packages/app/src/components/ui/switch.test.tsx
@@ -32,6 +32,7 @@ vi.mock("react-native-reanimated", () => ({
 
 vi.mock("react-native", () => ({
   Pressable: ({
+    "aria-checked": ariaChecked,
     accessibilityLabel,
     accessibilityRole,
     accessibilityState,
@@ -40,6 +41,7 @@ vi.mock("react-native", () => ({
     onPress,
     testID,
   }: {
+    "aria-checked"?: boolean;
     accessibilityLabel?: string;
     accessibilityRole?: string;
     accessibilityState?: { checked?: boolean; disabled?: boolean };
@@ -51,7 +53,7 @@ vi.mock("react-native", () => ({
     React.createElement(
       "button",
       {
-        "aria-checked": accessibilityState?.checked,
+        "aria-checked": ariaChecked ?? accessibilityState?.checked,
         "aria-disabled": accessibilityState?.disabled,
         "aria-label": accessibilityLabel,
         "data-disabled": disabled,
diff --git a/packages/app/src/components/ui/switch.tsx b/packages/app/src/components/ui/switch.tsx
index 66e0738d2..67ba7e8df 100644
--- a/packages/app/src/components/ui/switch.tsx
+++ b/packages/app/src/components/ui/switch.tsx
@@ -100,6 +100,7 @@ export function Switch({
       accessibilityRole="switch"
       accessibilityState={accessibilityState}
       accessibilityLabel={accessibilityLabel}
+      aria-checked={value}
       testID={testID}
       style={pressableStyle}
     >