OLD | NEW |
| (Empty) |
1 library ng_if_spec; | |
2 | |
3 import '../_specs.dart'; | |
4 | |
5 @NgDirective( | |
6 selector: '[child-controller]', | |
7 children: NgAnnotation.TRANSCLUDE_CHILDREN) | |
8 class ChildController { | |
9 ChildController(BoundBlockFactory boundBlockFactory, | |
10 BlockHole blockHole, | |
11 Scope scope) { | |
12 scope.context['setBy'] = 'childController'; | |
13 boundBlockFactory(scope).insertAfter(blockHole); | |
14 } | |
15 } | |
16 | |
17 main() { | |
18 var compile, html, element, rootScope, logger, directives; | |
19 | |
20 void configInjector() { | |
21 module((Module module) { | |
22 module | |
23 ..type(ChildController) | |
24 ..type(LogAttrDirective); | |
25 }); | |
26 } | |
27 | |
28 void configState() { | |
29 inject((Scope scope, Compiler compiler, Injector injector, Logger _logger, D
irectiveMap _directives) { | |
30 rootScope = scope; | |
31 logger = _logger; | |
32 compile = (html, [applyFn]) { | |
33 element = $(html); | |
34 compiler(element, _directives)(injector, element); | |
35 scope.apply(applyFn); | |
36 }; | |
37 directives = _directives; | |
38 }); | |
39 } | |
40 | |
41 they(should, htmlForElements, callback, [exclusive=false]) { | |
42 htmlForElements.forEach((html) { | |
43 var directiveName = html.contains('ng-if') ? 'ng-if' : 'ng-unless'; | |
44 describe(directiveName, () { | |
45 beforeEach(configInjector); | |
46 beforeEach(configState); | |
47 (exclusive ? iit : it)(should, () { | |
48 callback(html); | |
49 }); | |
50 }); | |
51 }); | |
52 } | |
53 | |
54 they('should add/remove the element', | |
55 [ '<div><span ng-if="isVisible">content</span></div>', | |
56 '<div><span ng-unless="!isVisible">content</span></div>'], | |
57 (html) { | |
58 compile(html); | |
59 // The span node should NOT exist in the DOM. | |
60 expect(element.contents().length).toEqual(1); | |
61 expect(element.find('span').html()).toEqual(''); | |
62 | |
63 rootScope.apply(() { | |
64 rootScope.context['isVisible'] = true; | |
65 }); | |
66 | |
67 // The span node SHOULD exist in the DOM. | |
68 expect(element.contents().length).toEqual(2); | |
69 expect(element.find('span').html()).toEqual('content'); | |
70 | |
71 rootScope.apply(() { | |
72 rootScope.context['isVisible'] = false; | |
73 }); | |
74 | |
75 expect(element.find('span').html()).toEqual(''); | |
76 } | |
77 ); | |
78 | |
79 they('should create a child scope', | |
80 [ | |
81 // ng-if | |
82 '<div>' + | |
83 ' <div ng-if="isVisible">'.trim() + | |
84 ' <span child-controller id="inside">{{setBy}}</span>'.trim() + | |
85 ' </div>'.trim() + | |
86 ' <span id="outside">{{setBy}}</span>'.trim() + | |
87 '</div>', | |
88 // ng-unless | |
89 '<div>' + | |
90 ' <div ng-unless="!isVisible">'.trim() + | |
91 ' <span child-controller id="inside">{{setBy}}</span>'.trim() + | |
92 ' </div>'.trim() + | |
93 ' <span id="outside">{{setBy}}</span>'.trim() + | |
94 '</div>'], | |
95 (html) { | |
96 rootScope.context['setBy'] = 'topLevel'; | |
97 compile(html); | |
98 expect(element.contents().length).toEqual(2); | |
99 | |
100 rootScope.apply(() { | |
101 rootScope.context['isVisible'] = true; | |
102 }); | |
103 expect(element.contents().length).toEqual(3); | |
104 // The value on the parent scope.context['should'] be unchanged. | |
105 expect(rootScope.context['setBy']).toEqual('topLevel'); | |
106 expect(element.find('#outside').html()).toEqual('topLevel'); | |
107 // A child scope.context['must'] have been created and hold a different va
lue. | |
108 expect(element.find('#inside').html()).toEqual('childController'); | |
109 } | |
110 ); | |
111 | |
112 they('should play nice with other elements beside it', | |
113 [ | |
114 // ng-if | |
115 '<div>' + | |
116 ' <div ng-repeat="i in values"></div>'.trim() + | |
117 ' <div ng-if="values.length==4"></div>'.trim() + | |
118 ' <div ng-repeat="i in values"></div>'.trim() + | |
119 '</div>', | |
120 // ng-unless | |
121 '<div>' + | |
122 ' <div ng-repeat="i in values"></div>'.trim() + | |
123 ' <div ng-unless="values.length!=4"></div>'.trim() + | |
124 ' <div ng-repeat="i in values"></div>'.trim() + | |
125 '</div>'], | |
126 (html) { | |
127 var values = rootScope.context['values'] = [1, 2, 3, 4]; | |
128 compile(html); | |
129 expect(element.contents().length).toBe(12); | |
130 rootScope.apply(() { | |
131 values.removeRange(0, 1); | |
132 }); | |
133 expect(element.contents().length).toBe(9); | |
134 rootScope.apply(() { | |
135 values.insert(0, 1); | |
136 }); | |
137 expect(element.contents().length).toBe(12); | |
138 } | |
139 ); | |
140 | |
141 they('should restore the element to its compiled state', | |
142 [ | |
143 '<div><span class="my-class" ng-if="isVisible">content</span></div>', | |
144 '<div><span class="my-class" ng-unless="!isVisible">content</span></div>']
, | |
145 (html) { | |
146 rootScope.context['isVisible'] = true; | |
147 compile(html); | |
148 expect(element.contents().length).toEqual(2); | |
149 element.find('span').removeClass('my-class'); | |
150 expect(element.find('span').hasClass('my-class')).not.toBe(true); | |
151 rootScope.apply(() { | |
152 rootScope.context['isVisible'] = false; | |
153 }); | |
154 expect(element.contents().length).toEqual(1); | |
155 rootScope.apply(() { | |
156 rootScope.context['isVisible'] = true; | |
157 }); | |
158 // The newly inserted node should be a copy of the compiled state. | |
159 expect(element.find('span').hasClass('my-class')).toBe(true); | |
160 } | |
161 ); | |
162 | |
163 they('should not cause ng-click to throw an exception', | |
164 [ | |
165 '<div><span ng-click="click" ng-if="isVisible">content</span></div>', | |
166 '<div><span ng-click="click" ng-unless="!isVisible">content</span></div>']
, | |
167 (html) { | |
168 compile(html); | |
169 rootScope.apply(() { | |
170 rootScope.context['isVisible'] = false; | |
171 }); | |
172 expect(element.find('span').html()).toEqual(''); | |
173 } | |
174 ); | |
175 | |
176 they('should prevent other directives from running when disabled', | |
177 [ | |
178 '<div><li log="ALWAYS"></li><span log="JAMES" ng-if="isVisible">content</s
pan></div>', | |
179 '<div><li log="ALWAYS"></li><span log="JAMES" ng-unless="!isVisible">conte
nt</span></div>'], | |
180 (html) { | |
181 compile(html); | |
182 expect(element.find('span').html()).toEqual(''); | |
183 | |
184 rootScope.apply(() { | |
185 rootScope.context['isVisible'] = false; | |
186 }); | |
187 expect(element.find('span').html()).toEqual(''); | |
188 expect(logger.result()).toEqual('ALWAYS'); | |
189 | |
190 | |
191 rootScope.apply(() { | |
192 rootScope.context['isVisible'] = true; | |
193 }); | |
194 expect(element.find('span').html()).toEqual('content'); | |
195 expect(logger.result()).toEqual('ALWAYS; JAMES'); | |
196 } | |
197 ); | |
198 | |
199 they('should prevent other directives from running when disabled', | |
200 [ | |
201 '<div><div ng-if="a"><div ng-if="b">content</div></div></div>', | |
202 '<div><div ng-unless="!a"><div ng-unless="!b">content</div></div></div>'], | |
203 (html) { | |
204 compile(html); | |
205 expect(element.find('span').html()).toEqual(''); | |
206 | |
207 expect(() { | |
208 rootScope.apply(() { | |
209 rootScope.context['a'] = true; | |
210 rootScope.context['b'] = false; | |
211 }); | |
212 }).not.toThrow(); | |
213 expect(element.find('span').html()).toEqual(''); | |
214 | |
215 | |
216 expect(() { | |
217 rootScope.apply(() { | |
218 rootScope.context['a'] = false; | |
219 rootScope.context['b'] = true; | |
220 }); | |
221 }).not.toThrow(); | |
222 expect(element.find('span').html()).toEqual(''); | |
223 } | |
224 ); | |
225 } | |
OLD | NEW |