Angular 1/ui-select/Jasmine - 测试元素是否存在于ng中 - 如果

我想测试ng-if中没有ng的输入是否存在 - 如果测试完全通过但不与ng-if通过。Angular 1/ui-select/Jasmine - 测试元素是否存在于ng中 - 如果

在我的模板，我有：

<div ng-if="$ctrl.doShowAir"> 
    <input class="form-control" type="text"> 
    </div>

的doShowAir是一个功能doShow()内的变量在以前的UI选选择的选择，当它应该是true

<ui-select ng-model="$ctrl.parking.parkingType" 
      on-select="$ctrl.doShow()"> 
    <ui-select-match> 
     <span>{{ $select.selected.label }}</span> 
    </ui-select-match> 
    <ui-select-choices repeat="item in $ctrl.projectReferences.parkingType | filter: { label: $select.search }"> 
     <span ng-bind-html="item.label"></span> 
    </ui-select-choices> 
    </ui-select>

功能：

doShow() { 
    this.doShowAir = (this.parkingType.labelKey === 'parking_type.air') 
    }

而uni t检验：

import angular from 'angular' 
import 'angular-mocks' 

let scope 
let rootScope 
let compile 
let htmlElement 
let ctrl 

fdescribe('projectExteriorParking',() => { 
    beforeEach(() => { 
    angular.mock.module('ProjectExteriorParkingModule') 
    angular.mock.module('ui.select') 
    }) 

    beforeEach(inject((_$compile_, _$rootScope_) => { 
    rootScope = _$rootScope_ 
    compile = _$compile_ 
    scope = rootScope.$new() 
    scope.parking = {} 
    htmlElement = compile(`<project-exterior-parking parking="project.realEstateProjectProduct.parkings"></project-exterior-parking>`)(scope) 
    rootScope.$digest() 
    })) 

    beforeEach(inject(($componentController) => { 
    let bindings = { 
     parking: {}, 
     projectReferences: {} 
    } 
    ctrl = $componentController('projectExteriorParkingModule', null, bindings) 
    })) 

    it('should contain two input',() => { 
    const inputItems = htmlElement.get(0).querySelectorAll('input') 
    expect(inputItems.length).toBe(2) 
    }) 
})

我如何可以模拟该变量shouldShowAir是真实的，还是模拟的用户界面，选择因为我没有访问doShow()函数调用函数的选择on-select="$ctrl.doShow()"。或者你如何“手动”除了输入添加到测试和编译它<project-exterior-parking parking="project.realEstateProjectProduct.parkings"></project-exterior-parking>

来源

2017-07-27 Mouad Ennaciri

1.什么是你想用做方法的值：'CTRL = $ componentController（“projectExteriorParkingModule”，空，绑定）'在第二个' beforeEach'块？这是试图让上面的编译组件的控制器？你可以用'htmlElement.controller（'projectExteriorParking'）'获得元素控制器 – kidroca

为了得到一个编译单元的控制器调用ctrl = htmlElement.controller('directive|component name')

在你的情况ctrl = htmlElement.controller('projectExteriorParking')

directive|component是当您向组件或指令注册时提供的字符串angular.module

了解如何从编译的htmlElement获取控制器，现在可以调用ctrl.doShow()和$rootScope.$apply()，然后断言元素呈现你在测试的方式做

有一对夫妇在你的代码的其他东西： ng-model="$ctrl.parking.parkingType"

doShow() { 
    // ngModel is this.parking.parkingType 
    // is there this.parkingType or is this a mistake? 
    this.doShowAir = (this.parkingType.labelKey === 'parking_type.air') 
}

传递给$范围编译缺少要求绑定：

beforeEach(inject((_$compile_, _$rootScope_) => { 
    rootScope = _$rootScope_ 
    compile = _$compile_ 
    scope = rootScope.$new() 
    scope.parking = {} 
    // The compiled element has `parking` bound to `project.realEstate...` yet you don't have it on scope 
// you should assign some mock data as `scope.project = { realEstateProjectProduct }` 
    htmlElement = compile(`<project-exterior-parking parking="project.realEstateProjectProduct.parkings"></project-exterior-parking>`)(scope) 
    rootScope.$digest()

}））

你应该通过一些模拟数据或者设置ctrl.parkingType为您预期将ctrl.doShow()设置ctrl.doShowAir为true

来源

2017-08-02 01:16:50 kidroca

Angular 1/ui-select/Jasmine - 测试元素是否存在于ng中 - 如果

回答

相关问题