如果之前有人问过这个问题,我在此提前道歉。我偶然发现了react native应用程序的detox
e2 e框架,我想尝试一下。
我试图自动化这个演示移动的应用程序在这里给出-link由于在detox
中的测试使用testID
作为定位器之一,所以我添加了一个在app/screen/LoginScreenMaterial.js
中的LoginScreenMaterial.js
文件,如下所示
<View testID="login_screen" style={{width: this._width, justifyContent: 'center'}}>
<RkCard style={styles.container}>
<View rkCardHeader style={styles.header}>
<RkText/>
<RkText style={styles.label}>Sign in into your account</RkText>
</View>
字符串
然而,即使在成功构建了应用程序之后,我还是通过以下简单的测试运行了应用程序
it('should have welcome screen', async () => {
await expect(element(by.id('login_screen'))).toBeVisible();
});
型
然而,测试仍然失败,元素无法被识别。在这个测试中我遗漏了什么?我们可以在.js
文件中显式地添加testID
吗?
编辑1:添加错误消息
1) Example
should have welcome screen:
Error: Error: Cannot find UI Element.
Exception with Assertion: {
"Assertion Criteria" : "assertWithMatcher:matcherForSufficientlyVisible(>=0.750000)",
"Element Matcher" : "(((respondsToSelector(accessibilityIdentifier) && accessibilityID('login_screen')) && !(kindOfClass('RCTScrollView'))) || (kindOfClass('UIScrollView') && ((kindOfClass('UIView') || respondsToSelector(accessibilityContainer)) && ancestorThatMatches(((respondsToSelector(accessibilityIdentifier) && accessibilityID('login_screen')) && kindOfClass('RCTScrollView'))))))",
"Recovery Suggestion" : "Check if the element exists in the UI hierarchy printed below. If it exists, adjust the matcher so that it accurately matches element."
}
Error Trace: [
{
"Description" : "Interaction cannot continue because the desired element was not found.",
"Error Domain" : "com.google.earlgrey.ElementInteractionErrorDomain",
"Error Code" : "0",
"File Name" : "GREYElementInteraction.m",
"Function Name" : "-[GREYElementInteraction matchedElementsWithTimeout:error:]",
"Line" : "124"
}
]
at Client.execute (node_modules/detox/src/client/Client.js:74:13)
型
3条答案
按热度按时间zzlelutf1#
我看了一下应用程序,并能够让它工作。
字符串
在package.json中,我还添加了
型
我跑了
detox init -r jest
然后,我能够让它识别何时呈现特定的屏幕,我通过将testID添加到ScrollView LoginScreenBlur.js(第23行)来做到这一点。
型
然后在
e2e/firstTest.spec.js
中,我将测试替换为型
这是运行
detox build && detox test
后的控制台响应型
看起来该应用程序默认启动LoginScreenBlur,所以首先测试它而不是LoginScreenMaterial是有意义的。
我注意到的一件事是,应用程序使用
RKTextInput
和RkButton
,这些不是原生组件,而是原生组件的 Package 器。这意味着你需要将testID传递给你想要拥有testID的原生组件。我不确定react-native-ui-kitten
是否支持可访问性标签,因此,如果您希望自动化文本输入和按钮点击,可能还有更多工作要做。自定义组件添加testID
参见步骤3 https://github.com/wix/detox/blob/master/docs/Introduction.WritingFirstTest.md
请注意,并非所有的React组件都支持这个prop。React Native中的大多数内置原生组件,如View,Text,TextInput,Switch,ScrollView都支持。如果您创建自己的复合组件,则必须手动将此prop传播到正确的原生组件。
有关向自定义组件添加testID的更详细说明,请访问https://github.com/wix/detox/blob/master/docs/Troubleshooting.RunningTests.md#cant-find-my-component-even-though-i-added-testid-to-its-props
简单地说,您应该按如下方式实现自定义组件。
自定义组件
型
使用自定义组件
那你应该这样用
型
搜索层次结构
如果您已经完成了上述操作,并且确定项目具有正确的testID,但测试仍然失败,则可以在视图层次结构https://github.com/wix/Detox/blob/master/docs/troubleshooting/running-tests.md#debug-view-hierarchy中搜索它
我不会完全重复上面的帖子,但步骤是
1.在模拟器中启动可调试的应用程序(而不是发布版本)
1.打开Xcode
1.将Xcode附加到应用程序的进程
1.按下“查看层次结构”按钮
1.这将打开层次结构查看器,并将显示应用的原生视图层次结构的细分。
f3temu5u2#
使用可扩展性标签将ID添加到视图元素:https://facebook.github.io/react-native/docs/accessibility.html
sqserrrh3#
实际上,这个accessibilityLabel将是你的testID,它将在你的测试工具中被识别:
字符串