IT技术 - 你如何使用 selenium 测试 reactjs 网络应用程序？ - 吾爱随笔录

我有一个使用 React 的网络应用程序，我正在尝试使用 Selenium RC 创建一些测试。我发现当 Selenium 更改字段的值时，不会正确触发事件。我知道这是一个有点典型的问题，正如WebDriver FAQ所证明的那样，我已经尝试了很多不同的事情，比如使用 onFocus 而不是 onChange 并确保焦点改变了，使用 sendKeys() 与 type()，以编程方式调用该事件，以及我可以在网上找到的任何其他建议，但我无法使其正常工作。

作为我正在尝试做的一个简单示例，我删除了评论框react示例。我拥有的是一个 textarea 输入框和一个应该使用 textarea 值更新的 div。Selenium 可以更新 textarea，但是当它更新时，div 不会改变。

这是我的 reactjs 代码：

/** @jsx React.DOM */

var MarkdownEditor = React.createClass({
  getInitialState: function() {
    return {value: 'Original Text'};
  },
  handleChange: function() {
    this.setState({value: this.refs.textarea.getDOMNode().value});
  },
  render: function() {
    return (
      <div className="MarkdownEditor">
        <h3>Input</h3>
        <textarea
          onChange={this.handleChange}
          ref="textarea"
          defaultValue={this.state.value} />
        <h3>Output</h3>
        <div
          className="content"
          id="content2",
          dangerouslySetInnerHTML={{
            __html: this.state.value
          }}
        />
      </div>
    );
  }
});

React.renderComponent(<MarkdownEditor />, document.getElementById('content'));

这是我当前的 Selenium 测试用例：

import com.thoughtworks.selenium.*;
import org.junit.After;
import org.junit.Before;
import org.junit.Test;
import static org.junit.Assert.*;
import java.util.regex.Pattern;
import java.util.Properties;
import junit.framework.TestCase;

public class textTest extends TestCase {

    protected Selenium selenium;

    @Before
    public void setUp() throws Exception {
        Properties sysProps = System.getProperties();
        String browser = sysProps.getProperty("browser.property");
        selenium = new DefaultSelenium("localhost", 4444, "*chrome", "http://localhost/");
        selenium.start();
    }

    @After
    public void tearDown() throws Exception {
        selenium.stop();
    }

    @Test
    public void testText() throws Exception {
        selenium.open("/reactTest/index.html");
        assertEquals("Original Text", selenium.getText("id=content2"));
        selenium.focus("id=content2");
        selenium.type("css=textarea[value=\"Original Text\"]", "xxxxx");
        selenium.focus("id=content");
        selenium.runScript("$('#tatest').trigger('change')");
        assertEquals("xxxxxOriginal Text", selenium.getText("id=content2"));
        Thread.sleep(80000);
    }

}

编辑：代码现在可在https://github.com/ilionblaze/reactTest 获得

必须有某种方法可以使这项工作！