Change Accessible/Focusable Relationship to Default to (#10569)

* Alter Accessibility Protocol

* Change files

* Add YellowBox Error

* Update for View to Be Opt In

* Fix Format

* Add comments

change/react-native-windows-46b530e4-8447-414b-9761-43c03e7088da.json

@@ -0,0 +1,7 @@
+{
+  "type": "prerelease",
+  "comment": "Alter Accessibility Protocol",
+  "packageName": "react-native-windows",
+  "email": "34109996+chiaramooney@users.noreply.github.com",
+  "dependentChangeType": "patch"
+}

vnext/Microsoft.ReactNative/Views/ControlViewManager.cpp

@@ -124,10 +124,13 @@ void ControlViewManager::SetLayoutProps(
 void ControlViewManager::OnPropertiesUpdated(ShadowNodeBase *node) {
   auto control(node->GetView().as<xaml::Controls::Control>());
 
+  // If developer specifies either the accessible and focusable prop to be false
+  // remove accessibility and keyboard focus for component.
   if (IsAccessible() != IsFocusable()) {
     control.IsTabStop(false);
     xaml::Automation::AutomationProperties::SetAccessibilityView(
         control, xaml::Automation::Peers::AccessibilityView::Raw);
+    control.IsEnabled(false);
   }
 }
 

vnext/Microsoft.ReactNative/Views/ViewViewManager.cpp

@@ -477,7 +477,10 @@ void ViewViewManager::OnPropertiesUpdated(ShadowNodeBase *node) {
     // keep it around, so not adding that code (yet).
   }
 
-  bool shouldBeControl = viewShadowNode->IsFocusable();
+  // If component is focusable, it should be a ViewControl.
+  // If component is a View with accessible set to true, the component should be focusable, thus we need a ViewControl.
+  bool shouldBeControl =
+      (viewShadowNode->IsFocusable() || (viewShadowNode->IsAccessible() && !viewShadowNode->OnClick()));
   if (auto view = viewShadowNode->GetView().try_as<xaml::UIElement>()) {
     // If we have DynamicAutomationProperties, we need a ViewControl with a
     // DynamicAutomationPeer
@@ -600,10 +603,20 @@ void ViewViewManager::TryUpdateView(
   if (useControl)
     pViewShadowNode->GetControl().Content(visualRoot);
 
+  // If developer specifies either the accessible and focusable prop to be false
+  // remove accessibility and keyboard focus for component. Exception is made
+  // for case where a View with undefined onPress is specified, where
+  // component gains accessibility focus when either the accessible and focusable prop are true.
   if (useControl && pViewShadowNode->IsAccessible() != pViewShadowNode->IsFocusable()) {
-    pViewShadowNode->GetControl().IsTabStop(false);
-    xaml::Automation::AutomationProperties::SetAccessibilityView(
-        pViewShadowNode->GetControl(), xaml::Automation::Peers::AccessibilityView::Raw);
+    if (!pViewShadowNode->OnClick()) {
+      pViewShadowNode->GetControl().IsTabStop(true);
+      xaml::Automation::AutomationProperties::SetAccessibilityView(
+          pViewShadowNode->GetControl(), xaml::Automation::Peers::AccessibilityView::Content);
+    } else {
+      pViewShadowNode->GetControl().IsTabStop(false);
+      xaml::Automation::AutomationProperties::SetAccessibilityView(
+          pViewShadowNode->GetControl(), xaml::Automation::Peers::AccessibilityView::Raw);
+    }
   }
 }