使用选择(名称).选项在Angular E2E测试中

Using select(name).options in Angular E2E test

本文关键字:Angular E2E 测试 选项 选择 名称      更新时间:2023-09-26

我有一个多值选择器,我正试图为其编写一个端到端测试。使用select(name).option工作正常,但当我尝试使用select(name).options选择多个值时,它不起作用。

我试着把一些代码放在一起来演示,但是不能让它工作。

HTML:

<html lang="en">
   <head>
      <title>End2end Test Runner</title>
      <script src="http://code.angularjs.org/1.0.1/angular-scenario-1.0.1.js"
      ng-autotest>
      </script>
   </head>
   <body ng-app="MyApp">
      <div ng-controller="MyAppCtrl">
         {{model.exampleValue}}
         <select id="a_selector"                 
            ng-model="model.selectedItems"
            ng-options="item.name for item in model.items"
            multiple="multiple">
         </select>
      </div>
   </body>
Javascript:

var app = angular.module('MyApp', ['ngResource'])
app.controller('MyAppCtrl', function($scope) {         
     $scope.model = {};
     $scope.model.exampleValue="an example value";
     $scope.model.items = [{"name": "Product1"}, {"name": "Product2"}];
});
app.config(['$routeProvider', function ($routeProvider, $scope) {
  $routeProvider.when('/', {controller:MyAppCtrl});
}]);
describe('my app', function() { 
  it('should display the home page', function() {                  
    browser().navigateTo('/');
    // this should work (when I can fix this code!)
    select("model.selectedItems").option("Product1");
    expect(element("#a_selector option:selected").count()).toEqual(1)
    // this doesn't, nothing is selected
    select("model.selectedItems").options("Product1", "Product2");
    expect(element("#a_selector option:selected").count()).toEqual(2)
  });
});

select("model.selectedItems").option("Product1");

失败,错误信息:

Selector select[ng':model="model.selectedItems"] did not match any elements.

如果有人能(1)帮助我确定为什么上面的代码不工作,(2)帮助我理解为什么select(name).options不工作,我将不胜感激。(我知道我可以使用其他技术来实现同样的事情,但是生产代码中真正的select也有一个ng-change属性,当我尝试变通方法时不会触发)。

谢谢,

格雷姆路德维希。

我仍在试图找出select(name).option()不工作的原因,但我可以通过以下修改获得您的示例:

  1. 在angular-scenario.js之前包含angular.js
  2. 去掉ngResource依赖项——你在这里不需要它
  3. <span>{{model.selectedItems}}</span>放在你的<select>标签之后,看看你选择了什么。

一旦我弄清楚第二部分,我会更新的。

select("model.selectedItems").option("Product1");不应该是select("#a_selector").option("Product1");吗?