jquery - 如何从 Angular e2e 测试范围执行 jQuery？

Question

是否可以从 Angular e2e 场景执行 jQuery 命令？

例如，如果我想执行:$('.picker-col-id-id').attr('class');我收到错误:

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

Answer 1

这里的问题是 AngularJs 场景测试运行器在 iframe 中运行您的应用程序。运行器本身尚未加载 jQuery。

最好使用 Angular 场景 dsl。来自 e2e testing docs :

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

Executes the method passing in key and value on the element matching the given jQuery selector, where method can be any of the following jQuery methods: attr, prop, css. The label is used for test output.

尽管文档中没有明确说明，您也可以使用只有 1 个参数的“attr”方法来获取属性的值。

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

如果您需要其他 jQuery 功能，例如 focus()，您可以这样做:

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

或者扩展 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));
        });
    };
});

并以这种方式使用它:

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

或者一般来说:

jQueryFunction(selector, jQueryFunctionName, arg1, arg2, ...);