1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
|
'use strict';
describe('ngStyle', function() {
var element;
afterEach(function() {
dealoc(element);
});
it('should set', inject(function($rootScope, $compile) {
element = $compile('<div ng-style="{height: \'40px\'}"></div>')($rootScope);
$rootScope.$digest();
expect(element.css('height')).toEqual('40px');
}));
it('should silently ignore undefined style', inject(function($rootScope, $compile) {
element = $compile('<div ng-style="myStyle"></div>')($rootScope);
$rootScope.$digest();
expect(element.hasClass('ng-exception')).toBeFalsy();
}));
describe('preserving styles set before and after compilation', function() {
var scope, preCompStyle, preCompVal, postCompStyle, postCompVal, element;
beforeEach(inject(function($rootScope, $compile) {
preCompStyle = 'width';
preCompVal = '300px';
postCompStyle = 'height';
postCompVal = '100px';
element = jqLite('<div ng-style="styleObj"></div>');
element.css(preCompStyle, preCompVal);
jqLite(document.body).append(element);
$compile(element)($rootScope);
scope = $rootScope;
scope.styleObj = {'margin-top': '44px'};
scope.$apply();
element.css(postCompStyle, postCompVal);
}));
afterEach(function() {
element.remove();
});
it('should not mess up stuff after compilation', function() {
element.css('margin', '44px');
expect(element.css(preCompStyle)).toBe(preCompVal);
expect(element.css('margin-top')).toBe('44px');
expect(element.css(postCompStyle)).toBe(postCompVal);
});
it('should not mess up stuff after $apply with no model changes', function() {
element.css('padding-top', '33px');
scope.$apply();
expect(element.css(preCompStyle)).toBe(preCompVal);
expect(element.css('margin-top')).toBe('44px');
expect(element.css(postCompStyle)).toBe(postCompVal);
expect(element.css('padding-top')).toBe('33px');
});
it('should not mess up stuff after $apply with non-colliding model changes', function() {
scope.styleObj = {'padding-top': '99px'};
scope.$apply();
expect(element.css(preCompStyle)).toBe(preCompVal);
expect(element.css('margin-top')).not.toBe('44px');
expect(element.css('padding-top')).toBe('99px');
expect(element.css(postCompStyle)).toBe(postCompVal);
});
it('should overwrite original styles after a colliding model change', function() {
scope.styleObj = {'height': '99px', 'width': '88px'};
scope.$apply();
expect(element.css(preCompStyle)).toBe('88px');
expect(element.css(postCompStyle)).toBe('99px');
scope.styleObj = {};
scope.$apply();
expect(element.css(preCompStyle)).not.toBe('88px');
expect(element.css(postCompStyle)).not.toBe('99px');
});
});
});
|
