排毒：使用停止按钮测试 React-Native 微调器

Question

想知道有没有人遇到过类似的问题。

在我正在使用的应用程序中，我们有一个微调器显示下载内容，中间有一个停止按钮。当用户点击微调器/停止按钮时，下载意味着取消。作为参考，iOS 上的微调器/停止按钮如下所示：

我正在尝试使用 Detox 为这个功能编写一个 e2e 测试。由于动画（和下载）使线程保持运行，因此使用自动同步不起作用。我试过使用device.disableSynchronization()，但没有成功。

这是我的 e2e 测试供参考：

it('should start and then cancel a download from the <My Learning> screen', async() => {
  // setup
  await device.reloadReactNative()
  await expect(element(by.id('feed_screen'))).toBeVisible()
  await element(by.id('LearningPlan_Tab')).tap()
  await expect(element(by.id('learning-plan-screen'))).toBeVisible()
  
  // Tap the download icon, it will turn into a spinner
  await element(by.id('offline_download_c2a')).atIndex(1).tap()
  
  // Alert box appears with Cancel/Download options
  await expect(element(by.label('Download')).atIndex(1)).toBeVisible()
  await element(by.label('Download')).atIndex(1).tap()
  
  // Ideally this would work, but it doesn't (the above alert box doesn't dismiss properly)
  await device.disableSynchronization()
  await waitFor(element(by.id('download_spinner_c2a')).atIndex(0)).toBeVisible().withTimeout(5000)
  await element(by.id('download_spinner_c2a')).atIndex(0).tap()
  await device.enableSynchronization()
  await element(by.label('Cancel download')).tap()
  await expect(element(by.id('offline_download_c2a')).atIndex(1)).toBeVisible()
})

当此测试运行时，应用似乎仍在等待下载完成。有没有人知道关于测试这个的最佳方法的任何建议，或者是否有可能？

Answer 1

我找到了一种让它工作的方法，虽然它看起来很不稳定：

  it('should start and then cancel a download from the <My Learning> screen', async () => {
    //...
    await device.disableSynchronization()
    // This timeout seems to help
    await     waitFor(element(by.id('download_spinner_c2a')).atIndex(0)).toBeVisible().withTimeout(10000) 
    await element(by.id('download_spinner_c2a')).atIndex(0).tap()
    await device.enableSynchronization()
    await element(by.label('Cancel download')).tap()
    await expect(element(by.id('offline_download_c2a')).atIndex(1)).toBeVisible()
  })