select-one input is now not focusable in disabled state (fixes #137)

This commit is contained in:
Adam Mockor 2017-04-04 12:58:16 +02:00
parent 9bb84df8d0
commit 6d894d4352
2 changed files with 42 additions and 0 deletions

View file

@ -881,6 +881,9 @@ class Choices {
this.input.removeAttribute('disabled');
this.containerOuter.classList.remove(this.config.classNames.disabledState);
this.containerOuter.removeAttribute('aria-disabled');
if (this.passedElement.type === 'select-one') {
this.containerOuter.setAttribute('tabindex', '0');
}
}
return this;
}
@ -899,6 +902,9 @@ class Choices {
this.input.setAttribute('disabled', '');
this.containerOuter.classList.add(this.config.classNames.disabledState);
this.containerOuter.setAttribute('aria-disabled', 'true');
if (this.passedElement.type === 'select-one') {
this.containerOuter.setAttribute('tabindex', '-1');
}
}
return this;
}

View file

@ -781,6 +781,42 @@ it('should trigger hideDropdown on dropdown closing', function() {
});
});
describe('should handle public methods on select-one input types', function() {
beforeEach(function() {
this.input = document.createElement('select');
this.input.className = 'js-choices';
this.input.placeholder = 'Placeholder text';
for (let i = 1; i < 10; i++) {
const option = document.createElement('option');
option.value = `Value ${i}`;
option.innerHTML = `Value ${i}`;
if (i % 2) {
option.selected = true;
}
this.input.appendChild(option);
}
document.body.appendChild(this.input);
this.choices = new Choices(this.input);
});
it('should handle disable()', function() {
this.choices.disable();
expect(this.choices.containerOuter.getAttribute('tabindex')).toBe('-1');
});
it('should handle enable()', function() {
this.choices.enable();
expect(this.choices.containerOuter.getAttribute('tabindex')).toBe('0');
});
});
describe('should handle public methods on text input types', function() {
beforeEach(function() {
this.input = document.createElement('input');