webapp.js.app.jsx Maven / Gradle / Ivy
Go to download
Show more of this group Show more artifacts with this name
Show all versions of testcasegenerator Show documentation
Show all versions of testcasegenerator Show documentation
Generates test cases from the crawl session.
The newest version!
var ReactDOM = require("react-dom");
var React = require("react");
function loadJSON(callback) {
var xobj = new XMLHttpRequest();
xobj.overrideMimeType("application/json");
xobj.open('GET', './diffs/report.json', true); // Replace 'my_data' with the path to your file
xobj.onreadystatechange = function () {
if (xobj.readyState == 4 && xobj.status == "200") {
// Required use of an anonymous callback as .open will NOT return a value but simply returns undefined in asynchronous mode
callback(xobj.response);
}
};
xobj.send(null);
}
var State = React.createClass({
componentDidMount: function() {
console.log(this.refs.iframe.contentWindow);
this.refs.iframe.addEventListener("load", (function(e) {
console.log(e);
e.target.contentWindow.onscroll = this.props.handleScroll;
console.log(e.target.contentWindow);
}).bind(this));
},
render: function() {
return
}
});
var Eventable = function(props) {
var event = props.eventResult.eventable;
return (
Event Info
ID
Event type
XPath
Form inputs
Related frame
Success
{event.id}
{event.eventType}
{event.identification.value}
{event.relatedFormInputs.toString() || "None"}
{event.relatedFrame || "Root frame"}
{props.eventResult.success ? "true" : "false"}
)
}
var StateInfo = function(props) {
var state = props.state;
return (
State Info
ID
URL
Success
Identical
{state.id}
{state.url}
{state.success ? "true" : "false"}
{state.identical ? "true" : "false"}
)
}
var Selector = React.createClass({
handleChange: function(event) {
this.props.updatePath(event.target.value);
},
render: function() {
return (
)
}
});
var StateNavigator = React.createClass({
handleClick: function(idx) {
this.props.updateState(idx);
},
render: function() {
var stateList = [];
for(var i = 0; i < this.props.states; i++) {
if(i == this.props.currState) {
stateList.push({i});
} else {
stateList.push({i});
}
}
return (
)
}
})
var StateDisplay = React.createClass({
getInitialState: function() {
return {
visual: true
}
},
render: function() {
if(this.props.noChange) return No differences to show
return (
Diff display:
Visual
Raw HTML
)
},
setHTML: function(e) {
this.setState({
visual: e.target.value === "visual"
});
},
handleScroll: function handleScroll(source, e) {
handleScroll.called = handleScroll.called || false;
if(handleScroll.called) {
handleScroll.called = false;
return;
}
if(this.state.visual) return;
var frames = document.getElementsByTagName("iframe");
if(source == 1) {
frames[1].contentWindow.scroll(frames[1].contentWindow.pageXOffset, frames[0].contentWindow.pageYOffset);
} else {
frames[0].contentWindow.scroll(frames[0].contentWindow.pageXOffset, frames[1].contentWindow.pageYOffset);
}
handleScroll.called = true;
}
})
var App = React.createClass({
getInitialState: function() {
return {
report: [],
pathIdx: 0,
stateIdx: 0
}
},
componentDidMount: function() {
loadJSON(function(result) {
this.setState({
report: JSON.parse(result)
});
}.bind(this));
},
render: function() {
if(this.state.report.length == 0) {
return ();
}
var nextEventable, stateDisplay;
var currPath = this.state.report[this.state.pathIdx];
var stateIdx = this.state.stateIdx;
var currState = currPath.crawlStates[stateIdx];
if(stateIdx < currPath.crawlPath.length) {
nextEventable = ;
}
var goToPrevState, goToNextState;
if(stateIdx > 0) {
goToPrevState = Prev. state
} else {
goToPrevState = Prev. state
}
if(stateIdx < currPath.crawlStates.length - 1) {
goToNextState = Next state
} else {
goToNextState = Next state
}
var stateId = currState.id;
return (
{nextEventable || (currPath.crawlPath.length == 0 ? No events fired in this crawl path
: End of crawl path
)}
);
},
handleGoToPrevState: function() {
this.setState({
stateIdx: this.state.stateIdx - 1
});
},
handleGoToNextState: function() {
this.setState({
stateIdx: this.state.stateIdx + 1
});
},
handleSetCrawlState: function(newStateIdx) {
this.setState({
stateIdx: newStateIdx
})
},
updatePath: function(newPathIdx) {
this.setState({
pathIdx: newPathIdx,
stateIdx: 0
});
}
});
ReactDOM.render( , document.getElementById("report"));