mirror of
https://github.com/inverse-inc/sogo.git
synced 2026-02-26 03:36:23 +00:00
102 lines
3.8 KiB
JavaScript
102 lines
3.8 KiB
JavaScript
describe('<md-switch>', function() {
|
|
var CHECKED_CSS = 'md-checked';
|
|
|
|
beforeEach(TestUtil.mockRaf);
|
|
beforeEach(module('ngAria', 'material.components.switch'));
|
|
|
|
it('should set checked css class and aria-checked attributes', inject(function($compile, $rootScope) {
|
|
var element = $compile('<div>' +
|
|
'<md-switch ng-model="blue">' +
|
|
'</md-switch>' +
|
|
'<md-switch ng-model="green">' +
|
|
'</md-switch>' +
|
|
'</div>')($rootScope);
|
|
|
|
$rootScope.$apply(function(){
|
|
$rootScope.blue = false;
|
|
$rootScope.green = true;
|
|
});
|
|
|
|
var switches = angular.element(element[0].querySelectorAll('md-switch'));
|
|
|
|
expect(switches.eq(0).hasClass(CHECKED_CSS)).toEqual(false);
|
|
expect(switches.eq(1).hasClass(CHECKED_CSS)).toEqual(true);
|
|
expect(switches.eq(0).attr('aria-checked')).toEqual('false');
|
|
expect(switches.eq(1).attr('aria-checked')).toEqual('true');
|
|
expect(switches.eq(0).attr('role')).toEqual('checkbox');
|
|
|
|
$rootScope.$apply(function(){
|
|
$rootScope.blue = true;
|
|
$rootScope.green = false;
|
|
});
|
|
|
|
expect(switches.eq(1).hasClass(CHECKED_CSS)).toEqual(false);
|
|
expect(switches.eq(0).hasClass(CHECKED_CSS)).toEqual(true);
|
|
expect(switches.eq(1).attr('aria-checked')).toEqual('false');
|
|
expect(switches.eq(0).attr('aria-checked')).toEqual('true');
|
|
expect(switches.eq(1).attr('role')).toEqual('checkbox');
|
|
}));
|
|
|
|
it('should change on panstart/panend if no movement happened', inject(function($compile, $rootScope) {
|
|
var element = $compile('<md-switch ng-model="banana"></md-switch>')($rootScope);
|
|
var switchContainer = angular.element(element[0].querySelector('.md-container'));
|
|
|
|
$rootScope.$apply('banana = false');
|
|
|
|
expect($rootScope.banana).toBe(false);
|
|
expect(element.hasClass(CHECKED_CSS)).toBe(false);
|
|
|
|
switchContainer.triggerHandler('$md.dragstart', {});
|
|
switchContainer.triggerHandler('$md.dragend', {distance: 1});
|
|
|
|
expect($rootScope.banana).toBe(true);
|
|
expect(element.hasClass(CHECKED_CSS)).toBe(true);
|
|
|
|
switchContainer.triggerHandler('$md.dragstart', {});
|
|
switchContainer.triggerHandler('$md.dragend', {distance: 5});
|
|
|
|
expect($rootScope.banana).toBe(true);
|
|
expect(element.hasClass(CHECKED_CSS)).toBe(true);
|
|
|
|
switchContainer.triggerHandler('$md.dragstart', {});
|
|
switchContainer.triggerHandler('$md.dragend', {distance: -1});
|
|
|
|
expect($rootScope.banana).toBe(false);
|
|
expect(element.hasClass(CHECKED_CSS)).toBe(false);
|
|
}));
|
|
|
|
it('should check on panend if translate > 50%', inject(function($compile, $rootScope) {
|
|
var element = $compile('<md-switch ng-model="banana"></md-switch>')($rootScope);
|
|
var switchContainer = angular.element(element[0].querySelector('.md-container'));
|
|
var drag;
|
|
|
|
drag = { distance: -55 };
|
|
switchContainer.triggerHandler('$md.dragstart', {});
|
|
drag.width = 100;
|
|
switchContainer.triggerHandler('$md.drag', drag);
|
|
switchContainer.triggerHandler('$md.dragend', drag);
|
|
|
|
expect($rootScope.banana).toBe(true);
|
|
expect(element.hasClass(CHECKED_CSS)).toBe(true);
|
|
|
|
drag = { distance: 45 };
|
|
switchContainer.triggerHandler('$md.dragstart', {});
|
|
drag.width = 100;
|
|
switchContainer.triggerHandler('$md.drag', drag);
|
|
switchContainer.triggerHandler('$md.dragend', drag);
|
|
|
|
expect($rootScope.banana).toBe(true);
|
|
expect(element.hasClass(CHECKED_CSS)).toBe(true);
|
|
|
|
drag = { distance: 85 };
|
|
switchContainer.triggerHandler('$md.dragstart', {});
|
|
drag.width = 100;
|
|
switchContainer.triggerHandler('$md.drag', drag);
|
|
switchContainer.triggerHandler('$md.dragend', drag);
|
|
|
|
expect($rootScope.banana).toBe(false);
|
|
expect(element.hasClass(CHECKED_CSS)).toBe(false);
|
|
}));
|
|
|
|
});
|