React Native iOS UITest：Xcode Inspector无法识别testID属性求助

排查与修复步骤： #

1. 验证testID是否渲染到DOM
   用Safari调试WKWebView中的页面，查看TextInput对应的DOM元素是否存在data-testid="fullNameTextField"属性。如果没有，说明自定义TextInput组件没有正确传递testID props到底层web输入元素，需要在组件内部将testID映射为data-testid属性，示例：

   const TextInput = ({ testID, accessibilityLabel, ...props }) => {
     return (
       <input
         data-testid={testID}
         aria-label={accessibilityLabel}
         {...props}
       />
     );
   };
   

2. 移除父元素的accessible={false}设置
   你给父div设置的accessible={false}，在React Native for Web中会对应DOM元素的aria-hidden="true"属性，导致子元素的无障碍属性被iOS忽略。直接删除该属性，确保子元素的无障碍标识能被正常识别。

3. 通过WKUserScript映射web属性到iOS无障碍标识
   WKWebView默认不会将web元素的data-testid转换为iOS的Accessibility Identifier，需要注入JS脚本将data-testid赋值给aria-label（iOS会识别aria-label作为无障碍标识）。在iOS端添加如下配置：

   // 创建脚本，将所有带data-testid的元素设置aria-label
   let scriptSource = """
   document.addEventListener('DOMContentLoaded', function() {
     const elements = document.querySelectorAll('[data-testid]');
     elements.forEach(element => {
       element.setAttribute('aria-label', element.getAttribute('data-testid'));
     });
   });
   """
   // 注入到WKWebView
   let userScript = WKUserScript(source: scriptSource, injectionTime: .atDocumentEnd, forMainFrameOnly: true)
   let config = WKWebViewConfiguration()
   config.userContentController.addUserScript(userScript)
   let webView = WKWebView(frame: .zero, configuration: config)
   

4. 确认React Native for Web版本支持testID
   若使用的RN Web版本过旧，可能不支持testID自动映射为data-testid，建议升级到较新版本（v0.13及以上通常支持）。

内容的提问来源于stack exchange，提问作者Glow