排毒 _ 无法键入字符串，因为键盘未显示在屏幕上

Question

我正在尝试使用 detox 测试我的 react-native 应用程序，等待文本输入可见并在其中键入文本。我的 spec JS 文件 如下所示：

describe('FiestTest', () => {
  beforeEach(async () => {
    await device.reloadReactNative()
  })

  it('Login to a test account', async () => {
    // LoginPage: entering phone number moving to next page
    await expect(element(by.id('LoginPage-phoneInput'))).toBeVisible()
    await element(by.id('LoginPage-phoneInput')).typeText('<someNumber>')
  })
})

我得到的错误是：

FiestTest
    1) Enter phone number and tap on button


  0 passing (15s)
  1 failing

  1) FiestTest Enter phone number and tap on button:
     Error: An action failed. Please refer to the error trace below.
Exception with Action: {
  "Action Name" : "Type '6219'",
  "Element Matcher" : "(((respondsToSelector(accessibilityIdentifier) && accessibilityID('ValidatePage-txtField')) && !(kindOfClass('RCTScrollView'))) || (kindOfClass('UIScrollView') && ((kindOfClass('UIView') || respondsToSelector(accessibilityContainer)) && ancestorThatMatches(((respondsToSelector(accessibilityIdentifier) && accessibilityID('ValidatePage-txtField')) && kindOfClass('RCTScrollView'))))))"
}

Error Trace: [
  {
    "Description" : "Failed to type string '6219', because keyboard was not shown on screen.",
    "Error Domain" : "com.google.earlgrey.ElementInteractionErrorDomain",
    "Error Code" : "2",
    "File Name" : "GREYKeyboard.m",
    "Function Name" : "+[GREYKeyboard typeString:inFirstResponder:error:]",
    "Line" : "168"
  }
]

我正在使用以下工具：

$ npm outdate
Package                                  Current          Wanted         Latest  Location
apollo-client                              1.4.0           1.9.0          1.9.0  <appName>
babel-jest                                19.0.0          19.0.0         20.0.3  <appName>
babel-plugin-module-resolver               2.7.0           2.7.1          2.7.1  <appName>
eslint                                    3.19.0          3.19.0          4.4.1  <appName>
eslint-plugin-import                       2.2.0           2.7.0          2.7.0  <appName>
eslint-plugin-node                         4.2.2           4.2.3          5.1.1  <appName>
eslint-plugin-react                       6.10.3          6.10.3          7.1.0  <appName>
eslint-plugin-react-native                 2.3.2           2.3.2          3.0.1  <appName>
graphql-tag                                2.2.1           2.4.2          2.4.2  <appName>
jest                                      19.0.2          19.0.2         20.0.4  <appName>
moment-jalaali                             0.6.1           0.6.1          0.7.0  <appName>
native-base                                2.1.4           2.3.1          2.3.1  <appName>
react                             16.0.0-alpha.6  16.0.0-alpha.6         15.6.1  <appName>
react-apollo                               1.4.2          1.4.11         1.4.11  <appName>
react-native                              0.44.0          0.44.0         0.47.1  <appName>
react-native-adjust                       4.11.3          4.11.4         4.11.4  <appName>
react-native-fcm                           6.2.3           6.2.3          8.0.0  <appName>
react-native-popup-menu                    0.7.3           0.7.5          0.8.0  <appName>
react-native-router-flux                  3.39.1          3.41.0  4.0.0-beta.16  <appName>
react-native-sentry                       0.12.9         0.12.12         0.15.1  <appName>
react-native-smart-splash-screen           2.3.3           2.3.4          2.3.4  <appName>
react-test-renderer                       15.4.2          15.4.2         15.6.1  <appName>
redux                                      3.6.0           3.7.2          3.7.2  <appName>
redux-persist                              4.6.0           4.8.3          4.8.3  <appName>

这是我的播客文件：

# Uncomment this line to define a global platform for your project
# platform :ios, '9.0'

target '<appName>' do
  # Uncomment this line if you're using Swift or would like to use dynamic frameworks
  # use_frameworks!

  # Pods for <appName>

  pod 'Firebase'
  pod 'Firebase/Core'
  pod 'Firebase/Analytics'
  pod 'Firebase/Messaging'

  pod 'Yoga', :path => '../node_modules/react-native/ReactCommon/yoga'
  pod 'React', :path => '../node_modules/react-native', :subspecs => [
    'RCTText',
    'RCTImage',
    'RCTNetwork',
    'RCTWebSocket',
  ]

  #target '<appName>-tvOSTests' do
  #  inherit! :search_paths
    # Pods for testing
  #end

  #target '<appName>Tests' do
  #  inherit! :search_paths
    # Pods for testing
  #end

end

#target '<appName>-tvOS' do
  # Uncomment this line if you're using Swift or would like to use dynamic frameworks
  # use_frameworks!

  # Pods for <appName>-tvOS

#  target '<appName>-tvOSTests' do
#    inherit! :search_paths
    # Pods for testing
#  end

#end

现在我只是使用像波纹管这样的睡眠命令，以便给我时间手动插入字符串。然而，这不应该是一个永久的解决方案...

function sleep (ms) {
return new Promise(resolve => setTimeout(resolve, ms))
}

await sleep(milliseconds)
// what needs to happen after I manually enter the code

我也在 GitHub 上的 Detox 问题中发表了评论，但想知道是否有人有同样的经历并在这里找到了解决方案。

提前感谢您的协助！

Answer 1

你应该运行

await element(by.id('LoginPage-phoneInput')).tap();

之前

await element(by.id('LoginPage-phoneInput')).typeText('<someNumber>')

Answer 2

请在此处结帐： https://github.com/wix/detox/blob/master/docs/APIRef.ActionsOnElement.md

关于 typeText() 方法

Note: Make sure hardware keyboard is disconnected. Otherwise, Detox may fail when attempting to type text.

To make sure hardware keyboard is disconnected, open the simulator from Xcode and make sure Hardware -> Keyboard -> Connect Hardware Keyboard is deselected (or press ⇧⌘K).

Answer 3

我无法让软件键盘始终如一地工作，但 .replaceText() 对我来说效果很好。 waitFor() 也很有用。

Answer 4

我尝试了这里列出的各种解决方案，但无济于事。

对我来说一直有效的是：

点击应用中的任意文本字段
模拟器 > 硬件 > 键盘 > 切换软件键盘 (⌘K)

之所以可行，是因为它会在点击文本字段元素时自动切换内置键盘，这是调用 typeText 时的强制性先决条件。

我添加了一个 pull request 来更新现已批准的文档。

排毒 _ 无法键入字符串，因为键盘未显示在屏幕上

Detox _ Failed to type string because keyboard was not shown on screen

javascript

testing

ios

react-native

detox