如何使用量角器访问ng-grid元素?
发布时间:2020-12-17 10:22:12 所属栏目:安全 来源:网络整理
导读:我想为使用ng-grid的页面编写量角器测试. 我没有看到有关如何做到这一点的任何文档.在我的页面上,我看到一个包含数据的网格,html看起来像这样: div class="gridStyle" ng-grid="tenantsGridOptions" ng-if="tenantsGridOptions != undefined" /div 如何从量
我想为使用ng-grid的页面编写量角器测试.
我没有看到有关如何做到这一点的任何文档.在我的页面上,我看到一个包含数据的网格,html看起来像这样: <div class="gridStyle" ng-grid="tenantsGridOptions" ng-if="tenantsGridOptions != undefined" > </div> 如何从量角器中找到此网格上的元素?
考虑以下控制器:
var app = angular.module('angularE2EExamples'); app.controller('GridCustomersController',function ($scope,$http) { $scope.customers = [{id: 1,name: 'Lissa Montrose',email: 'lissa@company.com',city: 'Washington',comment: ''},{id: 2,name: 'Karri Lanze',email: 'karri@company.com',city: 'Dallas',{id: 3,name: 'Michael Smith',email: 'michael@company.com',city: 'Berkeley',{id: 4,name: 'Fred Tyler',email: 'fred@company.com',comment: ''} ]; $scope.gridCustomers = { data: 'customers',columnDefs: [{field: 'id',displayName: 'Id',width: 30},{field: 'name',displayName: 'Name'},{field: 'email',displayName: 'Email'},{field: 'city',displayName: 'City'},{field: 'comment',displayName: 'Comment',cellTemplate: '<input class="form-control input-sm" type="text" ng-input="COL_FIELD" ng-model="row.entity.comment" />'} ],enableCellSelection: true,enableRowSelection: false,enableCellEdit: true,enableColumnResize: true,enableColumnReordering: true,multiSelect: false,width: 'auto' }; }); 并遵循H??TML: <div ng-controller="GridCustomersController"> <div class="gridStyle" ng-grid="gridCustomers" style="height: 200px"> </div> </div> 访问ng-grid组件内部不同元素的一种非常有用的方法是使用by.binding(‘row.entity.< field>‘),其中’field’是数据模型的关键字.您需要按如下方式定义测试用例: describe('Customer test cases.',function() { it('Should iterate all grid elements',function(){ browser.get('http://localhost:9000/customers'); element.all(by.binding('row.entity.id')).each(function(cell){ browser.sleep(500); cell.click(); cell.getText().then(function(text){ console.log('Id: ' + text); }); }); element.all(by.binding('row.entity.name')).each(function(cell){ browser.sleep(500); cell.click(); cell.getText().then(function(name){ console.log('Name: ' + name); }); }); element.all(by.model('row.entity.comment')).each(function(cell){ browser.sleep(500); cell.click(); cell.sendKeys('New customer.'); }); browser.sleep(2000); }); }); 在Plunker中找到的控制器和HTML内容的源代码 在此示例中,我为最后一列定义了自定义模板.因此,我使用by.model(‘row.entity.< field>‘)来访问相应的元素. 可在this Git repository获得给定e2e测试的完整可运行示例. 希望能帮助到你. (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |