All geek questions in one place

How to execute jQuery from Angular e2e testing area?

Is it possible to execute jQuery commands from an Angular e2e script?

for example, if I would like to execute: $('.picker-col-id-id').attr('class'); I get an error message:

TypeError: property '$' of object [object Object] is not a function

+2
source share
2 answers

The problem is that the Runner Runner Scenario Runner runs your application in an iframe. The runner himself did not load jQuery.

It is best to use the angular dsl script. From e2e docs :

(selector, label). {method} (key, value)

Executes a method that passes the key and value for matching an element with a given jQuery selector, where the method can be any of the following jQuery methods: attr, prop, css. The label is used for test output.

Although this is not clear from the docs, you can also use the attr method with 1 argument to get the attribute value.

 element('.picker-col-id-id').attr('class');

If you need other jQuery functions like focus (), you can do it like this:

 element('.picker-col-id-id').query(function(elements, done) { elements.focus(); done(); });

Or expand angular dsl

 angular.scenario.dsl('jQueryFunction', function() { return function(selector, functionName /*, args */) { var args = Array.prototype.slice.call(arguments, 2); return this.addFutureAction(functionName, function($window, $document, done) { var $ = $window.$; // jQuery inside the iframe var elem = $(selector); if (!elem.length) { return done('Selector ' + selector + ' did not match any elements.'); } done(null, elem[functionName].apply(elem, args)); }); }; });

And use it like this:

 jQueryFunction('.picker-col-id-id', 'focus');

Or even:

 jQueryFunction(selector, jQueryFunctionName, arg1, arg2, ...);
+11
source

As mentioned in the comments, it seems that jQuery is missing. You will need to add it either to the karma configuration file, or directly to runner.html.

If you want to add it to your karma configuration file, add a files entry to add a jQuery link, for example,

 files = [ ANGULAR_SCENARIO, ANGULAR_SCENARIO_ADAPTER, 'app/components/jquery/jquery.js', // <== This should point to jQuery 'test/e2e/**/*.js' ];

Alternatively, if you run e2e tests from runner.html , you can load them there, after angular and before your script, for example:

 <!doctype html> <html lang="en"> <head> <title>End2end Test Runner</title> <script src="../lib/angular/angular-scenario.js" ng-autotest></script> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script src="scenarios.js"></script> </head> <body> </body> </html>
+1
source

Source: https://habr.com/ru/post/952137/

More articles:


All Articles