排毒，转换中的按钮匹配多个元素答案

【问题标题】：Detox, multiple elements were matched for button in transition排毒，转换中的按钮匹配多个元素
【发布时间】：2019-03-10 22:24:18
【问题描述】：

我正在使用 detox e2e 为我的 react-native 应用程序创建测试用例。长话短说，我在组件的渲染函数中有一个按钮，该按钮从左到右转换。我为该按钮提供了一个唯一的测试 ID。在我的测试用例中，我希望该按钮使用其测试 ID 出现。但是当我运行“排毒测试”时，测试失败并且错误表明多个元素与该测试 id 匹配。

我的测试文件的代码是：

describe('Login flow', () => {
    // test case for wallet generation

    it('should generate new wallet', async () => {
        await expect(element(by.id('WelcomeScreen'))).toBeVisible()
        await expect(element(by.id('WelcomeScreenCreateWalletButton'))).toBeVisible() 
    }) 
})

我的按钮在渲染函数中的代码是：

<Transition appear="horizontal">
          <View style={styles.buttonContainer}>
            <Button
              text={I18n.t('create-wallet')}
              onPress={this.createWallet}
              style={[styles.button, styles.topButton]}
              testID="WelcomeScreenCreateWalletButton"
            />

            <Button
              text={I18n.t('restore-wallet')}
              transparent
              onPress={this.restoreWallet}
              style={styles.button}
              shared={'button'}
              testID="WelcomeScreenRestoreWalletButton"
            />
          </View>
        </Transition>

在我的测试用例中，我期待带有 testid“WelcomeScreenCreateWalletButton”的按钮可见。如果我从组件的渲染函数中删除转换标签，则测试成功运行并通过。所以显然按钮的转换存在一些问题。我读过 detox 的空闲状态同步处理动画问题。我不知道我错过了什么：/。

【问题讨论】：

标签： javascript react-native jestjs detox

【解决方案1】：

因此，显然这个特殊问题是由 react-native-fluid-navigation 引入的，它通过复制项目进行转换。我用它来实现从左到右的按钮转换。简单的解决方案是使用第二个项目并对其执行操作。有效的代码如下：

describe('Login flow', () => {
// test case for wallet generation

    it('should generate new wallet', async () => {
        await expect(element(by.id('WelcomeScreen'))).toBeVisible()
        await expect(element(by.id('WelcomeScreenCreateWalletButton')).atIndex(1)).toBeVisible() 
    }) 
})

仅添加 atIndex(1) 即可解决问题。

【讨论】：

救命稻草！谢谢。