mirror of
https://github.com/rstudio/shiny.git
synced 2026-02-02 10:45:06 -05:00
1625 lines
50 KiB
JavaScript
1625 lines
50 KiB
JavaScript
/*jshint forin:true, noarg:true, noempty:true, eqeqeq:true, bitwise:true,
|
|
strict:false, undef:true, unused:true, browser:true, jquery:true, maxerr:50,
|
|
curly:false, multistr:true */
|
|
/*global Shiny*/
|
|
/*global describe, it, expect, beforeEach, afterEach*/
|
|
|
|
describe("Input Bindings", function() {
|
|
|
|
// How to talk to an input binding (the long way)
|
|
// $obj = $('.shiny-bound-input#in_text');
|
|
// $obj.data('shiny-input-binding').receiveMessage($obj[0], {value: "foo"})
|
|
|
|
var select_input_object = function(id) {
|
|
return $('.shiny-bound-input#' + id);
|
|
};
|
|
|
|
// Given the name of the input binding, return the corresponding inputBinding
|
|
// object.
|
|
var get_input_binding_name = function(name) {
|
|
return Shiny.inputBindings.bindingNames['shiny.' + name].binding;
|
|
};
|
|
|
|
// Given the id of an input object, return the corresponding inputBinding
|
|
// object.
|
|
var get_input_binding_id = function(id) {
|
|
return select_input_object(id).data('shiny-input-binding');
|
|
};
|
|
|
|
var get_value = function(id) {
|
|
var $obj = select_input_object(id);
|
|
return get_input_binding_id(id).getValue($obj[0]);
|
|
};
|
|
|
|
var set_value = function(id, value) {
|
|
var $obj = select_input_object(id);
|
|
return get_input_binding_id(id).setValue($obj[0], value);
|
|
};
|
|
|
|
var receive_message = function(id, data) {
|
|
var $obj = select_input_object(id);
|
|
get_input_binding_id(id).receiveMessage($obj[0], data);
|
|
};
|
|
|
|
var get_state = function(id) {
|
|
var $obj = select_input_object(id);
|
|
return get_input_binding_id(id).getState($obj[0]);
|
|
};
|
|
|
|
function padZeros(n, digits) {
|
|
var str = n.toString();
|
|
while (str.length < digits)
|
|
str = "0" + str;
|
|
return str;
|
|
}
|
|
|
|
// Get a date string with format yyyy-mm-dd (date is in local time)
|
|
function local_date_string() {
|
|
var date = new Date();
|
|
|
|
return date.getFullYear() + '-' +
|
|
padZeros(date.getMonth()+1, 2) + '-' +
|
|
padZeros(date.getDate(), 2);
|
|
}
|
|
|
|
|
|
// These functions are here to reduce repetition. They are exactly the same
|
|
// across different input bindings.
|
|
|
|
var common_tests = function(id, binding_name) {
|
|
|
|
it("select the object by id", function() {
|
|
var $obj = select_input_object(id);
|
|
expect($obj.length).toBe(1);
|
|
});
|
|
|
|
it("find the input binding", function() {
|
|
// Should be able to find it by binding name
|
|
expect(get_input_binding_name(binding_name)).not.toBeNull();
|
|
|
|
// Should be same as when we retrieve it using input object id
|
|
expect(get_input_binding_name(binding_name)).toBe(get_input_binding_id(id));
|
|
});
|
|
|
|
it("find() works", function() {
|
|
var $obj = select_input_object(id);
|
|
var input_binding = get_input_binding_name(binding_name);
|
|
var find_result = input_binding.find(document).filter('#' + id);
|
|
|
|
expect(find_result.length).toBe(1);
|
|
expect(find_result instanceof jQuery).toBe(true);
|
|
|
|
// Need to extract first element for testing equality of jQuery objects
|
|
expect(find_result[0]).toBe($obj[0]);
|
|
});
|
|
|
|
it("getId() works", function() {
|
|
var $obj = select_input_object(id);
|
|
var input_binding = get_input_binding_name(binding_name);
|
|
|
|
expect(input_binding.getId($obj[0])).toEqual(id);
|
|
});
|
|
|
|
it("getRatePolicy() works", function() {
|
|
var input_binding = get_input_binding_name(binding_name);
|
|
var rate_policy = input_binding.getRatePolicy();
|
|
var valid_policies = ['direct', 'debounce', 'throttle'];
|
|
var timed_policies = ['debounce', 'throttle'];
|
|
|
|
// The policy can be null. If so, don't continue onto other expectations
|
|
if (rate_policy === null)
|
|
return;
|
|
|
|
// If the policy is in valid_policies, then $.inArray should not return -1
|
|
expect($.inArray(rate_policy.policy, valid_policies)).not.toBe(-1);
|
|
|
|
// If it's a policy that requires a specified delay, check for delay
|
|
if ($.inArray(rate_policy.policy, timed_policies) !== -1) {
|
|
expect(typeof rate_policy.delay).toBe('number');
|
|
}
|
|
});
|
|
|
|
// it("subscribe() works", function() {
|
|
// // TODO
|
|
// });
|
|
|
|
// it("unsubscribe() works", function() {
|
|
// // TODO
|
|
// });
|
|
|
|
};
|
|
|
|
|
|
// ===========================================================================
|
|
describe("textInputBinding", function() {
|
|
var id = 'in_text'; // id of the DOM object
|
|
var binding_name = 'textInput'; // Name of the input binding in the registry
|
|
|
|
beforeEach(function(){
|
|
var htmlstring =
|
|
'<label for="' + id + '">Text input:</label>\
|
|
<input id="' + id + '" type="text" value="starting value"/>';
|
|
|
|
// Wrapper div for the htmlstring
|
|
var el = $('<div id="input_binding_test">').prependTo('body');
|
|
el.html(htmlstring);
|
|
Shiny.bindAll();
|
|
});
|
|
|
|
afterEach(function(){
|
|
Shiny.unbindAll();
|
|
$('#input_binding_test').remove();
|
|
});
|
|
|
|
|
|
// Run tests that are exactly the same for all InputBindings
|
|
common_tests(id, binding_name);
|
|
|
|
|
|
it("getValue() works", function() {
|
|
expect(get_value(id)).toEqual('starting value');
|
|
});
|
|
|
|
it("setValue() works", function() {
|
|
set_value(id, 'value 2');
|
|
expect(get_value(id)).toEqual('value 2');
|
|
});
|
|
|
|
it("getState() works", function() {
|
|
expect(get_state(id)).toEqual({ label : 'Text input:', value:"starting value" });
|
|
|
|
receive_message(id, { value:"foo" });
|
|
expect(get_state(id)).toEqual({ label : 'Text input:', value:"foo" });
|
|
});
|
|
|
|
it("receiveMessage() works", function() {
|
|
receive_message(id, { value:"foo" });
|
|
expect(get_value(id)).toBe("foo");
|
|
|
|
// Set and check the value again
|
|
receive_message(id, { value:"bar" });
|
|
expect(get_value(id)).toBe("bar");
|
|
|
|
// Set label
|
|
receive_message(id, { label: "new label", value:"foo" });
|
|
expect(get_state(id)).toEqual({ label: "new label", value:"foo" });
|
|
});
|
|
|
|
});
|
|
|
|
// ===========================================================================
|
|
describe("numberInputBinding", function() {
|
|
var id = 'in_number';
|
|
var binding_name = 'numberInput'; // Name of the input binding in the registry
|
|
|
|
beforeEach(function(){
|
|
var htmlstring =
|
|
'<label for="' + id + '">Numeric input:</label>\
|
|
<input id="' + id + '" type="number" value="8" min="4" max="10" step="0.5"/>';
|
|
|
|
// Wrapper div for the htmlstring
|
|
var el = $('<div id="input_binding_test">').prependTo('body');
|
|
el.html(htmlstring);
|
|
Shiny.bindAll();
|
|
});
|
|
|
|
afterEach(function(){
|
|
Shiny.unbindAll();
|
|
$('#input_binding_test').remove();
|
|
});
|
|
|
|
// Run tests that are exactly the same for all InputBindings
|
|
common_tests(id, binding_name);
|
|
|
|
|
|
it("getValue() works", function() {
|
|
expect(get_value(id)).toBe(8);
|
|
});
|
|
|
|
it("setValue() works", function() {
|
|
set_value(id, 5);
|
|
expect(get_value(id)).toBe(5);
|
|
|
|
// getValue should coerce to number
|
|
set_value(id, '6');
|
|
expect(get_value(id)).toBe(6);
|
|
|
|
// getValue should return the numeric value when input is scientific notation
|
|
set_value(id, '1e6');
|
|
expect(get_value(id)).toBe(1000000);
|
|
});
|
|
|
|
it("getState() works", function() {
|
|
expect(get_state(id)).toEqual(
|
|
{ label:'Numeric input:', value:8, min:4, max:10, step:0.5 });
|
|
|
|
receive_message(id, { min:5, value:5, max:5, step:0.2 });
|
|
expect(get_state(id)).toEqual(
|
|
{ label:'Numeric input:', min:5, value:5, max:5, step:0.2 });
|
|
});
|
|
|
|
it("receiveMessage() works", function() {
|
|
// Set value
|
|
// getValue() and getState().value should be the same
|
|
receive_message(id, { value:7.5 });
|
|
expect(get_value(id)).toBe(7.5);
|
|
expect(get_state(id).value).toBe(7.5);
|
|
|
|
// Setting min, max, step shouldn't affect value
|
|
receive_message(id, { min:-5 , max:20, step:0.25 });
|
|
expect(get_value(id)).toBe(7.5);
|
|
|
|
receive_message(id, { min:5, value:5, max:5, step:0.2 });
|
|
expect(get_value(id)).toBe(5);
|
|
|
|
// Set label
|
|
receive_message(id, { label:'new label', value:5 });
|
|
expect(get_state(id)).toEqual(
|
|
{ label:'new label', min:5, value:5, max:5, step:0.2 });
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
// ===========================================================================
|
|
describe("checkboxInputBinding", function() {
|
|
var id = 'in_checkbox';
|
|
var binding_name = 'checkboxInput'; // Name of the input binding in the registry
|
|
|
|
beforeEach(function(){
|
|
var htmlstring =
|
|
'<label class="checkbox" for="' + id + '">\
|
|
<input id="' + id + '" type="checkbox"/>\
|
|
<span>Checkbox input:</span>\
|
|
</label>';
|
|
|
|
// Wrapper div for the htmlstring
|
|
var el = $('<div id="input_binding_test">').prependTo('body');
|
|
el.html(htmlstring);
|
|
Shiny.bindAll();
|
|
});
|
|
|
|
afterEach(function(){
|
|
Shiny.unbindAll();
|
|
$('#input_binding_test').remove();
|
|
});
|
|
|
|
|
|
// Run tests that are exactly the same for all InputBindings
|
|
common_tests(id, binding_name);
|
|
|
|
|
|
it("getValue() works", function() {
|
|
expect(get_value(id)).toBe(false);
|
|
});
|
|
|
|
it("setValue() works", function() {
|
|
set_value(id, false);
|
|
expect(get_value(id)).toBe(false);
|
|
|
|
set_value(id, true);
|
|
expect(get_value(id)).toBe(true);
|
|
});
|
|
|
|
it("getState() works", function() {
|
|
expect(get_state(id)).toEqual({ label:'Checkbox input:', value:false });
|
|
|
|
receive_message(id, { value:true });
|
|
expect(get_state(id)).toEqual({ label:'Checkbox input:', value:true });
|
|
});
|
|
|
|
it("receiveMessage() works", function() {
|
|
// Should use 'value', and ignore 'checked'
|
|
receive_message(id, { value:true, checked:false });
|
|
expect(get_state(id)).toEqual({ label:'Checkbox input:', value:true });
|
|
|
|
receive_message(id, { checked:false });
|
|
expect(get_state(id)).toEqual({ label:'Checkbox input:', value:true });
|
|
|
|
// Empty message has no effect
|
|
receive_message(id, { });
|
|
expect(get_state(id)).toEqual({ label:'Checkbox input:', value:true });
|
|
|
|
// Set label
|
|
receive_message(id, { label:'new label' });
|
|
expect(get_state(id)).toEqual({ label:'new label', value:true });
|
|
});
|
|
});
|
|
|
|
|
|
|
|
// ===========================================================================
|
|
describe("sliderInputBinding", function() {
|
|
var id = 'in_slider';
|
|
var binding_name = 'sliderInput'; // Name of the input binding in the registry
|
|
|
|
beforeEach(function(){
|
|
var htmlstring =
|
|
'<div>\
|
|
<label class="control-label" for="' + id + '">Slider input:</label>\
|
|
<input id="' + id + '" type="slider" name="' + id + '" value="20"\
|
|
class="jslider" data-from="5" data-to="40" data-step="1"\
|
|
data-skin="plastic" data-round="false" data-locale="us"\
|
|
data-format="#,##0.#####" data-smooth="false"/>\
|
|
</div>';
|
|
|
|
// Wrapper div for the htmlstring
|
|
var el = $('<div id="input_binding_test">').prependTo('body');
|
|
el.html(htmlstring);
|
|
Shiny.bindAll();
|
|
});
|
|
|
|
afterEach(function(){
|
|
Shiny.unbindAll();
|
|
$('#input_binding_test').remove();
|
|
});
|
|
|
|
// Run tests that are exactly the same for all InputBindings
|
|
common_tests(id, binding_name);
|
|
|
|
it("getValue() works", function() {
|
|
expect(get_value(id)).toBe(20);
|
|
});
|
|
|
|
it("setValue() works", function() {
|
|
set_value(id, 5);
|
|
expect(get_value(id)).toBe(5);
|
|
|
|
// setValue should coerce to number
|
|
set_value(id, '6');
|
|
expect(get_value(id)).toBe(6);
|
|
|
|
// Sould round value to nearest step
|
|
set_value(id, '7.8');
|
|
expect(get_value(id)).toBe(8);
|
|
|
|
// Below min: should report min
|
|
set_value(id, 2);
|
|
expect(get_value(id)).toBe(5);
|
|
|
|
// Above max: should report max
|
|
set_value(id, 100);
|
|
expect(get_value(id)).toBe(40);
|
|
});
|
|
|
|
it("getState() works", function() {
|
|
expect(get_state(id)).toEqual({
|
|
label: 'Slider input:',
|
|
value:20, min:5, max:40, step:1, round:false,
|
|
format:"#,##0.#####", locale:"us"
|
|
});
|
|
|
|
// Are format and locale needed?
|
|
// TODO: deal with animate?
|
|
|
|
// receive_message(id, { min:5, value:5, max:5, step:0.2 });
|
|
// expect(get_state(id)).toEqual({ min:5, value:5, max:5, step:0.2 });
|
|
});
|
|
|
|
it("receiveMessage() works", function() {
|
|
// Set value
|
|
// getValue() and getState().value should be the same
|
|
receive_message(id, { value:6 });
|
|
expect(get_value(id)).toBe(6);
|
|
expect(get_state(id).value).toEqual(6);
|
|
expect(get_state(id).label).toEqual('Slider input:');
|
|
|
|
// Sould round value to nearest step
|
|
receive_message(id, { value:7.8 });
|
|
expect(get_state(id).value).toEqual(8);
|
|
|
|
// Empty message has no effect
|
|
receive_message(id, { });
|
|
expect(get_state(id).value).toEqual(8);
|
|
|
|
// Set label
|
|
receive_message(id, { label:'new label' });
|
|
expect(get_state(id).value).toEqual(8);
|
|
expect(get_state(id).label).toEqual('new label');
|
|
|
|
// Setting other values isn't implemented yet
|
|
});
|
|
});
|
|
|
|
|
|
// ===========================================================================
|
|
describe("sliderInputBinding with range (two values)", function() {
|
|
var id = 'in_slider';
|
|
|
|
beforeEach(function(){
|
|
var htmlstring =
|
|
'<div>\
|
|
<label class="control-label" for="' + id + '">Slider input:</label>\
|
|
<input id="' + id + '" type="slider" name="' + id + '" value="10;30"\
|
|
class="jslider" data-from="5" data-to="40" data-step="1"\
|
|
data-skin="plastic" data-round="false" data-locale="us"\
|
|
data-format="#,##0.#####" data-smooth="false"/>\
|
|
</div>';
|
|
|
|
// Wrapper div for the htmlstring
|
|
var el = $('<div id="input_binding_test">').prependTo('body');
|
|
el.html(htmlstring);
|
|
Shiny.bindAll();
|
|
});
|
|
|
|
afterEach(function(){
|
|
Shiny.unbindAll();
|
|
$('#input_binding_test').remove();
|
|
});
|
|
|
|
it("getValue() works", function() {
|
|
expect(get_value(id)).toEqual([10, 30]);
|
|
});
|
|
|
|
it("setValue() works", function() {
|
|
set_value(id, [15, 25]);
|
|
expect(get_value(id)).toEqual([15, 25]);
|
|
|
|
// setValue should coerce to number
|
|
set_value(id, ['16', '26']);
|
|
expect(get_value(id)).toEqual([16, 26]);
|
|
|
|
// Min and max in wrong order: Behavior not defined, so don't run test
|
|
// set_value(id, [25, 15]);
|
|
// expect(get_value(id)).toEqual([25, 15]);
|
|
|
|
// Below min and above max: should go to min and max
|
|
set_value(id, [0, 100]);
|
|
expect(get_value(id)).toEqual([5, 40]);
|
|
|
|
// Set single value: only changes lower
|
|
set_value(id, 15);
|
|
expect(get_value(id)).toEqual([15, 40]);
|
|
|
|
// Pass null: no effect on value when null
|
|
set_value(id, [null, 25]);
|
|
expect(get_value(id)).toEqual([15, 25]);
|
|
set_value(id, [10, null]);
|
|
expect(get_value(id)).toEqual([10, 25]);
|
|
});
|
|
|
|
it("getState() works", function() {
|
|
expect(get_state(id)).toEqual({
|
|
label: 'Slider input:',
|
|
value:[10, 30], min:5, max:40, step:1, round:false,
|
|
format:"#,##0.#####", locale:"us"
|
|
});
|
|
});
|
|
|
|
it("receiveMessage() works", function() {
|
|
// Set value
|
|
// getValue() and getState().value should be the same
|
|
receive_message(id, { value:[6, 20] });
|
|
expect(get_value(id)).toEqual([6, 20]);
|
|
expect(get_state(id).value).toEqual([6, 20]);
|
|
expect(get_state(id).label).toEqual('Slider input:');
|
|
|
|
// Empty message has no effect
|
|
receive_message(id, { });
|
|
expect(get_state(id).value).toEqual([6, 20]);
|
|
expect(get_state(id).label).toEqual('Slider input:');
|
|
|
|
// Pass null: no effect on value when null
|
|
receive_message(id, { value:[null, 25] });
|
|
expect(get_state(id).value).toEqual([6, 25]);
|
|
receive_message(id, { value:[10, null] });
|
|
expect(get_state(id).value).toEqual([10, 25]);
|
|
|
|
// Set label
|
|
receive_message(id, { label:'new label' });
|
|
expect(get_state(id).value).toEqual([10, 25]);
|
|
expect(get_state(id).label).toEqual('new label');
|
|
|
|
// Setting other values isn't implemented yet
|
|
});
|
|
});
|
|
|
|
|
|
// ===========================================================================
|
|
describe("dateInputBinding", function() {
|
|
var id = 'in_date';
|
|
var binding_name = 'dateInput';
|
|
|
|
beforeEach(function(){
|
|
// Generated by:
|
|
// cat(format(dateInput('id', 'Date input:', value = '2013-04-10')))
|
|
var htmlstring =
|
|
'<div id="' + id + '"\
|
|
class="shiny-date-input">\
|
|
<label class="control-label" for="' + id + '">Date input:</label>\
|
|
<input type="text"\
|
|
name="date"\
|
|
class="input-medium datepicker"\
|
|
data-date-language="en"\
|
|
data-date-weekstart="0"\
|
|
data-date-format="yyyy-mm-dd"\
|
|
data-date-start-view="month"\
|
|
data-initial-date="2013-04-10"/>\
|
|
</div>';
|
|
|
|
// Wrapper div for the htmlstring
|
|
var el = $('<div id="input_binding_test">').prependTo('body');
|
|
el.html(htmlstring);
|
|
|
|
Shiny.initializeInputs(el);
|
|
Shiny.bindAll();
|
|
});
|
|
|
|
afterEach(function(){
|
|
Shiny.unbindAll();
|
|
$('#input_binding_test').remove();
|
|
});
|
|
|
|
// Run tests that are exactly the same for all InputBindings
|
|
common_tests(id, binding_name);
|
|
|
|
it("getValue() works", function() {
|
|
expect(get_value(id)).toEqual('2013-04-10');
|
|
});
|
|
|
|
it("setValue() works", function() {
|
|
set_value(id, '2012-02-29');
|
|
expect(get_value(id)).toEqual('2012-02-29');
|
|
|
|
// Invalid date - no effect
|
|
set_value(id, '2012-02-40');
|
|
expect(get_value(id)).toEqual('2012-02-29');
|
|
|
|
// Date object
|
|
set_value(id, new Date('2011-10-09'));
|
|
expect(get_value(id)).toEqual('2011-10-09');
|
|
|
|
// Invalid Date object - no effect
|
|
set_value(id, new Date('2000-01-100'));
|
|
expect(get_value(id)).toEqual('2011-10-09');
|
|
});
|
|
|
|
it("getState() works", function() {
|
|
expect(get_state(id)).toEqual({
|
|
label: 'Date input:',
|
|
value: '2013-04-10',
|
|
valueString : '2013-04-10',
|
|
min: null,
|
|
max: null,
|
|
language: 'en',
|
|
weekstart: 0,
|
|
format: 'yyyy-mm-dd',
|
|
startview: 'month'
|
|
});
|
|
});
|
|
|
|
it("receiveMessage() works", function() {
|
|
// Set value
|
|
// getValue() and getState().value should be the same
|
|
receive_message(id, { value: '2012-02-29' });
|
|
var fullstate = {
|
|
label: 'Date input:',
|
|
value: '2012-02-29',
|
|
valueString: '2012-02-29',
|
|
min: null,
|
|
max: null,
|
|
language: 'en',
|
|
weekstart: 0,
|
|
format: 'yyyy-mm-dd',
|
|
startview: 'month'
|
|
};
|
|
expect(get_value(id)).toEqual('2012-02-29');
|
|
expect(get_state(id)).toEqual(fullstate);
|
|
|
|
// Empty message has no effect
|
|
receive_message(id, { });
|
|
expect(get_state(id)).toEqual(fullstate);
|
|
|
|
// Set label
|
|
receive_message(id, { label:'new label' });
|
|
expect(get_state(id)).toEqual(
|
|
$.extend(fullstate, { label:'new label' })
|
|
);
|
|
|
|
// Set min and max
|
|
receive_message(id, { min:'2011-03-02', max:'2012-03-02' });
|
|
expect(get_state(id)).toEqual(
|
|
$.extend(fullstate, { min:'2011-03-02', max:'2012-03-02' })
|
|
);
|
|
|
|
// Unset min and max
|
|
receive_message(id, { min:null, max:null });
|
|
expect(get_state(id)).toEqual(
|
|
$.extend(fullstate, { min:null, max:null })
|
|
);
|
|
|
|
// Setting format isn't implemented
|
|
});
|
|
});
|
|
|
|
|
|
// ===========================================================================
|
|
describe("dateInputBinding with mm/dd/yy format, min, max, and startview", function() {
|
|
var id = 'in_date';
|
|
|
|
beforeEach(function(){
|
|
// Generated by:
|
|
// cat(format(dateInput('id', 'Date input:',
|
|
// value = '2013-04-10', min = '2012-02-01', max = '2012-05-04',
|
|
// format = 'mm/dd/yy', startview = 'decade', language = 'de', weekstart = 1)))
|
|
var htmlstring =
|
|
'<div id="' + id + '"\
|
|
class="shiny-date-input">\
|
|
<label class="control-label" for="' + id + '">Date input:</label>\
|
|
<input type="text"\
|
|
class="input-medium datepicker"\
|
|
data-date-language="de"\
|
|
data-date-weekstart="1"\
|
|
data-date-format="mm/dd/yy"\
|
|
data-date-start-view="decade"\
|
|
data-min-date="2012-02-01"\
|
|
data-max-date="2013-05-04"\
|
|
data-initial-date="2013-04-10"/>\
|
|
</div>';
|
|
|
|
// Wrapper div for the htmlstring
|
|
var el = $('<div id="input_binding_test">').prependTo('body');
|
|
el.html(htmlstring);
|
|
|
|
Shiny.initializeInputs(el);
|
|
Shiny.bindAll();
|
|
});
|
|
|
|
afterEach(function(){
|
|
Shiny.unbindAll();
|
|
$('#input_binding_test').remove();
|
|
});
|
|
|
|
it("getValue() works", function() {
|
|
expect(get_value(id)).toEqual('2013-04-10');
|
|
});
|
|
|
|
it("setValue() works", function() {
|
|
set_value(id, '2012-02-29');
|
|
expect(get_value(id)).toEqual('2012-02-29');
|
|
|
|
// Invalid date - no effect
|
|
set_value(id, '2012-02-40');
|
|
expect(get_value(id)).toEqual('2012-02-29');
|
|
|
|
// Date object
|
|
set_value(id, new Date('2011-10-09'));
|
|
expect(get_value(id)).toEqual('2011-10-09');
|
|
|
|
// Invalid Date object - no effect
|
|
set_value(id, new Date('2000-01-100'));
|
|
expect(get_value(id)).toEqual('2011-10-09');
|
|
});
|
|
|
|
it("getState() works", function() {
|
|
expect(get_state(id)).toEqual({
|
|
label: 'Date input:',
|
|
value: '2013-04-10',
|
|
valueString : '04/10/13',
|
|
min: "2012-02-01",
|
|
max: "2013-05-04",
|
|
language: 'de',
|
|
weekstart: 1,
|
|
format: 'mm/dd/yy',
|
|
startview: 'decade'
|
|
});
|
|
});
|
|
|
|
it("receiveMessage() works", function() {
|
|
// Set value
|
|
// getValue() and getState().value should be the same
|
|
receive_message(id, { value: '2012-02-29' });
|
|
var fullstate = {
|
|
label: 'Date input:',
|
|
value: '2012-02-29',
|
|
valueString: '02/29/12',
|
|
min: "2012-02-01",
|
|
max: "2013-05-04",
|
|
language: 'de',
|
|
weekstart: 1,
|
|
format: 'mm/dd/yy',
|
|
startview: 'decade'
|
|
};
|
|
expect(get_value(id)).toEqual('2012-02-29');
|
|
expect(get_state(id)).toEqual(fullstate);
|
|
|
|
// Empty message has no effect
|
|
receive_message(id, { });
|
|
expect(get_state(id)).toEqual(fullstate);
|
|
|
|
// Set label
|
|
receive_message(id, { label:'new label' });
|
|
expect(get_state(id)).toEqual(
|
|
$.extend(fullstate, { label:'new label' })
|
|
);
|
|
|
|
// Set min and max
|
|
// receive_message(id, { min:'2011-02-01', max:'2015-03-02' });
|
|
// debugger;
|
|
// expect(get_state(id)).toEqual(
|
|
// $.extend(fullstate, { min:'2011-02-01', max:'2015-03-02' })
|
|
// );
|
|
|
|
// Setting format isn't implemented
|
|
});
|
|
});
|
|
|
|
|
|
// ===========================================================================
|
|
describe("dateInputBinding with empty starting value", function() {
|
|
var id = 'in_date';
|
|
|
|
beforeEach(function(){
|
|
// Generated by (with some settings removed):
|
|
// cat(format(dateInput('id', 'Date input:')))
|
|
var htmlstring =
|
|
'<div id="' + id + '"\
|
|
class="shiny-date-input">\
|
|
<label class="control-label" for="' + id + '">Date input:</label>\
|
|
<input type="text"\
|
|
class="input-medium datepicker"/>\
|
|
</div>';
|
|
|
|
// Wrapper div for the htmlstring
|
|
var el = $('<div id="input_binding_test">').prependTo('body');
|
|
el.html(htmlstring);
|
|
|
|
Shiny.initializeInputs(el);
|
|
Shiny.bindAll();
|
|
});
|
|
|
|
afterEach(function(){
|
|
Shiny.unbindAll();
|
|
$('#input_binding_test').remove();
|
|
});
|
|
|
|
it("default value is local date", function() {
|
|
expect(get_value(id)).toEqual(local_date_string());
|
|
});
|
|
});
|
|
|
|
|
|
// ===========================================================================
|
|
describe("dateRangeInputBinding", function() {
|
|
var id = 'in_daterange';
|
|
var binding_name = 'dateRangeInput';
|
|
|
|
beforeEach(function(){
|
|
// Generated by:
|
|
// cat(format(dateRangeInput('id', 'Date range input:',
|
|
// start = '2012-02-09', end = '2013-03-01')))
|
|
var htmlstring =
|
|
'<div id="' + id + '" class="shiny-date-range-input input-daterange">\
|
|
<label class="control-label" for="' + id + '">Date range input:</label>\
|
|
<input\
|
|
class="input-small"\
|
|
type="text"\
|
|
data-date-language="en"\
|
|
data-date-weekstart="0"\
|
|
data-date-format="yyyy-mm-dd"\
|
|
data-date-start-view="month"\
|
|
data-initial-date="2012-02-29"/>\
|
|
to \
|
|
<input\
|
|
class="input-small"\
|
|
type="text"\
|
|
data-date-language="en"\
|
|
data-date-weekstart="0"\
|
|
data-date-format="yyyy-mm-dd"\
|
|
data-date-start-view="month"\
|
|
data-initial-date="2013-03-01"/>\
|
|
</div>';
|
|
|
|
// Wrapper div for the htmlstring
|
|
var el = $('<div id="input_binding_test">').prependTo('body');
|
|
el.html(htmlstring);
|
|
|
|
Shiny.initializeInputs(el);
|
|
Shiny.bindAll();
|
|
});
|
|
|
|
afterEach(function(){
|
|
Shiny.unbindAll();
|
|
$('#input_binding_test').remove();
|
|
});
|
|
|
|
// Run tests that are exactly the same for all InputBindings
|
|
common_tests(id, binding_name);
|
|
|
|
it("getValue() works", function() {
|
|
expect(get_value(id)).toEqual(['2012-02-29', '2013-03-01']);
|
|
});
|
|
|
|
it("setValue() works", function() {
|
|
set_value(id, ['2001-01-01', '2014-02-28']);
|
|
expect(get_value(id)).toEqual(['2001-01-01', '2014-02-28']);
|
|
|
|
// Single value only changes the min
|
|
set_value(id, ['2002-02-02']);
|
|
expect(get_value(id)).toEqual(['2002-02-02', '2014-02-28']);
|
|
|
|
// Empty first value: only changes the max
|
|
set_value(id, [undefined, '2010-03-03']);
|
|
expect(get_value(id)).toEqual(['2002-02-02', '2010-03-03']);
|
|
|
|
// Non-array value has no effect
|
|
set_value(id, '2003-03-03');
|
|
expect(get_value(id)).toEqual(['2002-02-02', '2010-03-03']);
|
|
|
|
// Null values have no effect
|
|
set_value(id, [null, null]);
|
|
expect(get_value(id)).toEqual(['2002-02-02', '2010-03-03']);
|
|
|
|
// Invalid date has no effect (the other, valid date works)
|
|
set_value(id, ['2012-02-40', '2012-04-20']);
|
|
expect(get_value(id)).toEqual(['2002-02-02', '2012-04-20']);
|
|
|
|
// Reversed order - works?
|
|
set_value(id, ['2002-02-02', '2001-01-01']);
|
|
expect(get_value(id)).toEqual(['2002-02-02', '2001-01-01']);
|
|
});
|
|
|
|
it("getState() works", function() {
|
|
expect(get_state(id)).toEqual({
|
|
label: 'Date range input:',
|
|
min: null,
|
|
max: null,
|
|
value: ['2012-02-29', '2013-03-01'],
|
|
valueString: ['2012-02-29', '2013-03-01'],
|
|
format: 'yyyy-mm-dd',
|
|
weekstart: 0,
|
|
language: 'en',
|
|
startview: 'month'
|
|
});
|
|
});
|
|
|
|
it("receiveMessage() works", function() {
|
|
var expected_state = {
|
|
label: 'Date range input:',
|
|
min: null,
|
|
max: null,
|
|
value: ['2001-01-01', '2002-02-02'],
|
|
valueString: ['2001-01-01', '2002-02-02'],
|
|
format: 'yyyy-mm-dd',
|
|
weekstart: 0,
|
|
language: 'en',
|
|
startview: 'month'
|
|
};
|
|
|
|
// Set value
|
|
// getValue() and getState().value should be the same
|
|
receive_message(id, { value: ['2001-01-01', '2002-02-02'] });
|
|
expect(get_value(id)).toEqual(['2001-01-01', '2002-02-02']);
|
|
expect(get_state(id)).toEqual(expected_state);
|
|
|
|
// Empty message has no effect
|
|
receive_message(id, { });
|
|
expect(get_state(id)).toEqual(expected_state);
|
|
|
|
// Set label
|
|
receive_message(id, { label:'new label' });
|
|
expect(get_state(id)).toEqual(
|
|
$.extend(expected_state, { label:'new label' })
|
|
);
|
|
|
|
// Set format, separator, minDate, maxDate
|
|
receive_message(id, {
|
|
min: '2000-01-01',
|
|
max: '2020-12-31'
|
|
});
|
|
expect(get_state(id)).toEqual(
|
|
$.extend(expected_state, {
|
|
min: '2000-01-01',
|
|
max: '2020-12-31'
|
|
})
|
|
);
|
|
|
|
});
|
|
});
|
|
|
|
|
|
// ===========================================================================
|
|
describe("dateRangeInputBinding with mm/dd/yy format, min, max, and startview", function() {
|
|
var id = 'in_daterange';
|
|
|
|
beforeEach(function(){
|
|
// Generated by:
|
|
// cat(format(dateRangeInput('id', 'Date range input:',
|
|
// start = '2012-02-09', end = '2013-03-01',
|
|
// min = '2012-02-01', max = '2013-05-04',
|
|
// format = 'mm/dd/yy', weekstart = 2, startview = 'decade')))
|
|
var htmlstring =
|
|
'<div id="' + id + '" class="shiny-date-range-input input-daterange">\
|
|
<label class="control-label" for="' + id + '">Date range input:</label>\
|
|
<input\
|
|
class="input-small"\
|
|
type="text"\
|
|
data-date-language="en"\
|
|
data-date-weekstart="2"\
|
|
data-date-format="mm/dd/yy"\
|
|
data-date-start-view="decade"\
|
|
data-min-date="2012-02-01"\
|
|
data-max-date="2013-05-04"\
|
|
data-initial-date="2012-02-29"/>\
|
|
to \
|
|
<input\
|
|
class="input-small"\
|
|
type="text"\
|
|
data-date-language="en"\
|
|
data-date-weekstart="2"\
|
|
data-date-format="mm/dd/yy"\
|
|
data-date-start-view="decade"\
|
|
data-min-date="2012-02-01"\
|
|
data-max-date="2013-05-04"\
|
|
data-initial-date="2013-03-01"/>\
|
|
</div>';
|
|
|
|
// Wrapper div for the htmlstring
|
|
var el = $('<div id="input_binding_test">').prependTo('body');
|
|
el.html(htmlstring);
|
|
|
|
Shiny.initializeInputs(el);
|
|
Shiny.bindAll();
|
|
});
|
|
|
|
afterEach(function(){
|
|
Shiny.unbindAll();
|
|
$('#input_binding_test').remove();
|
|
});
|
|
|
|
it("getValue() works", function() {
|
|
expect(get_value(id)).toEqual(['2012-02-29', '2013-03-01']);
|
|
});
|
|
|
|
it("setValue() works", function() {
|
|
set_value(id, ['2001-01-01', '2014-02-28']);
|
|
expect(get_value(id)).toEqual(['2001-01-01', '2014-02-28']);
|
|
|
|
// Single value only changes the min
|
|
set_value(id, ['2002-02-02']);
|
|
expect(get_value(id)).toEqual(['2002-02-02', '2014-02-28']);
|
|
|
|
// Empty first value: only changes the max
|
|
set_value(id, [undefined, '2010-03-03']);
|
|
expect(get_value(id)).toEqual(['2002-02-02', '2010-03-03']);
|
|
|
|
// Non-array value has no effect
|
|
set_value(id, '2003-03-03');
|
|
expect(get_value(id)).toEqual(['2002-02-02', '2010-03-03']);
|
|
|
|
// Null values have no effect
|
|
set_value(id, [null, null]);
|
|
expect(get_value(id)).toEqual(['2002-02-02', '2010-03-03']);
|
|
|
|
// Invalid date has no effect (the other, valid date works)
|
|
set_value(id, ['2012-02-40', '2012-04-20']);
|
|
expect(get_value(id)).toEqual(['2002-02-02', '2012-04-20']);
|
|
|
|
// Reversed order - works?
|
|
set_value(id, ['2002-02-02', '2001-01-01']);
|
|
expect(get_value(id)).toEqual(['2002-02-02', '2001-01-01']);
|
|
});
|
|
|
|
it("getState() works", function() {
|
|
expect(get_state(id)).toEqual({
|
|
label: 'Date range input:',
|
|
min: "2012-02-01",
|
|
max: "2013-05-04",
|
|
value: ['2012-02-29', '2013-03-01'],
|
|
valueString: ['02/29/12', '03/01/13'],
|
|
format: 'mm/dd/yy',
|
|
weekstart: 2,
|
|
language: 'en',
|
|
startview: 'decade'
|
|
});
|
|
});
|
|
|
|
it("receiveMessage() works", function() {
|
|
var expected_state = {
|
|
label: 'Date range input:',
|
|
min: "2012-02-01",
|
|
max: "2013-05-04",
|
|
value: ['2012-04-02', '2012-04-03'],
|
|
valueString: ['04/02/12', '04/03/12'],
|
|
format: 'mm/dd/yy',
|
|
weekstart: 2,
|
|
language: 'en',
|
|
startview: 'decade'
|
|
};
|
|
|
|
// Set value
|
|
// getValue() and getState().value should be the same
|
|
receive_message(id, { value: ['2012-04-02', '2012-04-03'] });
|
|
expect(get_value(id)).toEqual(['2012-04-02', '2012-04-03']);
|
|
expect(get_state(id)).toEqual(expected_state);
|
|
|
|
// Empty message has no effect
|
|
receive_message(id, { });
|
|
expect(get_state(id)).toEqual(expected_state);
|
|
|
|
// Set label
|
|
receive_message(id, { label:'new label' });
|
|
expect(get_state(id)).toEqual(
|
|
$.extend(expected_state, { label:'new label' })
|
|
);
|
|
|
|
// Set format, separator, minDate, maxDate
|
|
receive_message(id, {
|
|
min: '2000-01-01',
|
|
max: '2020-12-31'
|
|
});
|
|
expect(get_state(id)).toEqual(
|
|
$.extend(expected_state, {
|
|
min: '2000-01-01',
|
|
max: '2020-12-31'
|
|
})
|
|
);
|
|
|
|
});
|
|
});
|
|
|
|
|
|
// ===========================================================================
|
|
describe("dateRangeInputBinding with empty start/end values", function() {
|
|
var id = 'in_daterange';
|
|
|
|
beforeEach(function(){
|
|
// Generated by (with some bits removed):
|
|
// cat(format(dateRangeInput('id', 'Date range input:')))
|
|
var htmlstring =
|
|
'<div id="' + id + '" class="shiny-date-range-input input-daterange">\
|
|
<label class="control-label" for="' + id + '">Date range input:</label>\
|
|
<input\
|
|
class="input-small"\
|
|
type="text"/>\
|
|
to \
|
|
<input\
|
|
class="input-small"\
|
|
type="text"/>\
|
|
</div>';
|
|
|
|
// Wrapper div for the htmlstring
|
|
var el = $('<div id="input_binding_test">').prependTo('body');
|
|
el.html(htmlstring);
|
|
|
|
Shiny.initializeInputs(el);
|
|
Shiny.bindAll();
|
|
});
|
|
|
|
afterEach(function(){
|
|
Shiny.unbindAll();
|
|
$('#input_binding_test').remove();
|
|
});
|
|
|
|
it("getValue() works", function() {
|
|
var date = local_date_string()
|
|
expect(get_value(id)).toEqual([date, date]);
|
|
});
|
|
});
|
|
|
|
|
|
// ===========================================================================
|
|
describe("selectInputBinding", function() {
|
|
var id = 'in_select';
|
|
var binding_name = 'selectInput'; // Name of the input binding in the registry
|
|
|
|
beforeEach(function(){
|
|
var htmlstring =
|
|
'<label class="control-label" for="' + id + '">Select input:</label>\
|
|
<select id="' + id + '">\
|
|
<option value="option1" selected="selected">option1 label</option>\
|
|
<option value="option2">option2 label</option>\
|
|
</select>';
|
|
|
|
// Wrapper div for the htmlstring
|
|
var el = $('<div id="input_binding_test">').prependTo('body');
|
|
el.html(htmlstring);
|
|
|
|
Shiny.bindAll();
|
|
});
|
|
|
|
afterEach(function(){
|
|
Shiny.unbindAll();
|
|
$('#input_binding_test').remove();
|
|
});
|
|
|
|
// Run tests that are exactly the same for all InputBindings
|
|
common_tests(id, binding_name);
|
|
|
|
it("getValue() works", function() {
|
|
expect(get_value(id)).toBe('option1');
|
|
});
|
|
|
|
it("setValue() works", function() {
|
|
set_value(id, 'option2');
|
|
expect(get_value(id)).toBe('option2');
|
|
|
|
// Setting to nonexistent option should have no effect
|
|
// NOTE: this actually resets it to the first option
|
|
set_value(id, 'option999');
|
|
expect(get_value(id)).toBe('option1');
|
|
});
|
|
|
|
it("getState() works", function() {
|
|
expect(get_state(id)).toEqual({
|
|
label: 'Select input:',
|
|
value: 'option1',
|
|
options: [
|
|
{ value: 'option1', label: 'option1 label', selected: true },
|
|
{ value: 'option2', label: 'option2 label', selected: false }
|
|
]
|
|
});
|
|
});
|
|
|
|
it("receiveMessage() works", function() {
|
|
var state_complete = {
|
|
label: 'Select input:',
|
|
value: 'option4',
|
|
options: [
|
|
{ value: 'option3', label: 'option3 label', selected: false },
|
|
{ value: 'option4', label: 'option4 label', selected: true }
|
|
]
|
|
};
|
|
receive_message(id, state_complete);
|
|
expect(get_value(id)).toBe('option4');
|
|
expect(get_state(id)).toEqual(state_complete);
|
|
|
|
// Empty message has no effect
|
|
receive_message(id, { });
|
|
expect(get_state(id)).toEqual(state_complete);
|
|
|
|
// Don't provide value, but set selected:true on an option
|
|
var state_novalue = {
|
|
options: [
|
|
{ value: 'option5', label: 'option5 label', selected: false },
|
|
{ value: 'option6', label: 'option6 label', selected: true }
|
|
]
|
|
};
|
|
var state_novalue_expected = {
|
|
label: 'Select input:',
|
|
value: 'option6',
|
|
options: state_novalue.options
|
|
};
|
|
receive_message(id, state_novalue);
|
|
expect(get_value(id)).toBe('option6');
|
|
expect(get_state(id)).toEqual(state_novalue_expected);
|
|
|
|
|
|
// Provide value, but no selected:true
|
|
var state_noselected = {
|
|
value: 'option7',
|
|
options: [
|
|
{ value: 'option7', label: 'option7 label'},
|
|
{ value: 'option8', label: 'option8 label'}
|
|
]
|
|
};
|
|
var state_noselected_expected = {
|
|
label: 'Select input:',
|
|
value: 'option7',
|
|
options: [
|
|
{ value: 'option7', label: 'option7 label', selected: true },
|
|
{ value: 'option8', label: 'option8 label', selected: false }
|
|
]
|
|
};
|
|
receive_message(id, state_noselected);
|
|
expect(get_value(id)).toBe('option7');
|
|
expect(get_state(id)).toEqual(state_noselected_expected);
|
|
|
|
// Set label
|
|
var state_newlabel_complete = {
|
|
label: 'new label',
|
|
value: 'option9',
|
|
options: [
|
|
{ value: 'option9', label: 'option9 label', selected: true },
|
|
{ value: 'option10', label: 'option10 label', selected: false }
|
|
]
|
|
};
|
|
receive_message(id, state_newlabel_complete);
|
|
expect(get_state(id)).toEqual(state_newlabel_complete);
|
|
});
|
|
});
|
|
|
|
|
|
// ===========================================================================
|
|
describe("radioInputBinding", function() {
|
|
var id = 'in_radio';
|
|
var binding_name = 'radioInput'; // Name of the input binding in the registry
|
|
|
|
beforeEach(function(){
|
|
var htmlstring =
|
|
'<div id="' + id + '" class="control-group shiny-input-radiogroup">\
|
|
<label class="control-label" for="' + id + '">Radio buttons:</label>\
|
|
<label class="radio">\
|
|
<input type="radio" name="' + id + '" id="' + id + '1" value="option1" checked="checked"/>\
|
|
<span>option1 label</span>\
|
|
</label>\
|
|
<label class="radio">\
|
|
<input type="radio" name="' + id + '" id="' + id + '2" value="option2"/>\
|
|
<span>option2 label</span>\
|
|
</label>\
|
|
</div>';
|
|
|
|
// Wrapper div for the htmlstring
|
|
var el = $('<div id="input_binding_test">').prependTo('body');
|
|
el.html(htmlstring);
|
|
|
|
Shiny.bindAll();
|
|
});
|
|
|
|
afterEach(function(){
|
|
Shiny.unbindAll();
|
|
$('#input_binding_test').remove();
|
|
});
|
|
|
|
// Run tests that are exactly the same for all InputBindings
|
|
common_tests(id, binding_name);
|
|
|
|
it("getValue() works", function() {
|
|
expect(get_value(id)).toBe('option1');
|
|
});
|
|
|
|
it("setValue() works", function() {
|
|
set_value(id, 'option2');
|
|
expect(get_value(id)).toBe('option2');
|
|
|
|
// Setting to nonexistent option should have no effect
|
|
set_value(id, 'option100');
|
|
expect(get_value(id)).toBe('option2');
|
|
});
|
|
|
|
it("getState() works", function() {
|
|
expect(get_state(id)).toEqual({
|
|
label: 'Radio buttons:',
|
|
value: 'option1',
|
|
options: [
|
|
{ value: 'option1', label: 'option1 label', checked: true },
|
|
{ value: 'option2', label: 'option2 label', checked: false }
|
|
]
|
|
});
|
|
});
|
|
|
|
it("receiveMessage() works", function() {
|
|
var state_complete = {
|
|
label: 'Radio buttons:',
|
|
value: 'option4',
|
|
options: [
|
|
{ value: 'option3', label: 'option3 label', checked: false },
|
|
{ value: 'option4', label: 'option4 label', checked: true }
|
|
]
|
|
};
|
|
receive_message(id, state_complete);
|
|
expect(get_value(id)).toBe('option4');
|
|
expect(get_state(id)).toEqual(state_complete);
|
|
|
|
// Empty message has no effect
|
|
receive_message(id, { });
|
|
expect(get_state(id)).toEqual(state_complete);
|
|
|
|
// Don't provide value, but set checked:true on an option
|
|
var state_novalue = {
|
|
options: [
|
|
{ value: 'option5', label: 'option5 label', checked: false },
|
|
{ value: 'option6', label: 'option6 label', checked: true }
|
|
]
|
|
};
|
|
var state_novalue_expected = {
|
|
label: 'Radio buttons:',
|
|
value: 'option6',
|
|
options: state_novalue.options
|
|
};
|
|
receive_message(id, state_novalue);
|
|
expect(get_value(id)).toBe('option6');
|
|
expect(get_state(id)).toEqual(state_novalue_expected);
|
|
|
|
|
|
// Provide value, but no checked:true
|
|
var state_nochecked = {
|
|
value: 'option7',
|
|
options: [
|
|
{ value: 'option7', label: 'option7 label'},
|
|
{ value: 'option8', label: 'option8 label'}
|
|
]
|
|
};
|
|
var state_nochecked_expected = {
|
|
label: 'Radio buttons:',
|
|
value: 'option7',
|
|
options: [
|
|
{ value: 'option7', label: 'option7 label', checked: true },
|
|
{ value: 'option8', label: 'option8 label', checked: false }
|
|
]
|
|
};
|
|
receive_message(id, state_nochecked);
|
|
expect(get_value(id)).toBe('option7');
|
|
expect(get_state(id)).toEqual(state_nochecked_expected);
|
|
|
|
// Set label
|
|
var state_newlabel_complete = {
|
|
label: 'new label',
|
|
value: 'option9',
|
|
options: [
|
|
{ value: 'option9', label: 'option9 label', checked: true },
|
|
{ value: 'option10', label: 'option10 label', checked: false }
|
|
]
|
|
};
|
|
receive_message(id, state_newlabel_complete);
|
|
expect(get_state(id)).toEqual(state_newlabel_complete);
|
|
});
|
|
});
|
|
|
|
|
|
|
|
// ===========================================================================
|
|
describe("checkboxGroupInputBinding", function() {
|
|
var id = 'in_checkboxgroup';
|
|
var binding_name = 'checkboxGroupInput'; // Name of the input binding in the registry
|
|
|
|
beforeEach(function(){
|
|
// Generated by:
|
|
// cat(format(checkboxGroupInput('in_checkboxgroup', 'Checkbox group:',
|
|
// choices = c('option1 label' = 'option1', 'option2 label' = 'option2'))))
|
|
var htmlstring =
|
|
'<div id="' + id + '" class="control-group shiny-input-checkboxgroup">\
|
|
<label class="control-label" for="in_checkboxgroup">Checkbox group:</label>\
|
|
<label class="checkbox">\
|
|
<input type="checkbox" name="' + id + '" id="' + id + '1" value="option1" checked="checked"/>\
|
|
<span>option1 label</span>\
|
|
</label>\
|
|
<label class="checkbox">\
|
|
<input type="checkbox" name="' + id + '" id="' + id + '2" value="option2"/>\
|
|
<span>option2 label</span>\
|
|
</label>\
|
|
</div>';
|
|
|
|
// Wrapper div for the htmlstring
|
|
var el = $('<div id="input_binding_test">').prependTo('body');
|
|
el.html(htmlstring);
|
|
|
|
Shiny.bindAll();
|
|
});
|
|
|
|
afterEach(function(){
|
|
Shiny.unbindAll();
|
|
$('#input_binding_test').remove();
|
|
});
|
|
|
|
// Run tests that are exactly the same for all InputBindings
|
|
common_tests(id, binding_name);
|
|
|
|
it("getValue() works", function() {
|
|
// Should return an array of values
|
|
expect(get_value(id)).toEqual(['option1']);
|
|
});
|
|
|
|
it("setValue() works", function() {
|
|
// Accept single value
|
|
set_value(id, 'option2');
|
|
expect(get_value(id)).toEqual(['option2']);
|
|
|
|
// Accept array of values
|
|
set_value(id, ['option1', 'option2']);
|
|
expect(get_value(id)).toEqual(['option1', 'option2']);
|
|
|
|
set_value(id, ['option2']);
|
|
expect(get_value(id)).toEqual(['option2']);
|
|
|
|
// Accept empty array of values
|
|
set_value(id, [ ]);
|
|
expect(get_value(id)).toEqual([ ]);
|
|
|
|
// Setting to nonexistent option should have no effect
|
|
set_value(id, 'option100');
|
|
expect(get_value(id)).toEqual([ ]);
|
|
|
|
set_value(id, ['option100', 'option2']);
|
|
expect(get_value(id)).toEqual(['option2']);
|
|
});
|
|
|
|
it("getState() works", function() {
|
|
expect(get_state(id)).toEqual({
|
|
label: 'Checkbox group:',
|
|
value: ['option1'],
|
|
options: [
|
|
{ value: 'option1', label: 'option1 label', checked: true },
|
|
{ value: 'option2', label: 'option2 label', checked: false }
|
|
]
|
|
});
|
|
});
|
|
|
|
it("receiveMessage() works", function() {
|
|
var state_complete = {
|
|
label: 'Checkbox group:',
|
|
value: ['option4'],
|
|
options: [
|
|
{ value: 'option3', label: 'option3 label', checked: false },
|
|
{ value: 'option4', label: 'option4 label', checked: true }
|
|
]
|
|
};
|
|
receive_message(id, state_complete);
|
|
expect(get_value(id)).toEqual(['option4']);
|
|
expect(get_state(id)).toEqual(state_complete);
|
|
|
|
// Empty message has no effect
|
|
receive_message(id, { });
|
|
expect(get_state(id)).toEqual(state_complete);
|
|
|
|
// Don't provide value, but set checked:true on an option
|
|
var state_novalue = {
|
|
options: [
|
|
{ value: 'option5', label: 'option5 label', checked: true },
|
|
{ value: 'option6', label: 'option6 label', checked: true }
|
|
]
|
|
};
|
|
var state_novalue_expected = {
|
|
label: 'Checkbox group:',
|
|
value: ['option5', 'option6'],
|
|
options: state_novalue.options
|
|
};
|
|
receive_message(id, state_novalue);
|
|
expect(get_value(id)).toEqual(['option5', 'option6']);
|
|
expect(get_state(id)).toEqual(state_novalue_expected);
|
|
|
|
|
|
// Provide value, but no checked:true
|
|
var state_nochecked = {
|
|
value: 'option7',
|
|
options: [
|
|
{ value: 'option7', label: 'option7 label'},
|
|
{ value: 'option8', label: 'option8 label'}
|
|
]
|
|
};
|
|
var state_nochecked_expected = {
|
|
label: 'Checkbox group:',
|
|
value: ['option7'],
|
|
options: [
|
|
{ value: 'option7', label: 'option7 label', checked: true },
|
|
{ value: 'option8', label: 'option8 label', checked: false }
|
|
]
|
|
};
|
|
receive_message(id, state_nochecked);
|
|
expect(get_value(id)).toEqual(['option7']);
|
|
expect(get_state(id)).toEqual(state_nochecked_expected);
|
|
|
|
// Set label
|
|
var state_newlabel_complete = {
|
|
label: 'Checkbox group new label:',
|
|
value: ['option4'],
|
|
options: [
|
|
{ value: 'option3', label: 'option3 label', checked: false },
|
|
{ value: 'option4', label: 'option4 label', checked: true }
|
|
]
|
|
};
|
|
receive_message(id, state_newlabel_complete);
|
|
expect(get_state(id)).toEqual(state_newlabel_complete);
|
|
|
|
});
|
|
});
|
|
|
|
|
|
// ===========================================================================
|
|
describe("actionButtonInputBinding", function() {
|
|
var id = 'in_actionbutton';
|
|
var binding_name = 'actionButtonInput'; // Name of the input binding in the registry
|
|
|
|
beforeEach(function(){
|
|
var htmlstring =
|
|
'<button id="' + id + '" type="button" class="btn action-button">button label</button>';
|
|
|
|
// Wrapper div for the htmlstring
|
|
var el = $('<div id="input_binding_test">').prependTo('body');
|
|
el.html(htmlstring);
|
|
|
|
Shiny.bindAll();
|
|
});
|
|
|
|
afterEach(function(){
|
|
Shiny.unbindAll();
|
|
$('#input_binding_test').remove();
|
|
});
|
|
|
|
// Run tests that are exactly the same for all InputBindings
|
|
common_tests(id, binding_name);
|
|
|
|
it("getValue() works", function() {
|
|
expect(get_value(id)).toEqual(0);
|
|
});
|
|
|
|
it("click event increments counter", function() {
|
|
expect(get_value(id)).toEqual(0);
|
|
|
|
select_input_object(id).trigger('click');
|
|
expect(get_value(id)).toEqual(1);
|
|
|
|
select_input_object(id).trigger('click');
|
|
expect(get_value(id)).toEqual(2);
|
|
});
|
|
|
|
it("setValue() works", function() {
|
|
set_value(id, 2000);
|
|
expect(get_value(id)).toEqual(2000);
|
|
});
|
|
|
|
it("getState() works", function() {
|
|
expect(get_state(id)).toEqual({ value: 0 });
|
|
});
|
|
|
|
it("receiveMessage() has no effect", function() {
|
|
receive_message(id, { value: 2000 });
|
|
expect(get_state(id)).toEqual({ value: 0 });
|
|
|
|
receive_message(id, { });
|
|
expect(get_state(id)).toEqual({ value: 0 });
|
|
});
|
|
});
|
|
|
|
|
|
// ===========================================================================
|
|
describe("bootstrapTabInputBinding", function() {
|
|
var id = 'in_tabset';
|
|
var binding_name = 'bootstrapTabInput'; // Name of the input binding in the registry
|
|
|
|
beforeEach(function(){
|
|
var htmlstring =
|
|
'<div class="tabbable">\
|
|
<ul class="nav nav-tabs" id="' + id + '">\
|
|
<li class="active">\
|
|
<a href="#tab-455-1" data-toggle="tab">panel1</a>\
|
|
</li>\
|
|
<li>\
|
|
<a href="#tab-455-2" data-toggle="tab">panel2</a>\
|
|
</li>\
|
|
</ul>\
|
|
<div class="tab-content">\
|
|
<div class="tab-pane active" title="panel1" id="tab-455-1">\
|
|
<p>This is the first panel.</p>\
|
|
</div>\
|
|
<div class="tab-pane" title="panel2" id="tab-455-2">\
|
|
<p>This is the second panel.</p>\
|
|
</div>\
|
|
</div>\
|
|
</div>';
|
|
|
|
// Wrapper div for the htmlstring
|
|
var el = $('<div id="input_binding_test">').prependTo('body');
|
|
el.html(htmlstring);
|
|
|
|
Shiny.bindAll();
|
|
});
|
|
|
|
afterEach(function(){
|
|
Shiny.unbindAll();
|
|
$('#input_binding_test').remove();
|
|
});
|
|
|
|
// Run tests that are exactly the same for all InputBindings
|
|
common_tests(id, binding_name);
|
|
|
|
it("getValue() works", function() {
|
|
expect(get_value(id)).toEqual('panel1');
|
|
});
|
|
|
|
it("setValue() works", function() {
|
|
set_value(id, 'panel2');
|
|
expect(get_value(id)).toEqual('panel2');
|
|
|
|
set_value(id, 'panel1');
|
|
expect(get_value(id)).toEqual('panel1');
|
|
});
|
|
|
|
it("getState() works", function() {
|
|
expect(get_state(id)).toEqual({ value: 'panel1' });
|
|
});
|
|
|
|
it("receiveMessage() works", function() {
|
|
receive_message(id, { value: 'panel2' });
|
|
expect(get_value(id)).toEqual('panel2');
|
|
expect(get_state(id)).toEqual({ value: 'panel2' });
|
|
|
|
// Empty message has no effect
|
|
receive_message(id, { });
|
|
expect(get_state(id)).toEqual({ value: 'panel2' });
|
|
});
|
|
});
|
|
|
|
});
|