Commit 15ba56b2 authored by David Stutz's avatar David Stutz

Follow up on #666.

parent f6910e40
...@@ -706,72 +706,72 @@ describe('Bootstrap Multiselect Specific Issues', function() { ...@@ -706,72 +706,72 @@ describe('Bootstrap Multiselect Specific Issues', function() {
}); });
}); });
describe('Test knockout binding', function() { describe('Knockout Binding', function() {
var $testArea; var $testArea;
afterEach(function() { afterEach(function() {
if ($testArea) { if ($testArea) {
$testArea.multiselect('destroy').remove(); $testArea.multiselect('destroy').remove();
} }
}); });
it('should update values and options with an observable array', function() { it('Should update values and options with an observable array', function() {
jasmine.clock().install(); jasmine.clock().install();
$testArea = $('<select multiple="multiple" data-bind="selectedOptions: myValues, options: myOptions, multiselect: {numberDisplayed: 1}"></select>').appendTo(document.body); $testArea = $('<select multiple="multiple" data-bind="selectedOptions: myValues, options: myOptions, multiselect: {numberDisplayed: 1}"></select>').appendTo(document.body);
var viewModel = { var viewModel = {
myValues: ko.observableArray(), myValues: ko.observableArray(),
myOptions: ko.observableArray([]) myOptions: ko.observableArray([])
}; };
expect(ko.bindingHandlers.multiselect.init !== undefined).toEqual(true); expect(ko.bindingHandlers.multiselect.init !== undefined).toEqual(true);
var optionSpy = spyOn(ko.bindingHandlers.selectedOptions, 'init').and.callThrough(),
multiSpy = spyOn(ko.bindingHandlers.multiselect, 'init').and.callThrough();
ko.applyBindings(viewModel, $testArea[0]); var optionSpy = spyOn(ko.bindingHandlers.selectedOptions, 'init').and.callThrough();
var multiSpy = spyOn(ko.bindingHandlers.multiselect, 'init').and.callThrough();
// knockout bindings were called ko.applyBindings(viewModel, $testArea[0]);
expect(optionSpy.calls.count()).toEqual(1);
expect(multiSpy.calls.count()).toEqual(1);
// no options are present since myOptions was empty // knockout bindings were called
expect($testArea.find('option').length).toEqual(0); expect(optionSpy.calls.count()).toEqual(1);
expect($testArea.val()).toEqual(null); expect(multiSpy.calls.count()).toEqual(1);
expect($testArea.next().find('button.multiselect').text().trim()).toEqual('None selected');
expect($testArea.next().find('ul li').length).toEqual(0);
// Add more options // no options are present since myOptions was empty
viewModel.myOptions(['option1', 'option2']); expect($testArea.find('option').length).toEqual(0);
jasmine.clock().tick(1000); expect($testArea.val()).toEqual(null);
expect($testArea.next().find('ul li').length).toEqual(2);
expect($testArea.find('option').length).toEqual(2);
expect($testArea.find('option:checked').length).toEqual(0);
// select one expect($testArea.next().find('button.multiselect').text().trim()).toEqual('None selected');
viewModel.myValues(['option2']); expect($testArea.next().find('ul li').length).toEqual(0);
jasmine.clock().tick(1000);
expect($testArea.find('option:checked').length).toEqual(1);
expect($testArea.find('option:checked').text().trim()).toEqual('option2');
// select all // Add more options
viewModel.myValues(['option1', 'option2']); viewModel.myOptions(['option1', 'option2']);
jasmine.clock().tick(1000); jasmine.clock().tick(1000);
expect($testArea.find('option:checked').length).toEqual(2);
expect($testArea.find('option:checked').map(function() { return $(this).text().trim() }).toArray()).toEqual(['option1', 'option2']);
expect($testArea.next().find('button.multiselect').text().trim()).toEqual('All selected (2)');
// add another option expect($testArea.next().find('ul li').length).toEqual(2);
viewModel.myOptions.push('wacky option'); expect($testArea.find('option').length).toEqual(2);
jasmine.clock().tick(1000); expect($testArea.find('option:checked').length).toEqual(0);
expect($testArea.find('option:checked').length).toEqual(2); // select one
expect($testArea.find('option:checked').map(function() { return $(this).text().trim() }).toArray()).toEqual(['option1', 'option2']); viewModel.myValues(['option2']);
expect($testArea.find('option').map(function() { return $(this).text().trim() }).toArray()).toEqual(['option1', 'option2', 'wacky option']); jasmine.clock().tick(1000);
expect($testArea.next().find('button.multiselect').text().trim()).toEqual('2 selected');
}); expect($testArea.find('option:checked').length).toEqual(1);
expect($testArea.find('option:checked').text().trim()).toEqual('option2');
// select all
viewModel.myValues(['option1', 'option2']);
jasmine.clock().tick(1000);
expect($testArea.find('option:checked').length).toEqual(2);
expect($testArea.find('option:checked').map(function() { return $(this).text().trim() }).toArray()).toEqual(['option1', 'option2']);
expect($testArea.next().find('button.multiselect').text().trim()).toEqual('All selected (2)');
// add another option
viewModel.myOptions.push('wacky option');
jasmine.clock().tick(1000);
expect($testArea.find('option:checked').length).toEqual(2);
expect($testArea.find('option:checked').map(function() { return $(this).text().trim() }).toArray()).toEqual(['option1', 'option2']);
expect($testArea.find('option').map(function() { return $(this).text().trim() }).toArray()).toEqual(['option1', 'option2', 'wacky option']);
expect($testArea.next().find('button.multiselect').text().trim()).toEqual('2 selected');
});
}); });
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment