如何在Detox中控制React-Native Webview？

Question

我找不到在https://github.com/wix/detox上控制React-Native Webview的方法。

还有另一个问题， 您知道如何在React-Navigatoin中按“返回”按钮吗？

如果您给出正确的答案，那么您就是个好人。

Answer 1

您无法将RN webView与排毒（iOS，Android平台的限制）进行交互。 请参考这些。 https://github.com/wix/detox/issues/136#issuecomment-306591554 https://github.com/wix/detox/issues/334#issuecomment-335802212

要在iOS中按“后退”按钮，请执行以下操作：

element(by.type('_UINavigationBarBackIndicatorView')).tap();

要在Android中按“后退”按钮，请执行以下操作：

device.pressBack()

我想成为一个好人

Answer 2

我们的团队实施的一个骇人听闻的解决方案是在Test的基础上添加一个WebView组件。

import React, { Component } from 'react'
import { View, TouchableOpacity, TextInput, Alert } from 'react-native';


export default class Test extends Component {
  constructor(props) {
    super(props);
    this.state = {
      val:"",
    };
  }
  onPress() {
    const { webView } = this.props;
    if (webView && webView.executeJavascript) {
      webView.executeJavascript(this.state.val);
    }
  }
  render() {
    return (
      <View style={{flex:0.1, flexDirection:'row'}}>
        <TextInput
          testID={"test_input"}
          onChangeText={val => this.setState({ val })}
          style={{flex:1,color:'white',backgroundColor:'#720000'}}
         />
         <TouchableOpacity
          testID={"submit_test_input"}
          onPress={this.onPress.bind(this)}
          style={{flex:0.1,backgroundColor:'red'}}
          />
      </View>
    );
  }
}

然后从排毒中运行如下所示的任意javascript：

await element(by.id('test_input')).replaceText(`
  $('#input-email').val('${USERNAME}');
  $('#input-password').val('${PASSWORD}');
  $('#login-form').submit();
`);

我们有一个自定义的webView，因此您的解决方案还需要在您的executeJavascript上实现某种WebView。

这不是最好的解决方案，但是仍然可以。