blob: 4ba06777cb6d247dcf3413177e7ed16043327715 [file] [log] [blame]
Matteo Scandolo46b56102015-12-16 14:23:08 -08001describe('popover', function() {
2 var elm,
3 elmBody,
4 scope,
5 elmScope,
6 tooltipScope;
7
8 // load the popover code
9 beforeEach(module('ui.bootstrap.popover'));
10
11 // load the template
12 beforeEach(module('template/popover/popover.html'));
13
14 beforeEach(inject(function($rootScope, $compile) {
15 elmBody = angular.element(
16 '<div><span uib-popover="popover text">Selector Text</span></div>'
17 );
18
19 scope = $rootScope;
20 $compile(elmBody)(scope);
21 scope.$digest();
22 elm = elmBody.find('span');
23 elmScope = elm.scope();
24 tooltipScope = elmScope.$$childTail;
25 }));
26
27 it('should not be open initially', inject(function() {
28 expect(tooltipScope.isOpen).toBe(false);
29
30 // We can only test *that* the popover-popup element wasn't created as the
31 // implementation is templated and replaced.
32 expect(elmBody.children().length).toBe(1);
33 }));
34
35 it('should open on click', inject(function() {
36 elm.trigger('click');
37 tooltipScope.$digest();
38 expect(tooltipScope.isOpen).toBe(true);
39
40 // We can only test *that* the popover-popup element was created as the
41 // implementation is templated and replaced.
42 expect(elmBody.children().length).toBe(2);
43 }));
44
45 it('should close on second click', inject(function() {
46 elm.trigger('click');
47 tooltipScope.$digest();
48 expect(tooltipScope.isOpen).toBe(true);
49 elm.trigger('click');
50 tooltipScope.$digest();
51 expect(tooltipScope.isOpen).toBe(false);
52 }));
53
54 it('should not unbind event handlers created by other directives - issue 456', inject(function($compile) {
55 scope.click = function() {
56 scope.clicked = !scope.clicked;
57 };
58
59 elmBody = angular.element(
60 '<div><input uib-popover="Hello!" ng-click="click()" popover-trigger="mouseenter"/></div>'
61 );
62 $compile(elmBody)(scope);
63 scope.$digest();
64
65 elm = elmBody.find('input');
66
67 elm.trigger('mouseenter');
68 elm.trigger('mouseleave');
69 expect(scope.clicked).toBeFalsy();
70
71 elm.click();
72 expect(scope.clicked).toBeTruthy();
73 }));
74
75 it('should popup with animate class by default', inject(function() {
76 elm.trigger('click');
77 tooltipScope.$digest();
78 expect(tooltipScope.isOpen).toBe(true);
79
80 expect(elmBody.children().eq(1)).toHaveClass('fade');
81 }));
82
83 it('should popup without animate class when animation disabled', inject(function($compile) {
84 elmBody = angular.element(
85 '<div><span uib-popover="popover text" popover-animation="false">Selector Text</span></div>'
86 );
87
88 $compile(elmBody)(scope);
89 scope.$digest();
90 elm = elmBody.find('span');
91 elmScope = elm.scope();
92 tooltipScope = elmScope.$$childTail;
93
94 elm.trigger('click');
95 tooltipScope.$digest();
96 expect(tooltipScope.isOpen).toBe(true);
97 expect(elmBody.children().eq(1)).not.toHaveClass('fade');
98 }));
99
100 describe('supports options', function() {
101 describe('placement', function() {
102 it('can specify an alternative, valid placement', inject(function($compile) {
103 elmBody = angular.element(
104 '<div><span uib-popover="popover text" popover-placement="left">Trigger here</span></div>'
105 );
106 $compile(elmBody)(scope);
107 scope.$digest();
108 elm = elmBody.find('span');
109 elmScope = elm.scope();
110 tooltipScope = elmScope.$$childTail;
111
112 elm.trigger('click');
113 tooltipScope.$digest();
114 expect(tooltipScope.isOpen).toBe(true);
115
116 expect(elmBody.children().length).toBe(2);
117 var ttipElement = elmBody.find('div.popover');
118 expect(ttipElement).toHaveClass('left');
119 }));
120 });
121
122 describe('class', function() {
123 it('can specify a custom class', inject(function($compile) {
124 elmBody = angular.element(
125 '<div><span uib-popover="popover text" popover-class="custom">Trigger here</span></div>'
126 );
127 $compile(elmBody)(scope);
128 scope.$digest();
129 elm = elmBody.find('span');
130 elmScope = elm.scope();
131 tooltipScope = elmScope.$$childTail;
132
133 elm.trigger('click');
134 tooltipScope.$digest();
135 expect(tooltipScope.isOpen).toBe(true);
136
137 expect(elmBody.children().length).toBe(2);
138 var ttipElement = elmBody.find('div.popover');
139 expect(ttipElement).toHaveClass('custom');
140 }));
141 });
142
143 describe('is-open', function() {
144 beforeEach(inject(function ($compile) {
145 scope.isOpen = false;
146 elmBody = angular.element(
147 '<div><span uib-popover="popover text" popover-placement="left" popover-is-open="isOpen">Trigger here</span></div>'
148 );
149 $compile(elmBody)(scope);
150 scope.$digest();
151 elm = elmBody.find('span');
152 elmScope = elm.scope();
153 tooltipScope = elmScope.$$childTail;
154 }));
155
156 it('should show and hide with the controller value', function() {
157 expect(tooltipScope.isOpen).toBe(false);
158 elmScope.isOpen = true;
159 elmScope.$digest();
160 expect(tooltipScope.isOpen).toBe(true);
161 elmScope.isOpen = false;
162 elmScope.$digest();
163 expect(tooltipScope.isOpen).toBe(false);
164 });
165
166 it('should update the controller value', function() {
167 elm.trigger('click');
168 tooltipScope.$digest();
169 expect(elmScope.isOpen).toBe(true);
170 elm.trigger('click');
171 tooltipScope.$digest();
172 expect(elmScope.isOpen).toBe(false);
173 });
174 });
175 });
176});
177
178/* Deprecation tests below */
179
180describe('popover deprecation', function() {
181 beforeEach(module('ui.bootstrap.popover'));
182 beforeEach(module('template/popover/popover.html'));
183
184 var elm, elmBody, elmScope, tooltipScope;
185
186 it('should suppress warning', function() {
187 module(function($provide) {
188 $provide.value('$popoverSuppressWarning', true);
189 $provide.value('$tooltipSuppressWarning', true);
190 });
191
192 inject(function($compile, $log, $rootScope) {
193 spyOn($log, 'warn');
194
195 elmBody = angular.element('<div><span popover="popover text">Selector Text</span></div>');
196 $compile(elmBody)($rootScope);
197 $rootScope.$digest();
198 elm = elmBody.find('span');
199 elmScope = elm.scope();
200 tooltipScope = elmScope.$$childTail;
201
202 elm.trigger('click');
203 tooltipScope.$digest();
204
205 expect($log.warn.calls.count()).toBe(0);
206 });
207 });
208
209 it('should give warning by default', inject(function($compile, $log, $rootScope) {
210 spyOn($log, 'warn');
211
212 elmBody = angular.element('<div><span popover="popover text">Selector Text</span></div>');
213 $compile(elmBody)($rootScope);
214 $rootScope.$digest();
215 elm = elmBody.find('span');
216 elmScope = elm.scope();
217 tooltipScope = elmScope.$$childTail;
218
219 elm.trigger('click');
220 tooltipScope.$digest();
221
222 expect($log.warn.calls.count()).toBe(2);
223 expect($log.warn.calls.argsFor(0)).toEqual(['$tooltip is now deprecated. Use $uibTooltip instead.']);
224 expect($log.warn.calls.argsFor(1)).toEqual(['popover-popup is now deprecated. Use uib-popover-popup instead.']);
225 }));
226});