Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Angular Material Radio Button Spec
describe('radioButton', function() {
beforeEach(module('material.components.radioButton'));
it('should set roles', inject(function($compile, $rootScope) {
var element = $compile('<material-radio-group ng-model="color">' +
'<material-radio-button value="blue"></material-radio-button>' +
'<material-radio-button value="green"></material-radio-button>' +
'</material-radio-group>')($rootScope);
var rbGroupElement = element;
expect(rbGroupElement.eq(0).attr('role')).toEqual('radiogroup');
expect(rbGroupElement.find('material-radio-button').eq(0).attr('role')).toEqual('radio');
}));
it('should set aria attributes', inject(function($compile, $rootScope) {
var element = $compile('<material-radio-group ng-model="color">' +
'<material-radio-button value="blue"></material-radio-button>' +
'<material-radio-button value="green"></material-radio-button>' +
'</material-radio-group>')($rootScope);
$rootScope.$apply(function(){
$rootScope.color = 'green';
});
var rbElements = element.find('material-radio-button');
expect(rbElements.eq(0).attr('aria-checked')).toEqual('false');
expect(rbElements.eq(1).attr('aria-checked')).toEqual('true');
expect(element.attr('aria-activedescendant')).toEqual(rbElements.eq(1).attr('id'));
expect(element.attr('aria-activedescendant')).not.toEqual(rbElements.eq(0).attr('id'));
}));
it('should be operable via arrow keys', inject(function($compile, $rootScope) {
var element = $compile('<material-radio-group ng-model="color">' +
'<material-radio-button value="blue"></material-radio-button>' +
'<material-radio-button value="green"></material-radio-button>' +
'</material-radio-group>')($rootScope);
$rootScope.$apply(function(){
$rootScope.color = 'blue';
});
var rbGroupElement = element.eq(0);
TestUtil.triggerEvent(rbGroupElement, "keydown", {keyCode: Constant.KEY_CODE.RIGHT_ARROW});
expect($rootScope.color).toEqual('green');
}));
});
var TestUtil = {
/**
* Creates a jQuery event for unit testing such that an event name and optional keyCode can be passed in.
*
*/
triggerEvent: function (element, eventName, eventData) {
eventData = eventData || {};
var e = $.extend({}, $.Event(eventName), eventData);
if(eventData.keyCode){
e.which = eventData.keyCode;
}
element.trigger(e);
}
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.