109 lines
3.2 KiB
JavaScript
109 lines
3.2 KiB
JavaScript
|
|
describe('optgroups', function() {
|
|
|
|
var options = [
|
|
{optgroup: 'mammal', value: "dog" },
|
|
{optgroup: 'mammal', value: "cat" },
|
|
{optgroup: 'bird', value: 'duck'},
|
|
{optgroup: 'bird', value: 'chicken'},
|
|
{optgroup: 'reptile', value: 'snake'},
|
|
{optgroup: 'reptile', value: 'lizard'},
|
|
];
|
|
|
|
var groups = [
|
|
{value: 'tetrapods', label: 'Tetrapods'},
|
|
{value: 'mammal', label: 'Mammal'},
|
|
{value: 'bird', label: 'Bird'},
|
|
{value: 'reptile', label: 'Reptile'},
|
|
];
|
|
|
|
|
|
it_n('init', function(){
|
|
|
|
var test = setup_test('<input>',{
|
|
labelField: 'value',
|
|
searchField: ['value'],
|
|
options: options,
|
|
optgroups: groups
|
|
});
|
|
|
|
assert.equal(Object.keys(test.instance.options).length, 6);
|
|
assert.equal(Object.keys(test.instance.optgroups).length, 4);
|
|
});
|
|
|
|
|
|
it_n('load optgroups', function(done) {
|
|
var test = setup_test('<input>',{
|
|
labelField: 'value',
|
|
searchField: ['value'],
|
|
preload: true,
|
|
load: function(query, loadcb) {
|
|
|
|
loadcb(options,groups);
|
|
|
|
assert.equal(Object.keys(test.instance.options).length, 6);
|
|
assert.equal(Object.keys(test.instance.optgroups).length, 4);
|
|
done();
|
|
}
|
|
});
|
|
});
|
|
|
|
it_n('duplicates & mode=single', async function(){
|
|
|
|
var test = setup_test('<select>',{
|
|
labelField: 'value',
|
|
searchField: ['value'],
|
|
options: options,
|
|
optgroups: groups,
|
|
duplicates: true,
|
|
items:['dog'],
|
|
lockOptgroupOrder: true,
|
|
closeAfterSelect: true,
|
|
});
|
|
|
|
async function TestGroupValue(group,value){
|
|
|
|
assert.isTrue(test.instance.isOpen, 'should be open to start');
|
|
var clone = test.instance.dropdown_content.querySelector(`[data-group="${group}"]`).querySelector(`[data-value="${value}"]`);
|
|
await asyncClick(clone);
|
|
assert.isFalse(test.instance.isOpen, 'should be closed after select');
|
|
await asyncClick(test.instance.control);
|
|
assert.isTrue(test.instance.isOpen, 'should be open after click');
|
|
assert.equal( test.instance.activeOption.dataset.value, value );
|
|
assert.isOk( test.instance.activeOption.closest(`[data-group="${group}"]`), `activeOption should be in ${group} group` );
|
|
|
|
}
|
|
|
|
|
|
await asyncClick(test.instance.control);
|
|
|
|
|
|
assert.equal(Object.keys(test.instance.options).length, 6);
|
|
assert.equal(Object.keys(test.instance.optgroups).length, 4);
|
|
assert.equal(test.instance.dropdown_content.querySelectorAll('.option').length, 6);
|
|
assert.equal(test.instance.dropdown_content.querySelector('[data-group="mammal"]').querySelectorAll('.active').length , 1, 'active option should be in mammal group');
|
|
|
|
test.instance.options.dog.optgroup = ['mammal','tetrapods'];
|
|
test.instance.refreshOptions(false);
|
|
|
|
assert.equal(Object.keys(test.instance.options).length, 6);
|
|
assert.equal(test.instance.dropdown_content.querySelectorAll('.option').length,7);
|
|
assert.equal(test.instance.dropdown_content.querySelector('[data-group="mammal"]').querySelectorAll('.active').length , 1, 'active option should still be in mammal group');
|
|
|
|
|
|
test.instance.options.cat.optgroup = ['mammal','tetrapods'];
|
|
test.instance.refreshOptions(false);
|
|
|
|
// clicking on duplicates: dog
|
|
await TestGroupValue('mammal','dog');
|
|
await TestGroupValue('tetrapods','dog');
|
|
|
|
await TestGroupValue('mammal','cat');
|
|
await TestGroupValue('tetrapods','cat');
|
|
|
|
});
|
|
|
|
|
|
|
|
});
|