Giters

henninghall / react-native-date-picker

React Native Date Picker is datetime picker for Android and iOS. It includes date, time and datetime picker modes. The datepicker is customizable and is supporting different languages. It's written with native code to achieve the best possible look, feel and performance.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

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

levibuzolic opened this issue · comments

commented

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
commented

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.

commented

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

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