JSFiddle - React, Tailwind, and code Playground
by fredrik
HTML
<!doctype html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>End2end Test Runner</title>
<script src="https://raw.github.com/angular/angular-phonecat/step-10/test/lib/angular/angular-scenario.js" ng-autotest></script>
</head>
<body>
<div id="test">Hello, earth</div>
</body>
</html>
JavaScript
(function (window, angular) {
'use strict';
angular.module('ui.tools',[]).factory('tools', function () {
function getOffset(elem) {
var el = elem,
x = 0,
y = 0;
while (el && !isNaN(el.offsetLeft) && !isNaN(el.offsetTop)) {
x += el.offsetLeft - el.scrollLeft;
y += el.offsetTop - el.scrollTop;
el = el.offsetParent;
}
return {
x : x,
y : y
};
}
function getEventOffset(evt) {
var el = evt.target,
x = 0,
y = 0,
elemOffset = getOffset(el);
x = evt.clientX - elemOffset.x;
y = evt.clientY - elemOffset.y;
return {
x : x,
y : y
};
}
return {
getOffset : getOffset,
getEventOffset : getEventOffset
};
});
angular.module('ui', ['ui.tools']).factory('ui', function (tools) {
return {
tools : tools
};
});
} (window, angular));
angular.module('E2E tests', ['ui']);
angular.scenario.dsl('simulateEvent', function () {
var chain = {};
chain.doClick = function (ui) {
return this.addFutureAction("simulateEvent '" + this.label + "' doClick", function ($window, $document, done) {
console.log('UI', ui);
done();
});
};
return function (selector, label) {
this.dsl.using(selector, label);
return chain;
}
});
describe('E2E: App', function () {
it('should load ui module in to dsl', function () {
browser().navigateTo('/');
simulateEvent('a', 'Test Label').doClick();
expect(element('title').text()).toMatch('jsFiddle');
});
});