[5.0.0] Android picker no longer accessible via TalkBack or Appium

[levibuzolic]

Upgrading from 4.4.2 to 5.0.0 results in the picker no longer being accessible to TalkBack or Appium. This prevents native tests from being able to exercise this component and vision impared users being able to interact with it.

I'm currently looking through the diff between 4.4.2 and 5.0.0 to see if I can work out what's changed to stop these elements from being exposed, but figured I'd report this while I investigate.

With the following code:

<DatePicker
  androidVariant="nativeAndroid"
  testID="date-picker"
  mode="datetime"
  date={new Date()}
/>

4.4.2

On version 4.4.2 while using androidVariant="nativeAndroid" the following accessibility tree is produced:

<android.widget.RelativeLayout index="0" class="android.widget.RelativeLayout" resource-id="date-picker">
  <android.widget.LinearLayout index="0" class="android.widget.LinearLayout">
    <android.widget.LinearLayout index="0" class="android.widget.LinearLayout" resource-id="appId:id/container">
      <android.widget.LinearLayout index="0" class="android.widget.LinearLayout" resource-id="appId:id/pickerWrapper">
        <android.widget.NumberPicker index="0" class="android.widget.NumberPicker" long-scrollable="true">
          <android.widget.EditText index="0" class="android.widget.EditText" text="Today" resource-id="android:id/numberpicker_input" clickable="true" focusable="true"/>
          <android.widget.Button index="1" class="android.widget.Button" text="Fri Apr 5" clickable="true"/>
        </android.widget.NumberPicker>
        <android.widget.NumberPicker index="1" class="android.widget.NumberPicker" long-scrollable="true">
          <android.widget.Button index="0" class="android.widget.Button" text=" 8 " clickable="true"/>
          <android.widget.EditText index="1" class="android.widget.EditText" text=" 9 " resource-id="android:id/numberpicker_input" clickable="true" focusable="true"/>
          <android.widget.Button index="2" class="android.widget.Button" text="10" clickable="true"/>
        </android.widget.NumberPicker>
        <android.widget.NumberPicker index="2" class="android.widget.NumberPicker" long-scrollable="true">
          <android.widget.Button index="0" class="android.widget.Button" text="49" clickable="true"/>
          <android.widget.EditText index="1" class="android.widget.EditText" text="50" resource-id="android:id/numberpicker_input" clickable="true" focusable="true"/>
          <android.widget.Button index="2" class="android.widget.Button" text="51" clickable="true"/>
        </android.widget.NumberPicker>
        <android.widget.NumberPicker index="3" class="android.widget.NumberPicker" long-scrollable="true">
          <android.widget.Button index="0" class="android.widget.Button" text=" AM " clickable="true"/>
          <android.widget.EditText index="1" class="android.widget.EditText" text=" PM " resource-id="android:id/numberpicker_input" clickable="true" focusable="true"/>
        </android.widget.NumberPicker>
      </android.widget.LinearLayout>
    </android.widget.LinearLayout>
  </android.widget.LinearLayout>
</android.widget.RelativeLayout>

5.0.0

<android.widget.RelativeLayout index="0" class="android.widget.RelativeLayout" resource-id="date-picker" long-scrollable="true">
  <android.widget.LinearLayout index="0" class="android.widget.LinearLayout" long-scrollable="true">
    <android.widget.LinearLayout index="0" class="android.widget.LinearLayout" resource-id="appId:id/container" long-scrollable="true">
      <android.widget.LinearLayout index="0" class="android.widget.LinearLayout" resource-id="appId:id/pickerWrapper" long-scrollable="true"/>
    </android.widget.LinearLayout>
  </android.widget.LinearLayout>
</android.widget.RelativeLayout>

In the above you can see that pickerWrapper is the final element exposed with none of the android.widget.NumberPicker made available.

System:

• OS: Android
• React Native version 0.73.5
• react-native-date-picker version 5.0.0

[levibuzolic]

Testing the library on a physical Android device, it looks like there has been some accessibility regressions which are probably related. I'm able to focus the currently selected values, but cannot edit them, while on 4.4.2 I can select both the before and after element in each wheel, then click to select that value.

[levibuzolic]

I've narrowed it down to the commented out info.setVisibleToUser calls that were applied by the NumberPicker.patch:

• react-native-date-picker/android/src/main/java/com/henninghall/date_picker/generated/NumberPicker.java

  Line 2743 in 2d69bcd

  // info.setVisibleToUser(isVisibleToUser(boundsInParent));

• react-native-date-picker/android/src/main/java/com/henninghall/date_picker/generated/NumberPicker.java

  Line 2767 in 2d69bcd

  // info.setVisibleToUser(isVisibleToUser(boundsInParent));

• react-native-date-picker/android/src/main/java/com/henninghall/date_picker/generated/NumberPicker.java

  Line 2816 in 2d69bcd

  // info.setVisibleToUser(isVisibleToUser());

Manually updating these to info.setVisibleToUser(true) fixes the issue, though I imagine we'd probably want to restore the original isVisibleToUser() behaviour.