| 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 |