如何将testID和accessibilityLabel与React Native一起设置？

Question

我在为我的React本机应用程序设置testID和accessibilityLabel时遇到了一个奇怪的问题，其目的是让Appium Inspector（Appium Desktop）可以看到iOS和Android应用程序上的“accessibility id”，问题如下：

1. 如果testID是设置在一起的辅助标签，iOS的应用程序不显示"辅助ID"的组件，但android的应用程序。
2. 如果我只设置了testID，iOS应用程序正确显示组件中的可访问性ID，但对于android来说，组件中缺少可访问性ID。
3. 如果我只设置了可访问性标签，Android应用程序正确显示可访问性标识，但iOS应用程序丢失。

这是我的密码

export enum TestID {
  ImageLogo = 'ImageLogo'
}

export const LogoComponent: React.FC = () => {
  return (
    <Image
      testID={TestID.ImageLogo}
      accessibilityLabel={TestID.ImageLogo}
    />
  );
};

此外，我还尝试将可访问属性设置为false/true，但没有成功。我使用的React本机版本如下：

"react": "16.13.1",
"react-native": "0.63.2",

Answer 1

升级到React Native 0.64-它在Android上对testID有适当的支持。请注意，因为Android上的testID映射到View的resource-id，Appium要求您的testID以资源ID的规范样式格式化：

在我们的应用程序中，我们对测试ID执行以下操作：

<Text testID="test:id/hello-text">Hello</Text>

如果您正在使用wd库与appium对话，那么您可以执行以下操作：

await driver.elementById("test:id/hello-text")

Answer 2

尝试对组件使用以下testID：

export default function testID(id) {
  return Platform.OS === 'android'
    ? { accessible: true, accessibilityLabel: id }
    : { testID: id }
}

<Text {...testID('hello-text')} >hello world</Text>