##// END OF EJS Templates
Added int range and int widget tests.
Jonathan Frederic -
Show More
@@ -1,480 +1,614 b''
1 // Test the widget framework.
1 // Test the widget framework.
2 casper.notebook_test(function () {
2 casper.notebook_test(function () {
3 var index;
3 var index;
4
4
5 // Test widget dependencies ////////////////////////////////////////////////
5 // Test widget dependencies ////////////////////////////////////////////////
6 this.then(function () {
6 this.then(function () {
7
7
8 // Check if the WidgetManager class is defined.
8 // Check if the WidgetManager class is defined.
9 this.test.assert(this.evaluate(function() {
9 this.test.assert(this.evaluate(function() {
10 return IPython.WidgetManager != undefined;
10 return IPython.WidgetManager != undefined;
11 }), 'WidgetManager class is defined');
11 }), 'WidgetManager class is defined');
12 });
12 });
13
13
14 index = this.append_cell(
14 index = this.append_cell(
15 'from IPython.html import widgets\n' +
15 'from IPython.html import widgets\n' +
16 'from IPython.display import display, clear_output\n' +
16 'from IPython.display import display, clear_output\n' +
17 'print("Success")');
17 'print("Success")');
18 this.execute_cell_then(index);
18 this.execute_cell_then(index);
19
19
20 this.wait(500); // Wait for require.js async callbacks to load dependencies.
20 this.wait(500); // Wait for require.js async callbacks to load dependencies.
21
21
22 this.then(function () {
22 this.then(function () {
23 // Check if the widget manager has been instanciated.
23 // Check if the widget manager has been instanciated.
24 this.test.assert(this.evaluate(function() {
24 this.test.assert(this.evaluate(function() {
25 return IPython.widget_manager != undefined;
25 return IPython.widget_manager != undefined;
26 }), 'Notebook widget manager instanciated');
26 }), 'Notebook widget manager instanciated');
27 });
27 });
28
28
29 // Check widget mapping ////////////////////////////////////////////////////
29 // Check widget mapping ////////////////////////////////////////////////////
30 index = this.append_cell(
30 index = this.append_cell(
31 'names = [name for name in dir(widgets)' +
31 'names = [name for name in dir(widgets)' +
32 ' if name.endswith("Widget") and name!= "Widget"]\n' +
32 ' if name.endswith("Widget") and name!= "Widget"]\n' +
33 'for name in names:\n' +
33 'for name in names:\n' +
34 ' print(name)\n');
34 ' print(name)\n');
35 this.execute_cell_then(index, function(index){
35 this.execute_cell_then(index, function(index){
36
36
37 // Get the widget names that are registered with the widget manager. Assume
37 // Get the widget names that are registered with the widget manager. Assume
38 // a 1 to 1 mapping of model and widgets names (model names just have 'model'
38 // a 1 to 1 mapping of model and widgets names (model names just have 'model'
39 // suffixed).
39 // suffixed).
40 var javascript_names = this.evaluate(function () {
40 var javascript_names = this.evaluate(function () {
41 names = [];
41 names = [];
42 for (var name in IPython.widget_manager.widget_model_types) {
42 for (var name in IPython.widget_manager.widget_model_types) {
43 names.push(name.replace('Model',''));
43 names.push(name.replace('Model',''));
44 }
44 }
45 return names;
45 return names;
46 });
46 });
47
47
48 // Get the widget names registered in python.
48 // Get the widget names registered in python.
49 var python_names = this.get_output_cell(index).text.split('\n');
49 var python_names = this.get_output_cell(index).text.split('\n');
50
50
51 // Make sure the two lists have the same items.
51 // Make sure the two lists have the same items.
52 for (var i in javascript_names) {
52 for (var i in javascript_names) {
53 var javascript_name = javascript_names[i];
53 var javascript_name = javascript_names[i];
54 var found = false;
54 var found = false;
55 for (var j in python_names) {
55 for (var j in python_names) {
56 var python_name = python_names[j];
56 var python_name = python_names[j];
57 if (python_name==javascript_name) {
57 if (python_name==javascript_name) {
58 found = true;
58 found = true;
59 break;
59 break;
60 }
60 }
61 }
61 }
62 this.test.assert(found, javascript_name + ' exists in python');
62 this.test.assert(found, javascript_name + ' exists in python');
63 }
63 }
64 for (var i in python_names) {
64 for (var i in python_names) {
65 var python_name = python_names[i];
65 var python_name = python_names[i];
66 if (python_name.length > 0) {
66 if (python_name.length > 0) {
67 var found = false;
67 var found = false;
68 for (var j in javascript_names) {
68 for (var j in javascript_names) {
69 var javascript_name = javascript_names[j];
69 var javascript_name = javascript_names[j];
70 if (python_name==javascript_name) {
70 if (python_name==javascript_name) {
71 found = true;
71 found = true;
72 break;
72 break;
73 }
73 }
74 }
74 }
75 this.test.assert(found, python_name + ' exists in javascript');
75 this.test.assert(found, python_name + ' exists in javascript');
76 }
76 }
77 }
77 }
78 });
78 });
79
79
80
80
81 // Test bool widget ////////////////////////////////////////////////////////
81 // Test bool widget ////////////////////////////////////////////////////////
82 var bool_index = this.append_cell(
82 var bool_index = this.append_cell(
83 'bool_widget = widgets.BoolWidget(description="Title", value=True)\n' +
83 'bool_widget = widgets.BoolWidget(description="Title", value=True)\n' +
84 'display(bool_widget)\n'+
84 'display(bool_widget)\n'+
85 'display(bool_widget, view_name="ToggleButtonView")\n' +
85 'display(bool_widget, view_name="ToggleButtonView")\n' +
86 'print("Success")');
86 'print("Success")');
87 this.execute_cell_then(bool_index, function(index){
87 this.execute_cell_then(bool_index, function(index){
88
88
89 this.test.assert(this.get_output_cell(index).text == 'Success\n',
89 this.test.assert(this.get_output_cell(index).text == 'Success\n',
90 'Create bool widget cell executed with correct output.');
90 'Create bool widget cell executed with correct output.');
91
91
92 this.test.assert(this.cell_element_exists(index,
92 this.test.assert(this.cell_element_exists(index,
93 '.widget-area .widget-subarea'),
93 '.widget-area .widget-subarea'),
94 'Widget subarea exists.');
94 'Widget subarea exists.');
95
95
96 this.test.assert(this.cell_element_exists(index,
96 this.test.assert(this.cell_element_exists(index,
97 '.widget-area .widget-subarea .widget-hbox-single input'),
97 '.widget-area .widget-subarea .widget-hbox-single input'),
98 'Checkbox exists.');
98 'Checkbox exists.');
99
99
100 this.test.assert(this.cell_element_function(index,
100 this.test.assert(this.cell_element_function(index,
101 '.widget-area .widget-subarea .widget-hbox-single input', 'prop', ['checked']),
101 '.widget-area .widget-subarea .widget-hbox-single input', 'prop', ['checked']),
102 'Checkbox is checked.');
102 'Checkbox is checked.');
103
103
104 this.test.assert(this.cell_element_exists(index,
104 this.test.assert(this.cell_element_exists(index,
105 '.widget-area .widget-subarea .widget-hbox-single .widget-hlabel'),
105 '.widget-area .widget-subarea .widget-hbox-single .widget-hlabel'),
106 'Checkbox label exists.');
106 'Checkbox label exists.');
107
107
108 this.test.assert(this.cell_element_function(index,
108 this.test.assert(this.cell_element_function(index,
109 '.widget-area .widget-subarea .widget-hbox-single .widget-hlabel', 'html')=="Title",
109 '.widget-area .widget-subarea .widget-hbox-single .widget-hlabel', 'html')=="Title",
110 'Checkbox labeled correctly.');
110 'Checkbox labeled correctly.');
111
111
112 this.test.assert(this.cell_element_exists(index,
112 this.test.assert(this.cell_element_exists(index,
113 '.widget-area .widget-subarea div button'),
113 '.widget-area .widget-subarea div button'),
114 'Toggle button exists.');
114 'Toggle button exists.');
115
115
116 this.test.assert(this.cell_element_function(index,
116 this.test.assert(this.cell_element_function(index,
117 '.widget-area .widget-subarea div button', 'html')=="Title",
117 '.widget-area .widget-subarea div button', 'html')=="Title",
118 'Toggle button labeled correctly.');
118 'Toggle button labeled correctly.');
119
119
120 this.test.assert(this.cell_element_function(index,
120 this.test.assert(this.cell_element_function(index,
121 '.widget-area .widget-subarea div button', 'hasClass', ['active']),
121 '.widget-area .widget-subarea div button', 'hasClass', ['active']),
122 'Toggle button is toggled.');
122 'Toggle button is toggled.');
123
123
124 });
124 });
125
125
126 index = this.append_cell(
126 index = this.append_cell(
127 'bool_widget.value = False\n' +
127 'bool_widget.value = False\n' +
128 'print("Success")');
128 'print("Success")');
129 this.execute_cell_then(index, function(index){
129 this.execute_cell_then(index, function(index){
130
130
131 this.test.assert(this.get_output_cell(index).text == 'Success\n',
131 this.test.assert(this.get_output_cell(index).text == 'Success\n',
132 'Change bool widget value cell executed with correct output.');
132 'Change bool widget value cell executed with correct output.');
133
133
134 this.test.assert(! this.cell_element_function(bool_index,
134 this.test.assert(! this.cell_element_function(bool_index,
135 '.widget-area .widget-subarea .widget-hbox-single input', 'prop', ['checked']),
135 '.widget-area .widget-subarea .widget-hbox-single input', 'prop', ['checked']),
136 'Checkbox is not checked. (1)');
136 'Checkbox is not checked. (1)');
137
137
138 this.test.assert(! this.cell_element_function(bool_index,
138 this.test.assert(! this.cell_element_function(bool_index,
139 '.widget-area .widget-subarea div button', 'hasClass', ['active']),
139 '.widget-area .widget-subarea div button', 'hasClass', ['active']),
140 'Toggle button is not toggled. (1)');
140 'Toggle button is not toggled. (1)');
141
141
142 // Try toggling the bool by clicking on the toggle button.
142 // Try toggling the bool by clicking on the toggle button.
143 this.cell_element_function(bool_index, '.widget-area .widget-subarea div button', 'click');
143 this.cell_element_function(bool_index, '.widget-area .widget-subarea div button', 'click');
144
144
145 this.test.assert(this.cell_element_function(bool_index,
145 this.test.assert(this.cell_element_function(bool_index,
146 '.widget-area .widget-subarea .widget-hbox-single input', 'prop', ['checked']),
146 '.widget-area .widget-subarea .widget-hbox-single input', 'prop', ['checked']),
147 'Checkbox is checked. (2)');
147 'Checkbox is checked. (2)');
148
148
149 this.test.assert(this.cell_element_function(bool_index,
149 this.test.assert(this.cell_element_function(bool_index,
150 '.widget-area .widget-subarea div button', 'hasClass', ['active']),
150 '.widget-area .widget-subarea div button', 'hasClass', ['active']),
151 'Toggle button is toggled. (2)');
151 'Toggle button is toggled. (2)');
152
152
153 // Try toggling the bool by clicking on the checkbox.
153 // Try toggling the bool by clicking on the checkbox.
154 this.cell_element_function(bool_index, '.widget-area .widget-subarea .widget-hbox-single input', 'click');
154 this.cell_element_function(bool_index, '.widget-area .widget-subarea .widget-hbox-single input', 'click');
155
155
156 this.test.assert(! this.cell_element_function(bool_index,
156 this.test.assert(! this.cell_element_function(bool_index,
157 '.widget-area .widget-subarea .widget-hbox-single input', 'prop', ['checked']),
157 '.widget-area .widget-subarea .widget-hbox-single input', 'prop', ['checked']),
158 'Checkbox is not checked. (3)');
158 'Checkbox is not checked. (3)');
159
159
160 this.test.assert(! this.cell_element_function(bool_index,
160 this.test.assert(! this.cell_element_function(bool_index,
161 '.widget-area .widget-subarea div button', 'hasClass', ['active']),
161 '.widget-area .widget-subarea div button', 'hasClass', ['active']),
162 'Toggle button is not toggled. (3)');
162 'Toggle button is not toggled. (3)');
163
163
164 });
164 });
165
165
166 // Test button widget //////////////////////////////////////////////////////
166 // Test button widget //////////////////////////////////////////////////////
167
167
168 var button_index = this.append_cell(
168 var button_index = this.append_cell(
169 'button = widgets.ButtonWidget(description="Title")\n' +
169 'button = widgets.ButtonWidget(description="Title")\n' +
170 'display(button)\n'+
170 'display(button)\n'+
171 'print("Success")\n' +
171 'print("Success")\n' +
172 'def handle_click(sender):\n' +
172 'def handle_click(sender):\n' +
173 ' print("Clicked")\n' +
173 ' print("Clicked")\n' +
174 'button.on_click(handle_click)');
174 'button.on_click(handle_click)');
175 this.execute_cell_then(button_index, function(index){
175 this.execute_cell_then(button_index, function(index){
176
176
177 this.test.assert(this.get_output_cell(index).text == 'Success\n',
177 this.test.assert(this.get_output_cell(index).text == 'Success\n',
178 'Create button cell executed with correct output.');
178 'Create button cell executed with correct output.');
179
179
180 this.test.assert(this.cell_element_exists(index,
180 this.test.assert(this.cell_element_exists(index,
181 '.widget-area .widget-subarea'),
181 '.widget-area .widget-subarea'),
182 'Widget subarea exists.');
182 'Widget subarea exists.');
183
183
184 this.test.assert(this.cell_element_exists(index,
184 this.test.assert(this.cell_element_exists(index,
185 '.widget-area .widget-subarea button'),
185 '.widget-area .widget-subarea button'),
186 'Widget button exists.');
186 'Widget button exists.');
187
187
188 this.test.assert(this.cell_element_function(index,
188 this.test.assert(this.cell_element_function(index,
189 '.widget-area .widget-subarea button', 'html')=='Title',
189 '.widget-area .widget-subarea button', 'html')=='Title',
190 'Set button description.');
190 'Set button description.');
191
191
192 this.cell_element_function(index,
192 this.cell_element_function(index,
193 '.widget-area .widget-subarea button', 'click');
193 '.widget-area .widget-subarea button', 'click');
194 });
194 });
195
195
196 this.wait(500); // Wait for click to execute in kernel and write output
196 this.wait(500); // Wait for click to execute in kernel and write output
197
197
198 this.then(function () {
198 this.then(function () {
199 this.test.assert(this.get_output_cell(button_index, 1).text == 'Clicked\n',
199 this.test.assert(this.get_output_cell(button_index, 1).text == 'Clicked\n',
200 'Button click event fires.');
200 'Button click event fires.');
201 });
201 });
202
202
203 // Close the button widget asynchronisly.
203 // Close the button widget asynchronisly.
204 index = this.append_cell('button.close()\n');
204 index = this.append_cell('button.close()\n');
205 this.execute_cell(index);
205 this.execute_cell(index);
206
206
207 this.wait(500); // Wait for the button to close.
207 this.wait(500); // Wait for the button to close.
208
208
209 this.then(function(){
209 this.then(function(){
210 this.test.assert(! this.cell_element_exists(button_index,
210 this.test.assert(! this.cell_element_exists(button_index,
211 '.widget-area .widget-subarea button'),
211 '.widget-area .widget-subarea button'),
212 'Widget button doesn\'t exists.');
212 'Widget button doesn\'t exists.');
213 });
213 });
214
214
215 // Test container widget ///////////////////////////////////////////////////
215 // Test container widget ///////////////////////////////////////////////////
216 var container_index = this.append_cell(
216 var container_index = this.append_cell(
217 'container = widgets.ContainerWidget()\n' +
217 'container = widgets.ContainerWidget()\n' +
218 'button = widgets.ButtonWidget(parent=container)\n'+
218 'button = widgets.ButtonWidget(parent=container)\n'+
219 'display(container)\n'+
219 'display(container)\n'+
220 'container.add_class("my-test-class")\n'+
220 'container.add_class("my-test-class")\n'+
221 'print("Success")\n');
221 'print("Success")\n');
222 this.execute_cell_then(container_index, function(index){
222 this.execute_cell_then(container_index, function(index){
223
223
224 this.test.assert(this.get_output_cell(index).text == 'Success\n',
224 this.test.assert(this.get_output_cell(index).text == 'Success\n',
225 'Create container cell executed with correct output.');
225 'Create container cell executed with correct output.');
226
226
227 this.test.assert(this.cell_element_exists(index,
227 this.test.assert(this.cell_element_exists(index,
228 '.widget-area .widget-subarea'),
228 '.widget-area .widget-subarea'),
229 'Widget subarea exists.');
229 'Widget subarea exists.');
230
230
231 this.test.assert(this.cell_element_exists(index,
231 this.test.assert(this.cell_element_exists(index,
232 '.widget-area .widget-subarea .widget-container'),
232 '.widget-area .widget-subarea .widget-container'),
233 'Widget container exists.');
233 'Widget container exists.');
234
234
235 this.test.assert(this.cell_element_exists(index,
235 this.test.assert(this.cell_element_exists(index,
236 '.widget-area .widget-subarea .my-test-class'),
236 '.widget-area .widget-subarea .my-test-class'),
237 'add_class works.');
237 'add_class works.');
238
238
239 this.test.assert(this.cell_element_exists(index,
239 this.test.assert(this.cell_element_exists(index,
240 '.widget-area .widget-subarea .my-test-class button'),
240 '.widget-area .widget-subarea .my-test-class button'),
241 'Container parent/child relationship works.');
241 'Container parent/child relationship works.');
242 });
242 });
243
243
244 index = this.append_cell(
244 index = this.append_cell(
245 'container.set_css("display", "none")\n'+
245 'container.set_css("display", "none")\n'+
246 'print("Success")\n');
246 'print("Success")\n');
247 this.execute_cell_then(index, function(index){
247 this.execute_cell_then(index, function(index){
248
248
249 this.test.assert(this.get_output_cell(index).text == 'Success\n',
249 this.test.assert(this.get_output_cell(index).text == 'Success\n',
250 'Set container class CSS cell executed with correct output.');
250 'Set container class CSS cell executed with correct output.');
251
251
252 this.test.assert(this.cell_element_function(container_index,
252 this.test.assert(this.cell_element_function(container_index,
253 '.widget-area .widget-subarea .my-test-class', 'css', ['display'])=='none',
253 '.widget-area .widget-subarea .my-test-class', 'css', ['display'])=='none',
254 'set_css works.');
254 'set_css works.');
255 });
255 });
256
256
257 index = this.append_cell(
257 index = this.append_cell(
258 'container.remove_class("my-test-class")\n'+
258 'container.remove_class("my-test-class")\n'+
259 'print("Success")\n');
259 'print("Success")\n');
260 this.execute_cell_then(index, function(index){
260 this.execute_cell_then(index, function(index){
261
261
262 this.test.assert(this.get_output_cell(index).text == 'Success\n',
262 this.test.assert(this.get_output_cell(index).text == 'Success\n',
263 'Remove container class cell executed with correct output.');
263 'Remove container class cell executed with correct output.');
264
264
265 this.test.assert(! this.cell_element_exists(container_index,
265 this.test.assert(! this.cell_element_exists(container_index,
266 '.widget-area .widget-subarea .my-test-class'),
266 '.widget-area .widget-subarea .my-test-class'),
267 'remove_class works.');
267 'remove_class works.');
268 });
268 });
269
269
270 index = this.append_cell(
270 index = this.append_cell(
271 'display(button)\n'+
271 'display(button)\n'+
272 'print("Success")\n');
272 'print("Success")\n');
273 this.execute_cell_then(index, function(index){
273 this.execute_cell_then(index, function(index){
274
274
275 this.test.assert(this.get_output_cell(index).text == 'Success\n',
275 this.test.assert(this.get_output_cell(index).text == 'Success\n',
276 'Display container child executed with correct output.');
276 'Display container child executed with correct output.');
277
277
278 this.test.assert(! this.cell_element_exists(index,
278 this.test.assert(! this.cell_element_exists(index,
279 '.widget-area .widget-subarea .widget-container'),
279 '.widget-area .widget-subarea .widget-container'),
280 'Parent container not displayed.');
280 'Parent container not displayed.');
281
281
282 this.test.assert(this.cell_element_exists(index,
282 this.test.assert(this.cell_element_exists(index,
283 '.widget-area .widget-subarea button'),
283 '.widget-area .widget-subarea button'),
284 'Child displayed.');
284 'Child displayed.');
285 });
285 });
286
286
287 // Test float range widget /////////////////////////////////////////////////
287 // Test float range widget /////////////////////////////////////////////////
288 var slider_query = '.widget-area .widget-subarea .widget-hbox-single .slider';
288 var slider_query = '.widget-area .widget-subarea .widget-hbox-single .slider';
289 var float_text_query = '.widget-area .widget-subarea .widget-hbox-single .widget-numeric-text';
289 var float_text_query = '.widget-area .widget-subarea .widget-hbox-single .widget-numeric-text';
290
290
291 var floatrange_index = this.append_cell(
291 var floatrange_index = this.append_cell(
292 'floatrange = widgets.FloatRangeWidget()\n' +
292 'floatrange = widgets.FloatRangeWidget()\n' +
293 'display(floatrange)\n' +
293 'display(floatrange)\n' +
294 'display(floatrange, view_name="FloatTextView")\n' +
294 'display(floatrange, view_name="FloatTextView")\n' +
295 'print("Success")\n');
295 'print("Success")\n');
296 this.execute_cell_then(floatrange_index, function(index){
296 this.execute_cell_then(floatrange_index, function(index){
297
297
298 this.test.assert(this.get_output_cell(index).text == 'Success\n',
298 this.test.assert(this.get_output_cell(index).text == 'Success\n',
299 'Create float range cell executed with correct output.');
299 'Create float range cell executed with correct output.');
300
300
301 this.test.assert(this.cell_element_exists(index,
301 this.test.assert(this.cell_element_exists(index,
302 '.widget-area .widget-subarea'),
302 '.widget-area .widget-subarea'),
303 'Widget subarea exists.');
303 'Widget subarea exists.');
304
304
305 this.test.assert(this.cell_element_exists(index, slider_query),
305 this.test.assert(this.cell_element_exists(index, slider_query),
306 'Widget slider exists.');
306 'Widget slider exists.');
307
307
308 this.test.assert(this.cell_element_exists(index, float_text_query),
308 this.test.assert(this.cell_element_exists(index, float_text_query),
309 'Widget float textbox exists.');
309 'Widget float textbox exists.');
310 });
310 });
311
311
312 index = this.append_cell(
312 index = this.append_cell(
313 'floatrange.max = 50.0\n' +
313 'floatrange.max = 50.0\n' +
314 'floatrange.min = -50.0\n' +
314 'floatrange.min = -50.0\n' +
315 'floatrange.value = 25.0\n' +
315 'floatrange.value = 25.0\n' +
316 'print("Success")\n');
316 'print("Success")\n');
317 this.execute_cell_then(index, function(index){
317 this.execute_cell_then(index, function(index){
318
318
319 this.test.assert(this.get_output_cell(index).text == 'Success\n',
319 this.test.assert(this.get_output_cell(index).text == 'Success\n',
320 'Float range properties cell executed with correct output.');
320 'Float range properties cell executed with correct output.');
321
321
322 this.test.assert(this.cell_element_exists(floatrange_index, slider_query),
322 this.test.assert(this.cell_element_exists(floatrange_index, slider_query),
323 'Widget slider exists.');
323 'Widget slider exists.');
324
324
325 this.test.assert(this.cell_element_function(floatrange_index, slider_query,
325 this.test.assert(this.cell_element_function(floatrange_index, slider_query,
326 'slider', ['value']) == 25.0,
326 'slider', ['value']) == 25.0,
327 'Slider set to Python value.');
327 'Slider set to Python value.');
328
328
329 this.test.assert(this.cell_element_function(floatrange_index, float_text_query,
329 this.test.assert(this.cell_element_function(floatrange_index, float_text_query,
330 'val') == 25.0, 'Float textbox set to Python value.');
330 'val') == 25.0, 'Float textbox set to Python value.');
331
331
332 // Clear the float textbox value and then set it to 1 by emulating
332 // Clear the float textbox value and then set it to 1 by emulating
333 // keyboard presses.
333 // keyboard presses.
334 this.cell_element_function(floatrange_index, float_text_query, 'val', ['']);
334 this.cell_element_function(floatrange_index, float_text_query, 'val', ['']);
335 this.sendKeys(float_text_query, '1');
335 this.sendKeys(float_text_query, '1');
336 });
336 });
337
337
338 this.wait(500); // Wait for change to execute in kernel
338 this.wait(500); // Wait for change to execute in kernel
339
339
340 index = this.append_cell('print(floatrange.value)\n');
340 index = this.append_cell('print(floatrange.value)\n');
341 this.execute_cell_then(index, function(index){
341 this.execute_cell_then(index, function(index){
342 this.test.assert(this.get_output_cell(index).text == '1.0\n',
342 this.test.assert(this.get_output_cell(index).text == '1.0\n',
343 'Float textbox set float range value');
343 'Float textbox set float range value');
344
344
345 // Clear the float textbox value and then set it to 120 by emulating
345 // Clear the float textbox value and then set it to 120 by emulating
346 // keyboard presses.
346 // keyboard presses.
347 this.cell_element_function(floatrange_index, float_text_query, 'val', ['']);
347 this.cell_element_function(floatrange_index, float_text_query, 'val', ['']);
348 this.sendKeys(float_text_query, '120');
348 this.sendKeys(float_text_query, '120');
349 });
349 });
350
350
351 this.wait(500); // Wait for change to execute in kernel
351 this.wait(500); // Wait for change to execute in kernel
352
352
353 index = this.append_cell('print(floatrange.value)\n');
353 index = this.append_cell('print(floatrange.value)\n');
354 this.execute_cell_then(index, function(index){
354 this.execute_cell_then(index, function(index){
355 this.test.assert(this.get_output_cell(index).text == '50.0\n',
355 this.test.assert(this.get_output_cell(index).text == '50.0\n',
356 'Float textbox value bound');
356 'Float textbox value bound');
357
357
358 // Clear the float textbox value and then set it to 'hello world' by
358 // Clear the float textbox value and then set it to 'hello world' by
359 // emulating keyboard presses. 'hello world' should get filtered...
359 // emulating keyboard presses. 'hello world' should get filtered...
360 this.cell_element_function(floatrange_index, float_text_query, 'val', ['']);
360 this.cell_element_function(floatrange_index, float_text_query, 'val', ['']);
361 this.sendKeys(float_text_query, 'hello world');
361 this.sendKeys(float_text_query, 'hello world');
362 });
362 });
363
363
364 this.wait(500); // Wait for change to execute in kernel
364 this.wait(500); // Wait for change to execute in kernel
365
365
366 index = this.append_cell('print(floatrange.value)\n');
366 index = this.append_cell('print(floatrange.value)\n');
367 this.execute_cell_then(index, function(index){
367 this.execute_cell_then(index, function(index){
368 this.test.assert(this.get_output_cell(index).text == '50.0\n',
368 this.test.assert(this.get_output_cell(index).text == '50.0\n',
369 'Invalid float textbox characters ignored');
369 'Invalid float textbox characters ignored');
370 });
370 });
371
371
372 // Test float widget ///////////////////////////////////////////////////////
372 // Test float widget ///////////////////////////////////////////////////////
373 var float_text_query_2 = '.widget-area .widget-subarea .widget-hbox-single .my-second-float-text';
373 var float_text_query_2 = '.widget-area .widget-subarea .widget-hbox-single .my-second-float-text';
374
374
375 var float_index = this.append_cell(
375 var float_index = this.append_cell(
376 'float_widget = widgets.FloatWidget()\n' +
376 'float_widget = widgets.FloatWidget()\n' +
377 'display(float_widget)\n' +
377 'display(float_widget)\n' +
378 'float_widget.add_class("my-second-float-text")\n' +
378 'float_widget.add_class("my-second-float-text")\n' +
379 'print("Success")\n');
379 'print("Success")\n');
380 this.execute_cell_then(float_index, function(index){
380 this.execute_cell_then(float_index, function(index){
381
381
382 this.test.assert(this.get_output_cell(index).text == 'Success\n',
382 this.test.assert(this.get_output_cell(index).text == 'Success\n',
383 'Create float cell executed with correct output.');
383 'Create float cell executed with correct output.');
384
384
385 this.test.assert(this.cell_element_exists(index,
385 this.test.assert(this.cell_element_exists(index,
386 '.widget-area .widget-subarea'),
386 '.widget-area .widget-subarea'),
387 'Widget subarea exists.');
387 'Widget subarea exists.');
388
388
389 this.test.assert(this.cell_element_exists(index, float_text_query_2),
389 this.test.assert(this.cell_element_exists(index, float_text_query_2),
390 'Widget float textbox exists.');
390 'Widget float textbox exists.');
391
391
392 this.cell_element_function(float_index, float_text_query_2, 'val', ['']);
392 this.cell_element_function(float_index, float_text_query_2, 'val', ['']);
393 this.sendKeys(float_text_query_2, '1.05');
393 this.sendKeys(float_text_query_2, '1.05');
394 });
394 });
395
395
396 this.wait(500); // Wait for change to execute in kernel
396 this.wait(500); // Wait for change to execute in kernel
397
397
398 index = this.append_cell('print(float_widget.value)\n');
398 index = this.append_cell('print(float_widget.value)\n');
399 this.execute_cell_then(index, function(index){
399 this.execute_cell_then(index, function(index){
400 this.test.assert(this.get_output_cell(index).text == '1.05\n',
400 this.test.assert(this.get_output_cell(index).text == '1.05\n',
401 'Float textbox value set.');
401 'Float textbox value set.');
402 this.cell_element_function(float_index, float_text_query_2, 'val', ['']);
402 this.cell_element_function(float_index, float_text_query_2, 'val', ['']);
403 this.sendKeys(float_text_query_2, '123456789.0');
403 this.sendKeys(float_text_query_2, '123456789.0');
404 });
404 });
405
405
406 this.wait(500); // Wait for change to execute in kernel
406 this.wait(500); // Wait for change to execute in kernel
407
407
408 index = this.append_cell('print(float_widget.value)\n');
408 index = this.append_cell('print(float_widget.value)\n');
409 this.execute_cell_then(index, function(index){
409 this.execute_cell_then(index, function(index){
410 this.test.assert(this.get_output_cell(index).text == '123456789.0\n',
410 this.test.assert(this.get_output_cell(index).text == '123456789.0\n',
411 'Long float textbox value set (probably triggers throttling).');
411 'Long float textbox value set (probably triggers throttling).');
412 this.cell_element_function(float_index, float_text_query_2, 'val', ['']);
412 this.cell_element_function(float_index, float_text_query_2, 'val', ['']);
413 this.sendKeys(float_text_query_2, '12hello');
413 this.sendKeys(float_text_query_2, '12hello');
414 });
414 });
415
415
416 this.wait(500); // Wait for change to execute in kernel
416 this.wait(500); // Wait for change to execute in kernel
417
417
418 index = this.append_cell('print(float_widget.value)\n');
418 index = this.append_cell('print(float_widget.value)\n');
419 this.execute_cell_then(index, function(index){
419 this.execute_cell_then(index, function(index){
420 this.test.assert(this.get_output_cell(index).text == '12.0\n',
420 this.test.assert(this.get_output_cell(index).text == '12.0\n',
421 'Invald float textbox value caught and filtered.');
421 'Invald float textbox value caught and filtered.');
422 });
422 });
423
423
424 // Test image widget ///////////////////////////////////////////////////////
424 // Test image widget ///////////////////////////////////////////////////////
425
425
426 // Get the temporary directory that the test server is running in.
426 // Get the temporary directory that the test server is running in.
427 var cwd = '';
427 var cwd = '';
428 index = this.append_cell('!echo $(pwd)');
428 index = this.append_cell('!echo $(pwd)');
429 this.execute_cell_then(index, function(index){
429 this.execute_cell_then(index, function(index){
430 cwd = this.get_output_cell(index).text.trim();
430 cwd = this.get_output_cell(index).text.trim();
431 });
431 });
432
432
433 test_jpg = '/9j/4AAQSkZJRgABAQEASABIAAD//gATQ3JlYXRlZCB3aXRoIEdJTVD/2wBDACAWGBwYFCAcGhwkIiAmMFA0MCwsMGJGSjpQdGZ6eHJmcG6AkLicgIiuim5woNqirr7EztDOfJri8uDI8LjKzsb/2wBDASIkJDAqMF40NF7GhHCExsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsb/wgARCAABAAEDAREAAhEBAxEB/8QAFAABAAAAAAAAAAAAAAAAAAAAA//EABUBAQEAAAAAAAAAAAAAAAAAAAME/9oADAMBAAIQAxAAAAECv//EABQQAQAAAAAAAAAAAAAAAAAAAAD/2gAIAQEAAQUCf//EABQRAQAAAAAAAAAAAAAAAAAAAAD/2gAIAQMBAT8Bf//EABQRAQAAAAAAAAAAAAAAAAAAAAD/2gAIAQIBAT8Bf//EABQQAQAAAAAAAAAAAAAAAAAAAAD/2gAIAQEABj8Cf//EABQQAQAAAAAAAAAAAAAAAAAAAAD/2gAIAQEAAT8hf//aAAwDAQACAAMAAAAQn//EABQRAQAAAAAAAAAAAAAAAAAAAAD/2gAIAQMBAT8Qf//EABQRAQAAAAAAAAAAAAAAAAAAAAD/2gAIAQIBAT8Qf//EABQQAQAAAAAAAAAAAAAAAAAAAAD/2gAIAQEAAT8Qf//Z';
433 test_jpg = '/9j/4AAQSkZJRgABAQEASABIAAD//gATQ3JlYXRlZCB3aXRoIEdJTVD/2wBDACAWGBwYFCAcGhwkIiAmMFA0MCwsMGJGSjpQdGZ6eHJmcG6AkLicgIiuim5woNqirr7EztDOfJri8uDI8LjKzsb/2wBDASIkJDAqMF40NF7GhHCExsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsbGxsb/wgARCAABAAEDAREAAhEBAxEB/8QAFAABAAAAAAAAAAAAAAAAAAAAA//EABUBAQEAAAAAAAAAAAAAAAAAAAME/9oADAMBAAIQAxAAAAECv//EABQQAQAAAAAAAAAAAAAAAAAAAAD/2gAIAQEAAQUCf//EABQRAQAAAAAAAAAAAAAAAAAAAAD/2gAIAQMBAT8Bf//EABQRAQAAAAAAAAAAAAAAAAAAAAD/2gAIAQIBAT8Bf//EABQQAQAAAAAAAAAAAAAAAAAAAAD/2gAIAQEABj8Cf//EABQQAQAAAAAAAAAAAAAAAAAAAAD/2gAIAQEAAT8hf//aAAwDAQACAAMAAAAQn//EABQRAQAAAAAAAAAAAAAAAAAAAAD/2gAIAQMBAT8Qf//EABQRAQAAAAAAAAAAAAAAAAAAAAD/2gAIAQIBAT8Qf//EABQQAQAAAAAAAAAAAAAAAAAAAAD/2gAIAQEAAT8Qf//Z';
434 test_results = '/9j/4AAQSkZJRgABAQEASABIAAD/2wBDAAgGBgcGBQgHBwcJCQgKDBQNDAsLDBkSEw8UHRofHh0aHBwgJC4nICIsIxwcKDcpLDAxNDQ0Hyc5PTgyPC4zNDL/2wBDAQkJCQwLDBgNDRgyIRwhMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjL/wAARCAAyADIDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwDi6KKK+ZP3EKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooA//Z';
434 test_results = '/9j/4AAQSkZJRgABAQEASABIAAD/2wBDAAgGBgcGBQgHBwcJCQgKDBQNDAsLDBkSEw8UHRofHh0aHBwgJC4nICIsIxwcKDcpLDAxNDQ0Hyc5PTgyPC4zNDL/2wBDAQkJCQwLDBgNDRgyIRwhMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjL/wAARCAAyADIDASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6erx8vP09fb3+Pn6/8QAHwEAAwEBAQEBAQEBAQAAAAAAAAECAwQFBgcICQoL/8QAtREAAgECBAQDBAcFBAQAAQJ3AAECAxEEBSExBhJBUQdhcRMiMoEIFEKRobHBCSMzUvAVYnLRChYkNOEl8RcYGRomJygpKjU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6goOEhYaHiImKkpOUlZaXmJmaoqOkpaanqKmqsrO0tba3uLm6wsPExcbHyMnK0tPU1dbX2Nna4uPk5ebn6Onq8vP09fb3+Pn6/9oADAMBAAIRAxEAPwDi6KKK+ZP3EKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooA//Z';
435
435
436 var image_index = this.append_cell(
436 var image_index = this.append_cell(
437 'import base64\n' +
437 'import base64\n' +
438 'data = base64.b64decode("' + test_jpg + '")\n' +
438 'data = base64.b64decode("' + test_jpg + '")\n' +
439 'image = widgets.ImageWidget()\n' +
439 'image = widgets.ImageWidget()\n' +
440 'image.image_format = "jpeg"\n' +
440 'image.image_format = "jpeg"\n' +
441 'image.value = data\n' +
441 'image.value = data\n' +
442 'image.width = "50px"\n' +
442 'image.width = "50px"\n' +
443 'image.height = "50px"\n' +
443 'image.height = "50px"\n' +
444 // Set css that will make the image render within the PhantomJS visible
444 // Set css that will make the image render within the PhantomJS visible
445 // window. If we don't do this, the captured image will be black.
445 // window. If we don't do this, the captured image will be black.
446 'image.set_css({"background": "blue", "z-index": "9999", "position": "fixed", "top": "0px", "left": "0px"})\n' +
446 'image.set_css({"background": "blue", "z-index": "9999", "position": "fixed", "top": "0px", "left": "0px"})\n' +
447 'display(image)\n' +
447 'display(image)\n' +
448 'image.add_class("my-test-image")\n' +
448 'image.add_class("my-test-image")\n' +
449 'print("Success")\n');
449 'print("Success")\n');
450 this.execute_cell_then(image_index, function(index){
450 this.execute_cell_then(image_index, function(index){
451
451
452 this.test.assert(this.get_output_cell(index).text == 'Success\n',
452 this.test.assert(this.get_output_cell(index).text == 'Success\n',
453 'Create image executed with correct output.');
453 'Create image executed with correct output.');
454
454
455 this.test.assert(this.cell_element_exists(index,
455 this.test.assert(this.cell_element_exists(index,
456 '.widget-area .widget-subarea'),
456 '.widget-area .widget-subarea'),
457 'Widget subarea exists.');
457 'Widget subarea exists.');
458
458
459 this.test.assert(this.cell_element_exists(index,
459 this.test.assert(this.cell_element_exists(index,
460 '.widget-area .widget-subarea img'),
460 '.widget-area .widget-subarea img'),
461 'Image exists.');
461 'Image exists.');
462
462
463 // Capture a screenshot of the img element as a base64 string.
463 // Capture a screenshot of the img element as a base64 string.
464 var fs = require('fs');
464 var fs = require('fs');
465 capture_filename = cwd + fs.separator + 'captured.jpg';
465 capture_filename = cwd + fs.separator + 'captured.jpg';
466 this.captureSelector(capture_filename, '.my-test-image');
466 this.captureSelector(capture_filename, '.my-test-image');
467 var stream = fs.open(capture_filename, 'rb');
467 var stream = fs.open(capture_filename, 'rb');
468 var captured = btoa(stream.read());
468 var captured = btoa(stream.read());
469 stream.close()
469 stream.close()
470 fs.remove(capture_filename);
470 fs.remove(capture_filename);
471
471
472 // Uncomment line below to output captured image data to a text file.
472 // Uncomment line below to output captured image data to a text file.
473 // fs.write('./captured.txt', captured, 'w');
473 // fs.write('./captured.txt', captured, 'w');
474
474
475 this.test.assert(test_results==captured, "Red image data displayed correctly.");
475 this.test.assert(test_results==captured, "Red image data displayed correctly.");
476 });
476 });
477
477
478 });
478 // Test int range widget /////////////////////////////////////////////////
479 var int_text_query = '.widget-area .widget-subarea .widget-hbox-single .my-second-num-test-text';
480
481 var intrange_index = this.append_cell(
482 'intrange = widgets.IntRangeWidget()\n' +
483 'display(intrange, view_name="IntTextView")\n' +
484 'intrange.add_class("my-second-num-test-text")\n' +
485 'display(intrange)\n' +
486 'print("Success")\n');
487 this.execute_cell_then(intrange_index, function(index){
488
489 this.test.assert(this.get_output_cell(index).text == 'Success\n',
490 'Create int range cell executed with correct output.');
491
492 this.test.assert(this.cell_element_exists(index,
493 '.widget-area .widget-subarea'),
494 'Widget subarea exists.');
495
496 this.test.assert(this.cell_element_exists(index, slider_query),
497 'Widget slider exists.');
498
499 this.test.assert(this.cell_element_exists(index, int_text_query),
500 'Widget int textbox exists.');
501 });
502
503 index = this.append_cell(
504 'intrange.max = 50\n' +
505 'intrange.min = -50\n' +
506 'intrange.value = 25\n' +
507 'print("Success")\n');
508 this.execute_cell_then(index, function(index){
509
510 this.test.assert(this.get_output_cell(index).text == 'Success\n',
511 'Int range properties cell executed with correct output.');
512
513 this.test.assert(this.cell_element_exists(intrange_index, slider_query),
514 'Widget slider exists.');
515
516 this.test.assert(this.cell_element_function(intrange_index, slider_query,
517 'slider', ['value']) == 25,
518 'Slider set to Python value.');
519
520 this.test.assert(this.cell_element_function(intrange_index, int_text_query,
521 'val') == 25, 'Int textbox set to Python value.');
522
523 // Clear the int textbox value and then set it to 1 by emulating
524 // keyboard presses.
525 this.cell_element_function(intrange_index, int_text_query, 'val', ['']);
526 this.sendKeys(int_text_query, '1');
527 });
528
529 this.wait(500); // Wait for change to execute in kernel
530
531 index = this.append_cell('print(intrange.value)\n');
532 this.execute_cell_then(index, function(index){
533 this.test.assert(this.get_output_cell(index).text == '1\n',
534 'Int textbox set int range value');
535
536 // Clear the int textbox value and then set it to 120 by emulating
537 // keyboard presses.
538 this.cell_element_function(intrange_index, int_text_query, 'val', ['']);
539 this.sendKeys(int_text_query, '120');
540 });
541
542 this.wait(500); // Wait for change to execute in kernel
479
543
544 index = this.append_cell('print(intrange.value)\n');
545 this.execute_cell_then(index, function(index){
546 this.test.assert(this.get_output_cell(index).text == '50\n',
547 'Int textbox value bound');
548
549 // Clear the int textbox value and then set it to 'hello world' by
550 // emulating keyboard presses. 'hello world' should get filtered...
551 this.cell_element_function(intrange_index, int_text_query, 'val', ['']);
552 this.sendKeys(int_text_query, 'hello world');
553 });
554
555 this.wait(500); // Wait for change to execute in kernel
556
557 index = this.append_cell('print(intrange.value)\n');
558 this.execute_cell_then(index, function(index){
559 this.test.assert(this.get_output_cell(index).text == '50\n',
560 'Invalid int textbox characters ignored');
561 });
562
563 // Test int widget ///////////////////////////////////////////////////////
564 var int_text_query_2 = '.widget-area .widget-subarea .widget-hbox-single .my-second-int-text';
565
566 var int_index = this.append_cell(
567 'int_widget = widgets.IntWidget()\n' +
568 'display(int_widget)\n' +
569 'int_widget.add_class("my-second-int-text")\n' +
570 'print("Success")\n');
571 this.execute_cell_then(int_index, function(index){
572
573 this.test.assert(this.get_output_cell(index).text == 'Success\n',
574 'Create int cell executed with correct output.');
575
576 this.test.assert(this.cell_element_exists(index,
577 '.widget-area .widget-subarea'),
578 'Widget subarea exists.');
480
579
580 this.test.assert(this.cell_element_exists(index, int_text_query_2),
581 'Widget int textbox exists.');
582
583 this.cell_element_function(int_index, int_text_query_2, 'val', ['']);
584 this.sendKeys(int_text_query_2, '1.05');
585 });
586
587 this.wait(500); // Wait for change to execute in kernel
588
589 index = this.append_cell('print(int_widget.value)\n');
590 this.execute_cell_then(index, function(index){
591 this.test.assert(this.get_output_cell(index).text == '1\n',
592 'Int textbox value set.');
593 this.cell_element_function(int_index, int_text_query_2, 'val', ['']);
594 this.sendKeys(int_text_query_2, '123456789');
595 });
596
597 this.wait(500); // Wait for change to execute in kernel
598
599 index = this.append_cell('print(int_widget.value)\n');
600 this.execute_cell_then(index, function(index){
601 this.test.assert(this.get_output_cell(index).text == '123456789\n',
602 'Long int textbox value set (probably triggers throttling).');
603 this.cell_element_function(int_index, int_text_query_2, 'val', ['']);
604 this.sendKeys(int_text_query_2, '12hello');
605 });
606
607 this.wait(500); // Wait for change to execute in kernel
608
609 index = this.append_cell('print(int_widget.value)\n');
610 this.execute_cell_then(index, function(index){
611 this.test.assert(this.get_output_cell(index).text == '12\n',
612 'Invald int textbox value caught and filtered.');
613 });
614 });
General Comments 0
You need to be logged in to leave comments. Login now