如何使用selenium测试Reactjs Web应用程序?
我有一个使用React的网络应用程序,我正在尝试使用Selenium
RC创建一些测试。我发现,当Selenium更改字段的值时,不会正确触发事件。我知道这是一个典型的问题,正如WebDriver常见问题所证明的那样,我已经尝试了很多不同的事情,例如使用onFocus而不是onChange并使用sendKeys()和type()确保焦点进出,以编程方式调用该事件以及我可以在网上找到的任何其他建议,但是我无法使其正常运行。
作为我要尝试做的一个简单示例,我删除了注释框的react示例。我所拥有的是一个textarea输入框和一个div,应该使用textarea的值进行更新。Selenium可以更新文本区域,但是当它完成时,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获得代码
必须有某种方法可以使这项工作!
回答:
在React TestUtils插件中尝试模拟:
React.addons.TestUtils.Simulate.change(document.getElementById('your-id-here'))
参见http://facebook.github.io/react/docs/test-
utils.html#simulate
它还要求您切换到包含插件的React文件:
“要获取附加组件,请使用react-with-addons.js(及其最小化的对应文件),而不要使用常见的react.js。” —
http://facebook.github.io/react/docs/addons.html
以上是 如何使用selenium测试Reactjs Web应用程序? 的全部内容, 来源链接: utcz.com/qa/428267.html