jquery - How to execute jQuery from Angular e2e test scope?

Question

Is it possible to execute jQuery commands from Angular e2e scenario ?

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

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

Answer 1

ここでの問題は、AngularJs Scenario Test Runner がアプリケーションを iframe で実行することです。ランナー自体は jQuery をロードしていません。

angular シナリオの DSL を使用することをお勧めします。e2e テスト ドキュメントから:

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

指定された jQuery セレクターに一致する要素のキーと値を渡すメソッドを実行します。メソッドには、attr、prop、css のいずれかの jQuery メソッドを指定できます。ラベルはテスト出力に使用されます。

ドキュメントからは明確ではありませんが、引数を 1 つだけ指定して 'attr' メソッドを使用して、属性の値を取得することもできます。

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

focus() などの他の jQuery 機能が必要な場合は、次の方法で実行できます。

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, ...);