Skip to content

Instantly share code, notes, and snippets.

@vojtajina

vojtajina/runner.html

Created January 29, 2012 20:27
Show Gist options
  • Save vojtajina/1700488 to your computer and use it in GitHub Desktop.
Save vojtajina/1700488 to your computer and use it in GitHub Desktop.
Download ZIP
Angular: Access to iframe's jQuery
Raw
runner.html
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="http://code.angularjs.org/0.10.6/angular-scenario-0.10.6.js" ng:autotest></script>
<script type="text/javascript">
angular.scenario.dsl('appElement', function() {
return function(selector, fn) {
return this.addFutureAction('element ' + selector, function($window, $document, done) {
fn.call(this, $window.angular.element(selector));
done();
});
};
});
describe('just one', function() {
beforeEach(function() {
browser().navigateTo('test-case.html');
});
it('should fire event listeners', function() {
// this works fine, because scenario runner fires the real events
// see https://github.com/vojtajina/angular.js/blob/master/src/scenario/Scenario.js#L330
element('input[address]').click();
pause();
// keypress does not work, because scenario runner patches only click|change|keydown
// and jQuery does not fire browser event
element('input[address]').query(function(elm, done) {
elm.trigger('keypress');
done();
});
pause();
// this works, as this custom dsl gives you access to app (iframe) instance of jQuery
appElement('input[address]', function(elm) {
elm.trigger('keypress');
});
});
});
</script>
<title></title>
</head>
<body>
</body>
</html>
Raw
test-case.html
<!DOCTYPE html>
<html ng-app>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="http://code.angularjs.org/0.10.6/angular-0.10.6.min.js"></script>
<script type="text/javascript">
angular.directive('address', function() {
return function(element) {
element.bind('keypress', function() {
console.log('keypress');
});
element.bind('click', function() {
console.log('click');
})
};
});
</script>
<title></title>
</head>
<body>
Testing simple directive with click + keypress listeners...
<input type="text" ng:model="data.place" address />
</body>
</html>
@philipbulley
Copy link

It seems that appElement produces the following error when run via karma with singleRun = true

TypeError
get stack: function () { [native code] }
message: "Converting circular structure to JSON"
set stack: function () { [native code] }
__proto__: Error
 angular.js:5754
(anonymous function)

However it works without error when singleRun = false. BTW I'm running karma via grunt-karma

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment