AngularJS e2e 使用 Protractor 进行测试：无法测试使用 ng-include 插入的元素

Question

我正在使用 Protractor 测试一个 AngularJS 应用程序。但是我在测试使用 ng-include 插入的代码时遇到了一些问题。

当我尝试查找使用 ng-include 插入的元素时，我收到此错误“错误：未找到使用定位器的元素：By.id”。

如果我在调试模式下运行量角器并在 ng-include 完成后检查页面，我会在 html "" 中找到它，而不是它应该存在的元素。

我使用 Karma 进行测试，但无法测试元素是否存在。然后我阅读了一些文档，它说 Protractor 更适合这个，但它接缝我遇到了同样的问题。

app.js

 $scope.setNewWindow = function () { 
       var elem = $compile('<div ng-controller="myCtrl" class="windows-frame" id="window' + windowID + '">' +
                           '<div ng-include src="\'includes/elemToInclude.html\'"></div>' +
'</div>')($scope);

$("#main").append(elem);}

test.js

it('test', function() {

    browser.executeScript("var scope = angular.element( document.querySelectorAll('#main')[0] ).scope();" +
        "scope.setNewWindow()");

    element(by.id('include_element_id')).click();
});

Answer 1

你不应该使用browser.executeScript，它不是由量角器制作的，因此不与 Angular 同步。

您宁愿使用 Protractor 内置方法使元素可见。像您的用户在您的网站上所做的那样，例如单击链接或按钮。

顺便说一句，你应该像这样用 jQuery 附加一个元素，在指令中这样做以避免同步问题。