'use strict'; /* eslint-disable no-script-url */ describe('ngProp*', function() { it('should bind boolean properties (input disabled)', inject(function($rootScope, $compile) { var element = $compile('')($rootScope); $rootScope.$digest(); expect(element.prop('disabled')).toBe(false); $rootScope.isDisabled = true; $rootScope.$digest(); expect(element.prop('disabled')).toBe(true); $rootScope.isDisabled = false; $rootScope.$digest(); expect(element.prop('disabled')).toBe(false); })); it('should bind boolean properties (input checked)', inject(function($rootScope, $compile) { var element = $compile('')($rootScope); expect(element.prop('checked')).toBe(false); $rootScope.isChecked = true; $rootScope.$digest(); expect(element.prop('checked')).toBe(true); $rootScope.isChecked = false; $rootScope.$digest(); expect(element.prop('checked')).toBe(false); })); it('should bind string properties (title)', inject(function($rootScope, $compile) { var element = $compile('')($rootScope); $rootScope.title = 123; $rootScope.$digest(); expect(element.prop('title')).toBe('123'); $rootScope.title = 'foobar'; $rootScope.$digest(); expect(element.prop('title')).toBe('foobar'); })); it('should bind variable type properties', inject(function($rootScope, $compile) { var element = $compile('')($rootScope); $rootScope.asdf = 123; $rootScope.$digest(); expect(element.prop('asdf')).toBe(123); $rootScope.asdf = 'foobar'; $rootScope.$digest(); expect(element.prop('asdf')).toBe('foobar'); $rootScope.asdf = true; $rootScope.$digest(); expect(element.prop('asdf')).toBe(true); })); it('should support mixed case using underscore-separated names', inject(function($rootScope, $compile) { var element = $compile('')($rootScope); $rootScope.value = 123; $rootScope.$digest(); expect(element.prop('aBcdE')).toBe(123); })); it('should work with different prefixes', inject(function($rootScope, $compile) { $rootScope.name = 'Misko'; var element = $compile('')($rootScope); expect(element.prop('test')).toBe('Misko'); expect(element.prop('test2')).toBe('Misko'); expect(element.prop('test3')).toBe('Misko'); })); it('should work with the "href" property', inject(function($rootScope, $compile) { $rootScope.value = 'test'; var element = $compile('')($rootScope); $rootScope.$digest(); expect(element.prop('href')).toMatch(/\/test\/test$/); })); it('should work if they are prefixed with x- or data- and different prefixes', inject(function($rootScope, $compile) { $rootScope.name = 'Misko'; var element = $compile('')($rootScope); expect(element.prop('test2')).toBe('Misko'); expect(element.prop('test3')).toBe('Misko'); expect(element.prop('test4')).toBe('Misko'); expect(element.prop('test5')).toBe('Misko'); expect(element.prop('test6')).toBe('Misko'); })); it('should work independently of attributes with the same name', inject(function($rootScope, $compile) { var element = $compile('')($rootScope); $rootScope.asdf = 123; $rootScope.$digest(); expect(element.prop('asdf')).toBe(123); expect(element.attr('asdf')).toBe('foo'); })); it('should work independently of (ng-)attributes with the same name', inject(function($rootScope, $compile) { var element = $compile('')($rootScope); $rootScope.asdf = 123; $rootScope.$digest(); expect(element.prop('asdf')).toBe(123); expect(element.attr('asdf')).toBe('foo'); })); it('should use the full ng-prop-* attribute name in $attr mappings', function() { var attrs; module(function($compileProvider) { $compileProvider.directive('attrExposer', valueFn({ link: function($scope, $element, $attrs) { attrs = $attrs; } })); }); inject(function($compile, $rootScope) { $compile('
')($rootScope); expect(attrs.title).toBeUndefined(); expect(attrs.$attr.title).toBeUndefined(); expect(attrs.ngPropTitle).toBe('12'); expect(attrs.$attr.ngPropTitle).toBe('ng-prop-title'); expect(attrs.superTitle).toBeUndefined(); expect(attrs.$attr.superTitle).toBeUndefined(); expect(attrs.ngPropSuperTitle).toBe('34'); expect(attrs.$attr.ngPropSuperTitle).toBe('ng-prop-super-title'); expect(attrs.myCamelTitle).toBeUndefined(); expect(attrs.$attr.myCamelTitle).toBeUndefined(); expect(attrs.ngPropMyCamelTitle).toBe('56'); expect(attrs.$attr.ngPropMyCamelTitle).toBe('ng-prop-my-camel_title'); }); }); it('should not conflict with (ng-attr-)attribute mappings of the same name', function() { var attrs; module(function($compileProvider) { $compileProvider.directive('attrExposer', valueFn({ link: function($scope, $element, $attrs) { attrs = $attrs; } })); }); inject(function($compile, $rootScope) { $compile('
')($rootScope); expect(attrs.title).toBe('foo'); expect(attrs.$attr.title).toBe('title'); expect(attrs.$attr.ngPropTitle).toBe('ng-prop-title'); }); }); it('should disallow property binding to onclick', inject(function($compile, $rootScope) { // All event prop bindings are disallowed. expect(function() { $compile('