Problem
I am trying to click input radio
from value="agency"
from a directive template with the ultimate goal of changing the scope variable newDatasourceType
.
Appropriate source
Directive Template
<div ng-if="!datasources" class="new-datasource">
<input name="agencyOrWidget" type="radio" ng-model="newDatasourceType" value="agency" />
<label>Agency</label>
<input name="agencyOrWidget" type="radio" ng-model="newDatasourceType" value="widget" />
<label>Widget</label>
<select ng-if="newDatasourceType=='widget'" name="{{inputPrefix}}[0][widget_id]">
<option>Choose a widget...</option>
<option ng-repeat="(id, options) in widgetList" value="{{id}}">{{id}}</option>
</select>
<select ng-if="newDatasourceType=='agency'" name="{{inputPrefix}}[0][agency_id]">
<option>Choose an agency...</option>
<option ng-repeat="(id, name) in agenciesList" value="{{id}}">{{name}}</option>
</select>
</div>
Corresponding Unit Test
Parts that have tried and notes are in the comments.
it('Select Agencies', function() {
scope.newDatasourceType = 'agency';
elem = $compile(directive)(scope);
scope.$digest();
console.log(elem.find('input[value="agency"]').length);
elem.find('input[value="agency"]').click(function() {
console.log('click');
});
expect(elem.find('select option:nth-child(2)').val()).toBe(Object.keys(scope.agenciesJson)[0]);
});
What do I see
Regardless if I manually installed newDatasourceType
or try to click on it, only the selection box c will be shown Choose a widget...
.
source
share