[iOS] VoiceOver reads the placeholder in TextInput

[prateek0227]

Description

When setting a placeholder in the TextInput field, VoiceOver reads the placeholder text. This causes problems when an accessibilityLabel is also provided.

Expected behaviour: Placeholder should not be read by a screen reader as it is just a visual component.

Steps to reproduce

Try this sample code:

import React from 'react';
import {SafeAreaView, StyleSheet, TextInput} from 'react-native';

const TextInputExample = () => {
  const [text, onChangeText] = React.useState('');

  return (
    <SafeAreaView>
      <TextInput
      placeholder="text input"
      accessibilityLabel="text input"
        style={styles.input}
        onChangeText={onChangeText}
        value={text}
      />
    </SafeAreaView>
  );
};

const styles = StyleSheet.create({
  input: {
    height: 40,
    margin: 12,
    borderWidth: 1,
    padding: 10,
  },
});

export default TextInputExample;

React Native Version

0.74.0

Affected Platforms

Runtime - iOS

Output of npx react-native info

n/a

Stacktrace or Logs

n/a

Reproducer

https://snack.expo.dev/eiduCgHeg-d8A6PLexqp2

Screenshots and Videos

[github-actions[bot]]

:warning:	Add or Reformat Version Info
:information_source:	We could not find or parse the version number of React Native in your issue report. Please use the template, and report your version including major, minor, and patch numbers - e.g. 0.70.2

[elencho]

Can i work on this issue?

[prateek0227]

Yes, please 🙂